社区首页 >专栏 >仅有两名前端开发，联机小游戏一周内上线，如何做到？

仅有两名前端开发，联机小游戏一周内上线，如何做到？

腾讯云开发TCB

发布于 2023-07-14 06:48:41

1K0

文章被收录于专栏：云开发云开发

这是一款在一周之内完成立项到上线的防疫知识对战小游戏，你玩过吗？

它在上线四小时内用户数激增60倍，获得新华社力荐，开发过程中仅投入2个前端开发+1个美术+1个策划，这款小游戏里，单机玩法、邀请好友对战、在线匹配对战、排行榜、背景音乐音效等功能一应俱全。

一起来战疫

它为什么会诞生？

年初疫情袭来，团队作为游戏从业者，看到周边的人急需解疫情方方面面的信息，比如正确防控措施、医学科普、相关法律法规……然而，大家只能从电视节目、朋友圈分享文章、社区宣传栏等海量的渠道里汲取信息，这样不仅内容分散，再分享给亲友时也比较生硬。有没有一种方法，快速地帮助大家抗疫知识“划重点”，又生动有趣呢？

思前想后，团队决定通过游戏丰富的表现形式、微信小游戏分享和传播能力，来做一款寓教于乐的小游戏，帮助大家提升对防疫知识的了解，为全面防疫战贡献一份力量。

困难和挑战

这款小游戏需要同时兼具科普价值、易玩性和传播性，经过多次讨论，决定在游戏中策划“好友对战”+“个人测评考场”两种玩法，根据构想，这款游戏既有联机玩法，又有单机玩法。这样的游戏形态固然丰富，互动传播效果固然好，但是在实际开发中，联机玩法对于开发者的技术要求较高，且有很大的工作量。

主要难点如下：

(1)以疫情防控为主题的项目，越早上线对防疫的帮助越大，时间不允许开发周期过长。

(2)联机游戏对于后端能力要求很高，而一般小游戏开发团队，很难有足够的后端开发人力和后端开发经验。

(3)游戏想要丰富的表现形式，音效和背景音乐是必不可少的，需要确保使用的音乐素材没有版权问题。

以上困难，不只是开发这款疫情防控小游戏的困难，也是小游戏开发团队经常面临的共性困难。怎么办呢？

工欲善其事必先利其器。选择好的技术方案，事半功倍。首先，给大家介绍这个小游戏的主要技术方案：

云开发（CloudBase） 是云端一体化的后端云服务产品，采用 serverless 架构，免去了移动应用/小游戏构建中繁琐的服务器搭建和运维。同时云开发提供的静态托管、命令行工具 (CLI) 、Flutter SDK等能力极大的降低了应用开发的门槛。使用云开发可以快速构建完整的小程序/小游戏、H5、Web、移动 App 等应用。

小游戏联机对战引擎(MGOBE) 提供客户端SDK和服务端框架，通过接口级接入，使游戏快速拥有高性能联机能力。MGOBE是一款为各平台小游戏、h5小游戏提供房间管理、匹配、帧同步、状态同步等后端服务的产品，适用于MOBA、FPS、休闲对战、回合制等各类联机游戏，让开发者专注于游戏逻辑，免去了对于服务端底层架构和网络通信等问题的顾虑。

正版曲库直通车（AME） 它是基于腾讯音乐娱乐集团（TME）线上背景音乐专用曲库，结合腾讯云存储、内容加速分发等基础能力，为解决内容创作过程中的正版背景音乐素材应用问题设计的 PaaS 产品。在控制台使用域名接入，三步完成了API 调用，便捷地实现背景音乐素材在小游戏内的流畅播放。

开发实践

用云开发在小游戏中实现世界排行榜云开发CloudBase，提供云函数、云数据库、云存储、云调用、CDN、日志等一站式基础能力。我们基于云开发的云数据库和云函数，实现小游戏的世界排行榜。

首先，分析排行榜需要展示的信息。在这款答题小游戏中，排行榜按玩家总分展示上榜玩家的昵称、头像、得分、正确率，同时展示当前玩家的排名（若排名在1000以内，现实玩家具体名次；若排名在1000以外，显示“1000+”）。

具体实现：

1、定义云开发的云数据库数据结构

在云数据库内，定义一张User表，存储玩家信息

定义一张长度为1000的Ranking表，保持积分从高至低排序

2、每局游戏结束后，通过云函数进行数据回档。

定义一个云开发的云函数：updateUsers 用于更新用户数据

（1）更新User表信息，维持User表最新状态

（2）检查玩家当前积分，若积分高于排行榜表内最后一名，则将当前玩家插入排行榜表

3、查看、刷新排行榜时，通过云函数获取排行榜信息

定义一个云函数：requestRanking 用于获取排行榜数据

为了优化加载速度，在请求参数传入排行榜起始位和查询长度，在客户端刷新排行榜时分批请求排行榜数据

（1）获取Ranking表内，通过起始位和查询长度进行切片的玩家id列表

（2）通过玩家id索引User表内玩家信息

用联机对战引擎使小游戏具备联机交互能力小游戏联机对战引擎（MGOBE）提供了客户端SDK，支持直接通过接口调用的方式为游戏实现联机功能。

1、房间管理

首先，通过以下步骤将玩家加入同一个房间，玩家进入同一个房间后，即可开始相互通信。

（1）玩家通过客户端createRoom接口创建房间，通过转发链接将房间号发送给好友

（2）好友通过客户端游戏链接进入，通过joinRoom接口加入房间

2、在线匹配

玩家客户端进入匹配界面后，通过客户端matchPlayers接口发起匹配

调用成功后，Room.onMatch、Room.onCancelMatch 将回调匹配结果。
该接口需要与匹配规则配合使用，因此，匹配超时时间由开发者在匹配规则中定义。开发者需要在控制台上创建匹配，得到匹配 Code 作为该方法的参数 matchCode。
MGOBE控制台支持灵活的规则配置，可通过脚本语言实现1v1、1vN、NvM、KvKvK…、等多种匹配玩法。在这款游戏中，我们使用了如下匹配规则：

3、网络通信

玩家进入房间后，可通过帧同步或状态同步方式开始通信。MGOBE支持直接通过客户端SDK接口，实现帧同步、发送消息到客户端、发送消息到实时服务器。这款答题小游戏中，我们通过调用客户端SDK的sendToGameSvr接口，实现客户端之间的通信

4、实时服务器

MGOBE提供了node.js框架，开发者可在框架内编写自定义服务逻辑，实时服务器可通过控制台一键发布部署，自动进行有状态的弹性扩缩：

房间的系列操作会自动触发到自定义服务逻辑。
前端请求到自定义服务逻辑。当玩家加房成功后，可以使用客户端 SDK 中的 sendToGameSvr 方法直接与游戏服务器通信，实现游戏服务端拓展逻辑，如保存玩家数据，游戏状态同步等。

在这款答题小游戏中，客户端和实时服务器框架交互时序如下：

客户端请求列表：

（1）准备

说明：开始游戏后，每个玩家发送一条READY命令给服务端，只有当前玩家会收到服务端广播。服务端收到第一条READY命令1s后开始游戏，全部玩家会收到服务端广播。

（2）提交答案

说明：客户端针对一道题目提交答案，需要发送SUBMIT命令，并带上作答结果ans。全部玩家会收到服务端广播。

（3）查询当前游戏状态

说明：如果客户端需要主动查询游戏状态，可以发送一条CURRENT命令给服务端，只有当前玩家会收到服务端广播。

用云开发+正版曲库直通车为小游戏接入带版权的背景音乐

“正版曲库直通车”将整个技术实现链路上的诸多环节简化为一个域名，三个接口。

一个域名：在控制台「域名管理」页面开发者可添加一个或多个经过备案的域名，启动后，系统将会自动配置CDN服务，将选购的音乐资源分发至与添加域名关联的资源集群，并在整个链路上进行传输加密。

三个接口：对应曲库三级信息存储架构，分类-歌单-歌曲。

（1）调用“获取分类内容”接口，此接口会返回曲库中的歌单分类信息；

（2）调用“获取分类内容下歌曲列表”接口，获取歌单中的歌曲列表信息，每个歌单分类下提供多首音乐；

（3）调用“获取歌曲播放信息”接口或“获取歌词信息”接口，获取指定歌曲的播放链接或歌词信息

在这款答题小游戏中，我们选择了曲库中的三首合适的背景音乐，通过一个云函数调用上述的“获取歌曲播放信息”接口。当小游戏客户端打开指定的游戏页面时，发起云函数请求，传入当前页面需要播放的音乐ID，获取歌曲的播放链接，再通过播放链接拉取到版权曲库中的音乐资源。

总结

对于小游戏而言，抓住市场的热点动向，快速研发上线，是小游戏成败的关键之一。借助腾讯云提供的云开发（CloudBase）后端云服务、小游戏联机对战引擎(MGOBE)，以及正版曲库直通车，“一起来战疫”这款疫情防护相关小游戏，最终实现了：2个前端开发+1个美术+1个策划，在仅1周时间内，完成项目从立项到上线。

“一起来战疫”借助新华社和腾讯健康，官方、专业、及时的信息与题库，提供了优异的游戏交互体验、丰富有趣的游戏玩法，更及时地为大家普及最新的防疫相关知识，承载了高并发的压力，实现了高质量的玩法和性能交付。