制作实时五子棋游戏

上传文件、部署架构，然后打开两个浏览器试试。朋友加入在一侧创建的房间，落子的瞬间，另一侧的页面上也会出现同样的一手。胜负和排名由服务器自动记录。

不需要单独的前端构建工具。先用已完成的示例运行一局，然后可以逐一修改数据结构、实时功能和游戏规则。

1. 先运行一局试试

一开始用完整示例 ZIP 起步最快。把架构和页面文件上传到同一个文件夹并部署架构，就可以立即开启对局。

• 下载实时五子棋完整示例 ZIP：包含架构和 index.html、style.css、app.js、README
• 下载五子棋架构文件（.sfn）：只想查看后端结构，或与自己制作的页面连接时使用

运行示例后，可以亲自确认以下场景。

• 使用房间代码的双人对局
• 显示最后一手、我的棋子和当前回合
• 每一手都会重新开始的 3 分钟限时
• 告知进展情况的实时比赛转播
• 显示胜利·失败，并自动更新最近对局和玩家排名

架构中已预先包含 19×19 棋盘、五子连珠获胜，以及胜 3 分·平 1 分·负 0 分的规则。每个用户最多可以创建 3 个等待房间，30 分钟内无人参加的等待房间会被作为清理对象处理。

游戏中运作的功能

一局五子棋中自然地包含了 WebSpace 的主要功能。

重要的一点是，浏览器不会宣布胜利或直接写入分数。服务器确认当前棋盘和回合，只保存正常的落子，然后向两名用户发送相同的结果。

2. 上传到工作空间

如果只下载了架构文件，请上传到团队或个人工作空间的项目文件夹。如果下载了完整示例 ZIP，请通过文件夹上传或压缩文件上传，把五个文件放在同一个文件夹中。

五子棋对局室/
├── gomoku-realtime.sfn
├── index.html
├── style.css
├── app.js
└── README.md

打开架构文件，在数据库结构中确认三张表。

由于对局和战绩分开保存，即使重新打开页面，也能再次加载最近记录和排名。

3. 确认 API 和实时功能

打开顶部的API 构建，确认以下项目。

1. 确认数据库名称为 gomoku。
2. 确认实时套接字为使用。
3. 确认服务器功能为回合制棋盘游戏（turn-based-board）。
4. 确认发送和接收权限为仅成员。
5. 确认三张表的登记和修改 API 已禁用。

关闭登记和修改 API 是有原因的。这是为了防止参与者通过 REST API 直接更改胜利次数或落子记录，并让所有游戏状态变更都经过服务器的事件处理器。

4. 使用 SQLite3 部署

首次运行时，在存储中选择 SQLite3。无需准备单独的数据库地址或账户，是确认示例最简单的方式。

点击部署之前，确认页面上显示的更改内容和权限摘要。如果同名数据库中已有记录，根据服务器的覆盖策略，可能需要管理员或部署负责人的批准。

部署完成后，以下地址格式的 REST API 和 WebSocket 就准备好了。

GET /api/web/gomoku/gomoku_games/list
GET /api/web/gomoku/gomoku_players/list
WS  /api/web/gomoku/realtime-ws

如果生产服务器使用 HTTPS，浏览器必须使用同一域名的安全 wss:// 连接。建议不要在代码中把地址固定为特定的开发域名，而是以当前页面的主机为基准生成。

5. 打开五子棋页面

架构文件创建游戏的数据库和后端，index.html、style.css、app.js 负责棋盘和用户体验。把两部分分开，就可以在保留对局记录的同时只更换页面。

如果上传了完整示例，请选择 index.html 并打开预览。如果只使用架构文件，请在自己制作的 HTML 中连接上面的 REST API 和 WebSocket。

客户端通过 WebSocket 发送 board-game.create、board-game.join、board-game.move 等操作。棋子和分数以服务器返回的确定事件为准显示。

6. 两人实际对局

1. 用不同的成员账户打开同一个 index.html。
2. 在第一个账户中点击创建新对局。
3. 把生成的房间代码传给第二个账户。
4. 在第二个账户中输入代码并点击加入。
5. 轮流落子，确认两个页面上显示相同的一手。
6. 五子连珠后，确认胜利显示、最近对局和排名是否更新。

使用普通窗口和无痕窗口这类登录会话相互独立的浏览器，在一台电脑上也能方便地测试。

结果由服务器记录

横向、纵向或对角线上五子连珠时，服务器会结束对局并保存胜者和分数。即使一手的限时超时，也会以服务器时间为准判定超时负。

如果最近对局和排名没有立即更新，与其反复点击按钮，不如确认流程是否为收到 WebSocket 的结束事件后再重新查询列表。展开页面上的开发信息，还可以查看收发的 JSON 和服务器处理时间。

从这里开始制作我的游戏

turn-based-board 并不是绑定于五子棋这个名称的处理器。在架构文件的处理器设置中更改以下值，就可以把它用作其他回合制游戏的起点。

可以改成小棋盘的快速游戏，或者根据组织活动调整计分规则。还可以在同一实时基础上添加观战页面、赛季排名和团队对战。

五子棋既是一个完成的示例，也是新游戏的起点。把棋子换成怪物和道具就成了回合制战斗，把格子换成题目和选项就成了实时问答。把数据和规则放在架构中，在页面上加入想要制作的游戏的乐趣吧。

遇到问题时

结语

在五子棋示例中，我们把用架构文件创建的数据库和 REST API、仅已登录成员可参与的权限，以及由服务器直接判定的实时游戏状态整合成了一个服务。应用篇的其他示例涵盖用 AI 制作的业务系统、文件夹文件资料公告板、共同怪物团战和 AI 咨询聊天。根据所需功能组合其中几项，仅用 WebSpace 就能制作出大多数内部·面向客户的工具。

接下来可以尝试

• 构建 API 并部署数据库
• 性能与扩展
• 服务与容量