【在线五子棋对战】一、项目简介 && 环境搭建

利刃大大

发布于 2025-05-30 08:48:02

14500

代码可运行

文章被收录于专栏：csdn文章搬运csdn文章搬运

运行总次数：0

代码可运行

Ⅰ. 项目简介

本项目主要实现⼀个网页版的五子棋对战游戏，其主要支持以下核心功能:

用户管理: 实现用户注册，用户登录、获取用户信息、用户天梯分数记录、用户比赛场次记录等
匹配对战: 实现两个玩家在网页端根据天梯分数匹配游戏对⼿，并进行五子棋游戏对战的功能
聊天功能: 实现两个玩家在下棋的同时可以进行实时聊天的功能

Ⅱ. 开发环境

Linux（CentOS-7.6 / Ubuntu-22.04）
vscode/vim
g++/gdb
Makefile

Ⅲ. 核心技术

Http / Websocket
Websocket++
JsonCpp
Mysql
c++11
BlockQueue阻塞队列
HTML / CSS / JS / AJAX

Ⅳ. 环境搭建

① CentOS-7.6环境搭建

1、安装wget工具

wget 工具主要是为了下面我们去下载软件做准备的！如果已经安装过的，就不需要再安装了，因为我们对于 wget 来说并不需要对版本要太大要求。

如果 rpm 指令来看看是否安装：

[liren@VM-8-7-centos ~]$ rpm -qa | grep wget
wget-1.14-18.el7_6.1.x86_64  #这样子代表已经安装

下面是安装的指令：

[liren@VM-8-7-centos ~]$ sudo yum install wget

2、更换软件源

更换软件源主要是为了下载速度的提升，因为默认下载文件都会到 CentOS 的官网去下载，这样子比较慢，所以我们可以换成国内的一些镜像软件源来提高下载速度。

在更换软件源之前，我们要先将系统中的 yum 源给 备份起来，防止丢失，它的路径在 /etc/yum.repos.d/ 下面，.repo 文件表示的就是软件源，而系统官方的 yum 源是 CentOS-Base.repo，备份的话只需要在其名称后面加上一些后缀，比如这里会加 .bak1 后缀，防止后面我们更换软件源之后系统官方的 yum 源被覆盖了！

然后就是更换为其它的官方软件源，这里更换的是阿里云的软件源：

接着我们还要将之前的软件源缓存给清理一下：因为我们下载了新的软件源，那么之前的软件源的缓存就都没用了，直接清理即可：

最后删除了之前的缓存，那么现在我们就要重新创建一个缓存给新的软件源使用：

[liren@VM-8-7-centos ~]$ sudo yum makecache
……
……
Metadata Cache Created
[liren@VM-8-7-centos ~]$

3、安装第三方软件源

因为下面安装软件的时候需要用到一些第三方软件源，所以这里也下载一下，主要是 scl、epel 软件源：

[liren@VM-8-7-centos ~]$ sudo yum install centos-release-scl-rh centos-release-scl

[liren@VM-8-7-centos ~]$ sudo yum install epel-release

4、安装lrzsz传输工具

[liren@VM-8-7-centos ~]$ sudo yum install lrzsz

[liren@VM-8-7-centos ~]$ rz --version
rz (lrzsz) 0.12.20

5、安装高版本gcc/g++编译器

因为编写代码时候需要用到一些高版本的语法，所以要安装高版本的编译器，这和原来的 gcc 编译器是不冲突，直接安装就行！

下面我们先列出软件源中的 gcc/g++ 编译器：

[liren@VM-8-7-centos ~]$ yum search devtoolset

会弹出来很多版本的编译器，我们只需要安装版本 7 的就行了：

接着我们就安装它：

[liren@VM-8-7-centos ~]$ sudo yum install -y devtoolset-7-all
[sudo] password for liren: 
……
……
Complete!

安装完成之后，在 /opt/ 路径下就多了一个文件夹，我们来看看它的关系：

我们需要 去加载一下这个 enable 配置文件，因为虽然我们安装好了编译器，但是原来的 gcc/g++ 编译器默认使用的版本还是旧的那套，如下所示：

但是在下面加载之前，有个问题，就是当前如果是通过命令行去手动加载的话，下次重新打开终端再编译的时候还是得重新加载，如果我们想要 让其永久有效，也就是启动终端就加载这个 enable 配置文件，我们就要 配置一下终端的启动初始化配置文件。

6、安装gdb调试器

[liren@VM-8-7-centos ~]$ sudo yum install -y gdb
……
……
Complete!
[liren@VM-8-7-centos ~]$ gdb --version
GNU gdb (GDB) Red Hat Enterprise Linux 8.0.1-36.el7
Copyright (C) 2017 Free Software Foundation, Inc.
License GPLv3+: GNU GPL version 3 or later <http://gnu.org/licenses/gpl.html>
This is free software: you are free to change and redistribute it.
There is NO WARRANTY, to the extent permitted by law.  Type "show copying"
and "show warranty" for details.
……

7、安装git

[liren@VM-8-7-centos ~]$ sudo yum install -y git
……
……
Complete!
[liren@VM-8-7-centos ~]$ git --version
git version 1.8.3.1

8、安装cmake

[liren@VM-8-7-centos ~]$ sudo yum install -y cmake
……
……
Complete!
[liren@VM-8-7-centos ~]$ cmake --version
cmake version 2.8.12.2

9、安装boost库

因为 boost 库中有很多的工具，如果要我们一个一个去安装不现实，所以我们直接安装 boost-devel.x86_64，这是一个 boost 库的开发包：

[liren@VM-8-7-centos ~]$ sudo yum install -y boost-devel.x86_64
……
……
Complete!

安装完就能在头文件目录中看到 boost 库的文件：

10、安装Jsoncpp库

[liren@VM-8-7-centos ~]$ sudo yum install -y jsoncpp-devel
……
……
Complete!
[liren@VM-8-7-centos ~]$ ls /usr/include/jsoncpp/json/
assertions.h  autolink.h  config.h  features.h 
forwards.h  json.h  reader.h  value.h  version.h  writer.h

11、安装MySQL数据库服务及开发包

这里安装 mysql 的工作，具体参考 mysql 的笔记，不再赘述，主要讲一下一些小细节：

登录查看 mysql 字符集是否正常：

mysql> show variables like '%chara%';          
+--------------------------+----------------------------+
| Variable_name            | Value                      |
+--------------------------+----------------------------+
| character_set_client     | utf8                       |   #客⼾端使⽤的字符集
| character_set_connection | utf8                       |   #客⼾端连接时使⽤的字符集
| character_set_database   | utf8                       |	#数据库创建默认字符集
| character_set_filesystem | binary                     |	#⽂件系统编码格式
| character_set_results    | utf8                       |	#服务器返回结果时的字符
| character_set_server     | utf8                       |	#存储系统元数据的字符集
| character_set_system     | utf8                       |	#系统使⽤的编码格式，不影响
| character_sets_dir       | /usr/share/mysql/charsets/ |
+--------------------------+----------------------------+
8 rows in set (0.00 sec)
mysql>

可以看到编码格式是统一的（文件系统编码不一致不影响），但是如果出现不统一的情况，我们就得去 /etc/my.cnf 配置文件进行修改：

[zwc@VM-8-12-centos workspace]$ sudo vim /etc/my.cnf

// my.cnf 配置文件 //
# For advice on how to change settings please see
# http://dev.mysql.com/doc/refman/5.7/en/server-configuration-defaults.html
[client]
default-character-set=utf8
[mysql]
default-character-set=utf8
[mysqld]
character-set-server=utf8
……

另外再安装一下 mysql 的开发包，也就是一些头文件和库函数：

[liren@VM-8-7-centos echo_server]$ sudo yum install -y mysql-community-devel

12、安装Websocketpp库

这里采用源码安装的形式，将 github 上开源的 Websocketpp 克隆到本地：

[liren@VM-8-7-centos ~]$ git clone https://github.com/zaphoyd/websocketpp.git

接下来进入到这个下载好的文件夹中进行安装：

[liren@VM-8-7-centos ~]$ ls
linux  protobuf-21.11  websocketpp
[liren@VM-8-7-centos ~]$ cd websocketpp/         
[liren@VM-8-7-centos websocketpp]$ ls
build         cmake           COPYING  Doxyfile  readme.md   SConstruct  tutorials    websocketpp-config.cmake.in
changelog.md  CMakeLists.txt  docs     examples  roadmap.md  test        websocketpp
[liren@VM-8-7-centos websocketpp]$ mkdir build
[liren@VM-8-7-centos websocketpp]$ cd build
[liren@VM-8-7-centos build]$ cmake -DCMAKE_INSTALL_PREFIX=/usr ..      #因为websocketpp依赖于cmake来编译，所以要用cmake工具，其中-DCMAKE_INSTALL_PREFIX=/usr表示设置安装路径，将websocketpp的头文件放到usr/include，库文件放到usr/lib/中去；而 .. 表示针对上个目录也就是websocketpp文件夹进行生成make
……
……
[liren@VM-8-7-centos build]$ ls
CMakeCache.txt  CMakeFiles  cmake_install.cmake  install_manifest.txt  Makefile  websocketpp
[liren@VM-8-7-centos build]$ sudo make install
[sudo] password for liren: 
……
……
[liren@VM-8-7-centos build]$

最后验证 websocketpp 是否安装成功：

[liren@VM-8-7-centos build]$ cd ../examples/echo_server
[liren@VM-8-7-centos echo_server]$ ls
CMakeLists.txt  echo_handler.hpp  echo_server.cpp  SConscript
[liren@VM-8-7-centos echo_server]$ g++ -std=c++11 echo_server.cpp -o echo_server -lpthread -lboost_system
[liren@VM-8-7-centos echo_server]$        #编译成功表示安装成功了

编译成功，则表示安装成功了。

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2025-05-29，如有侵权请联系 cloudcommunity@tencent.com 删除

编译器