前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >借助云能力,小游戏开发过程是如何升级的?

借助云能力,小游戏开发过程是如何升级的?

原创
作者头像
腾讯云开发者社区技术沙龙
发布2019-10-09 18:17:36
8330
发布2019-10-09 18:17:36
举报

导语 |?9月21日,腾讯云开发者社区技术沙龙“小程序·云开发”北京站圆满落幕。本期沙龙腾讯云联合猫眼、即速应用、白鹭引擎等企业,将从小程序·云开发后台技术、云开发实时数据推送实践、云开发AI智能客服实践等方面揭秘云开发应用实践,带来更多技术实战分享。本文是张宇老师关于如何使用白鹭引擎开发和实时数据推送能力更好的为小程序服务的内容分享。

张宇,白鹭科技高级产品经理,多年页游及 HTML5 游戏开发经验。负责白鹭引擎研发,主导开发了 Egret Launcher 等 IDE 工具。

本文分三个部分:

第一部分认识白鹭引擎

第二部分实时数据推送能力实战项目

第三部分是小游戏+云能力

认识白鹭引擎

白鹭引擎是最早的游戏引擎,如果做H5游戏或者微信小游戏的朋友都认识我们,我们不光可以做H5游戏还可以一键发布到iOS、安卓上的云上应用,所以是跨平台的游戏引擎。我们有非常完整的开发工作流,比如说龙骨动画编辑器还有3D游戏编辑器,这些都可以对开发效率有很大的提升。

这些是用引擎做的比较出名的小游戏,比如说早期的2014年的“围住神经猫”,当时微信刚刚推出了转发分享的功能。南京两个开发者用一天半的时间做出这个游戏,通过分享功能一下就火了。大家多使用腾讯和微信推出的新功能,可能对大家的开发有很大的帮助。现在引擎里已经集成了云开发能力,在新建项目的时候已经默认开启了这个功能,就不需要手动配置了,就更方便了。

实时数据推送能力实战项目

做游戏肯定要涉及到服务器和游戏端数据交互,传统的方式一般分为短连接和长连接。

左边轮询方式是短连接里常见的方式,游戏端向服务器发送一个消息,服务器返回一个消息。游戏端再发一个消息,服务器再返回一个消息,这样一问一答。这种模式下,服务端是不能主动地给游戏端推送消息的,必须游戏先发请求服务端才能返回消息。一般对数据实时性要求不高的游戏一般都用短连接的方式,因为对服务器的压力比较小。比如之前常玩的网页游戏“开心农场”都是短连接,你点一块田地,游戏端会向服务器发送一个收粮食的请求,服务端计算以后告诉前端收100个粮食,然后播放一段收粮食的动画,最后把这个粮食给加上,这就是一个短连接的方式。

还有一种是长连接的方式,比如说Websockets,这是H5里面比较常用的长连接方式。长连接的方式是游戏端和服务端一直保持着同时状态,游戏随时可以给服务器发消息,服务器也可以随时给游戏发消息,这个对数据实时性得到保障。比如说对战游戏“王者荣耀”对实时性要求比较高都用长连接,两人互相攻击如果不是用长连接就产生延迟,我先打你反而我先死了就出现了问题,这种实时性比较高的都使用长连接的方式。

这是数据实时推送能力,在使用的时候可以把它理解成新的方式。我们使用手机的时候每天都会收到各种各样推送的消息,微信、钉钉等等。

实时推送的消息跟手机里的消息推送是很类似的,它的工作流程是在服务器和数据库里面我们会存着各种各样的数据,比如说金币、生命值、各种道具。在进入游戏的时候,游戏端先向服务器发一个消息说我要先监听哪些数据,然后这个数据只要一发生改变,在游戏端就会通过推送接收到改变后的数据。举个例子,比如说游戏里面有一个排行榜,里面储存的是前10名玩家的分数,第一名1000分,第十名100分。现在有100人玩这个游戏,他们进游戏的时候都会主动告诉服务端说要监听游戏排行榜。然后有一个玩家玩这个游戏,他得了100分,游戏会通过调用云函数把玩家的分数发送给服务端。服务端收到分数以后一计算,他比原来第十名分高了,这个人就成为了新的第十名。这时候后端服务就会把数据库里的排行榜改变掉,改变之后就可以通过数据推送把新的排行榜推送给玩家,这就是整个数据推送的流程。

排行榜怎么做呢?

右边是游戏常见的排行榜,包含几个信息:一个是玩家的名字,一个是来自哪个区,哪个家族,最后是战斗力分数,通过战斗力分数实现排行榜。

制作这样一个排行榜使用数据推送能力的话,分为四步就可以实现。

第一步骤是在数据库里创建排行榜数据,存一些信息。游戏端监听这个数据的变化;

第二步在游戏端通过调用云函数,把玩家的战斗力分数、玩家信息发送给服务端;

第三步是服务端接收到发送的数据以后再重新计算排行榜,储存到数据库里;

第四步游戏端通过监听排行榜,收到服务端推送来的新的榜单,改变游戏里面的内容就OK了。

具体来说一下这四步怎么来做。

1.数据库里创建排行榜数据。

现在云能力已经跟微信深度绑定,打开微信开发者工具在左上方有一个云开发按钮,点击以后就可以看到云开发控制台。点击数据库,进入数据库面板,看到左、中、右三个区域。最左边有集合名称,点绿色加号创建一个叫rank的名称,可以集合各种的排行榜;中间有一个添加记录,添加一个top10的 id 记录,就可以存放前10名玩家的数据。在游戏里监听的就是这个rank和top10;最右边有一个list的字段,这是一个数组,里面是前10名玩家具体的数据。我们可以看到每条数据里包含着family、name、score(分数),数据就在数据库里创建好了。

2.游戏端通过调用云函数,把玩家分数发送给服务端。

通过调用云函数实现的就是WX.cloud.callfunction。其中name字段就是调用云函数的名字,这个是调用的是addScore的云函数,addScore后面会说到它具体功能。下面是data字段,发送的是玩家数据,包括在数据库里看到family,来自哪个区、哪个家族,一个是name,玩家名字,然后score就是分数,这样通过函数把玩家数据发送给服务端了,是很简单的。

3.云函数addScore的具体功能。

这里简单地说一下,它实际上是在服务端运行的js脚本,可以理解为是node服务器运行的小功能,每个云函数就是小的node js的项目。在游戏端通过调用addScore以后,在服务端会运行这段代码。这段代码实现的几个功能,第一个是把top10的数据先拿出来。通过

"await db.collection(rank).doc(top10).get"的方法,其中rank和top10就是在数据目录里创建的数据。然后调用数据以后取出list(数组),里面放的前10名玩家具体数据。然后再通过push方法把newData放到数组里。newData就是刚才在游戏端调用云函数发送过来的数据,就是family、name、score这三个数据。然后再通过sort的方法,按照score(分数)从大到小的方式把11条数据进行排序。原来有10条又放了一条现在有11条。然后通过splice的方法取出前10,最后通过await方法更新list,这样数据就更新掉了。这就是云函数addScore的具体功能。

addScore主要实现了三个功能:

(1)接收到游戏端发的newData数据

(2)对排行榜重新进行排序

(3)分析把list重新更新到服务端

4.游戏端监听排行榜数据变化。

通过watch方法监听rank里面的top10。这时候服务排行榜的数据已改变,就通过onChang的方法接收到服务端推送过来的新的榜单,然后在游戏里面更新榜单就OK了。这是制作排行榜的具体流程。

在做微信小程序比较多,微信小程序里有一个单向数据流的概念,在前端框架里都会有这个概念,比如说Actions、View,State都会有这个概念,这是一个简单地框架示意图,前端View通过一个行为Actions,然后改变数据的状态State,根据改变后的数再据刷新页面,这是单向数据流的概念。

我们在做游戏的时候如果使用的是数据推送的话,这跟单向数据流的概念非常类似,可以把游戏端当做View,云函数当做Actions,数据库当成State。在游戏端通过调用云函数改变数据库的数据,然后再通过推送把数据发送给游戏端,游戏端来改变数据内容。这样就形成了循环,我们在游戏的时候可以使用数据驱动的思想来制作游戏。

比如要做一个卡牌游戏,一般都有游客观看的功能,可以做一个出牌记录。传统的的方式做记录都是“轮询”方式,每隔一两秒钟向服务端发一个请求,问一下服务端有没有人出牌。比如服务端告诉第三个人出一张小王,你收到消息以后就把牌给第三人加上,这种方式一般是基于逻辑的制作方式,就是服务器告诉什么事情就做什么事情。

现在使用单向数据流的概念,就是用数据驱动的概念做游戏。通过实时数据来做这个功能比较简单的,使用数据驱动的概念制作游戏,通过实时数据来做是比较简单地。

首先在数据库里创建一个Cards的数据,里面存放四个人的出牌记录,游戏端然后通过Watch监听Cards数据变化。只要你收到推送的消息,比如说有人出牌了改变了出牌记录,这时候不需要知道谁出牌了,只要知道有人出牌就OK,把四个人的牌全清掉,按照出牌记录全部摆一遍就OK了。利用数据驱动的思想使用实时数据流推送的功能制作这种游戏还是比较简单的。

小游戏+云能力

营销类小游戏里面最常用的功能是抽奖,很多时候抽奖都是假的,只能抽小奖,然后把它记录在小游戏本地。我们跟一些开发者聊过,很多时候不是不想做抽奖,由于成本原因或者其他一些原因没有后端服务器和后端工程师配合,没有后端是肯定做不了抽奖的。我们现在有了云能力就可以做这种功能了,前端通过调用云函数就可以实现后端常见的功能,所以开发用户体验会好很多。使用实时数据推送能力给小游戏会带来很多玩法,比如说可以增加互动性的玩法。

我们一个开发者给餐厅做了一个小游戏,顾客在等餐的时候可以通过扫码玩游戏,钓鱼、挖金矿、打地鼠,他不能一个人玩必须几个人合作完成,到了多少分给一个十块钱代金券。餐厅非常欢迎这种游戏,我们使用实时数据推送就可以做这种互动性比较强的玩法。

另外还有一些实时性的玩法,比如说营销类游戏或者其他游戏都会鼓励玩家分享,转发完之后就可以继续玩这个游戏,这时候屏幕上会跳出你的好友谁谁谁在玩这个游戏,可以增加金币,这时候玩家的感觉会好,这是使用实时性推送的实时性的玩法。所以充分利用好云能力带来的帮助,可以给小游戏带来新的玩法和新的功能。

云能力对于开发过程会带来很大的改变。

1.不需要服务器

它没有服务器意味不需要域名备案,现在域名备案要实名认证,还要牌照,有时候两三个星期都走不了这个过程,现在利用云能力就变得简单了;

2.不需要后端

如果做H5游戏或者微信小游戏做的比较火赚了很多钱,一般都会遇到被黑客攻击,有的是竞争对手眼红导致的,包括我们网站都被攻击,花了很多钱才搞定了。现在使用云能力不需要担心,晚上可以踏踏实实睡觉不担心被老板叫醒了。因为没有服务器,黑客怎么攻击呢?黑客要攻击你的话得把腾讯云搞挂了,这个太难了。这是使用云能力潜在的特别好的好处。

另外对于开发来讲,它用的云能力没有服务器是不需要后端工程师,可以减少人员成本开支;没有服务器也不需要再配服务器,这个成本也会省下来;不需要前后端联调,做游戏都需要前后端联调的。开发初期前后端工程师坐在一块儿对接口、支付接口、反馈数据,定好以后前后端再各自开发自己的功能。前端因为后端功能没有做好,一般前端会返回一些数据,这样可以优化流程。前端功能都做好以后,两人就对接口进行联调,这时候会出现各种各样的问题,最常见的是数据格式不统一,比如说前端是一个对象,后面返回一个数组,甚至接口都可能不一致,比如说前端要6个数据,后端只返回来4个数据,另外两个在另外一个接口里。

我们使用云能力就没有麻烦了,因为没有后端工程师,没有联调阶段了,开发者在前端直接调用云函数从服务器拿到最终的数据,也没有这个过程了,所以周期也会少一些

另外在做游戏的时候都区分开发环境和生产环境,开发环境是在公司内部署一个服务器,在上面开发功能然后进行前后端联调,功能做好以后再把代码部署到线上。在上线的过程中也是各种各样的问题。在上线过程中最常见的是配置端有问题了,游戏端的代码也要改,最起码线上的生产环境和开发环境服务器地址不一致。如果用到云开发这个过程是比较简单,因为区分开发和生产环节利用小游戏的appID就可以区分了,这个ID是开发环境,那个ID是生产环境,改一下就OK了。游戏端的代码都是不需要修改,这个过程也会变得很简单。

刚才我们看到如果使用云能力的话还是需要前端写代码来实现功能的。白鹭引擎现在做的事情是把常见的组件封装起来,有聊天室组件、排行榜组件、公会组件等等。这些组件包括基本的UI展示、游戏端的逻辑、服务端云函数的代码逻辑,这些都写好了,开发者只需要把界面改成自己的就可以了,可以减少开发工作量,这是白鹭引擎跟云结合的发展规划。

Q:关于白鹭引擎有三个相关的问题请教一下。白鹭引擎对数据实时分送做了哪些工作?第二,数据实时推送如果失败了的话,比如说断网3分钟以上白鹭引擎如何重新进行监听的?第三白鹭引擎如何实现单向数据流,有什么好的方案?

A:我们刚开始做这个事情,第一步封装就是聊天室的,要实现一个周边的功能比如说给客户一些公会、服务器登录这些,我们会先做一下之后会再推出。断网的话,这个就是自己的逻辑。比如说你收到消息定时再发一遍。

单向数据流是做游戏的思路不是具体的方案,可以用数据驱动的思想来做,有两种,传统的是基于逻辑的思想,这是前端开发的比较火的思想,它是思想并不是具体的方案。封装组件的时候比如说收到消息以后,内容就刷新一下就OK,重新定位一下。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 认识白鹭引擎
  • 实时数据推送能力实战项目
  • 小游戏+云能力
相关产品与服务
云函数
云函数(Serverless Cloud Function,SCF)是腾讯云为企业和开发者们提供的无服务器执行环境,帮助您在无需购买和管理服务器的情况下运行代码。您只需使用平台支持的语言编写核心代码并设置代码运行的条件,即可在腾讯云基础设施上弹性、安全地运行代码。云函数是实时文件处理和数据处理等场景下理想的计算平台。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档


http://www.vxiaotou.com