Creator WebSocket Protobuf整合之保姆级全攻略

环境说明:

Cocos Creator : 2.3.0 学习的速度赶不上它更新的速度

protobuf3 https://developers.google.com/protocol-buffers/

protobufjs @6.8.9 https://github.com/protobufjs/protobuf.js

没错,这是目前最新版本。网上一大堆都是老的 v5 版本,对我来说太low。哈哈实际上我仅仅是为了用那该死的pbts啦!

服务器端:

websocket + protobuf3 这里就不具体展开说明了,因为此时我对服务器端没有什么兴趣。

why google protobuf?

我来告诉你,为什么选择protobuf作为网络的封装协议而为什么不用json?

1.首先我是google的粉丝

2.序列化与反序列化效率高于json,相比而言降低了客户端服务器的资源

3.传输体积小,对应的降低的数据流量

4.数据类型跨平台,这点很重要。也许你不在乎,等你做多客户端的时候就知道了。

5.一定程度脱敏,强调一下protobuf没有加密功能,仅仅是二进制难以阅读而已。本文不涉及加密的操作,先给留个坑如果读者有兴趣我会考虑做篇有关RSA,AES加密封装.

好了,大概整理了这么多。也许说的不对,这都是我自己的理解!!最主要原因是我想拿我之前的服务器端程序直接用而已,不想写服务器端程序目前只想怼cocos creator.

表急嘛,马上上干货了。

1.通常项目早期的时候已经规定好了通讯协议,下面这个协议属于"万金油"适用于绝大多数项目,也是我之前做的项目中所采用的协议。

(消息结构体封装协议)

2.通常我还会做一份文档出来,以供其他参与开发的小伙伴使用,类似于这样的

(具体描述封装协议各字段说明)

(原生的.proto 文件说明,以便维护)

3.以KeepAliveMsg.proto为例说明

ProtoID.proto 一个公用的枚举类型以便管理协议编号

KeepAliveMsg.proto 心跳包协议体

好了,截止到这里和我们cocos creator 不相关的东西准备结束了。下面我们来说说creator该做哪些骚操作呢。

上面说了google protobuf这里又来个protobuf.js又是什么鬼?

这个鬼呢,管他什么鬼,我没耐心写了,先将就的写着吧。总之就是在creator中使用protobuf的一个插件针对js, ts 语言环境.

安装完成后在安装目录下找到/Users/fred/node_modules/protobufjs/dist/protobuf.js将其复制到creator的工程中,然后选择以控件的方式导入。

同时它主要的目的呢就是将.proto的文件转换成.js(pbjs),以及将其生成出来的.js转换成.d.ts(pbts)

此时我们就生成出了 compiled.d.ts compiled.js 这两个文件,也将其复制到creator工程中,其中修改下compiled.js如下

好,截止到这里。基本上就完成了protobuf的支持的,剩下的工作就是开始怼代码了!

写到这里,我有点不想写了,以后再更新吧!

//todo: creator 中如何通过protobuf.hs 进行序列化与反序列化,以及自定义头的解析。

2020-03-18更新

1.开始各种封装以及代码的调用与实现,大概的介绍下代码清单

-script (项目工程的脚本目录)

|_ protobuf (存放protobuf相关目录)

|_compiled.js (pbjs 编译出来的 .js 文件)

|_compiled.d.ts (pbts 编译出来的 .d.ts 文件)

|_protobuf.js (导入的插件)

|_bean (存放封装类相关目录)

|_FCDecoder.ts (arraybuf 消息头解码)

|_FCEncoder.ts (arraybuf 消息头编码)

|_FCHeader.ts (封装的消息头对象)

|_FCMsg.ts (封装的消息对象)

以下代码只供学习测试使用,代码可以跑,木有问题

2.FCHeader.ts 消息头封装

3.FCMsg.ts 消息体封装

4.FCEncode.ts 编码

5.FCDecode.ts 解码

5.websocket 优雅的调用方式

截止到这里我们需要注意一下在websocket创建的时候记得设置二进制类型,否则默认是大字段类型Blob,切记!

大概的总结一下

作为初学creator的人来说,creator的生态并没有我想的那么好,总体而言还处于初级阶段,相当一部分大佬是从cocos2dx转过来的,相对而言他们的学习门槛更低更易于上手,就我个人而言特别针对ts语法可能有些地方用不太恰当,不过暂时没有关系,先这么滴。后续慢慢改善,加油!

有关网络相关的今天是我学习的第三天,基本的网络通讯http,websocket都已经整明白了,而且在native上测试也是通过的。后期再稍微看下有关证书的配置,应该问题不大。

下面的计划我准备开始学习下UI相关的控件了,之前写了个demo大概的了解下layout,button,label,widget ...等基本的控件使用。可能游戏开发中会用到很多的自定义的控件,暂时还没有接触到。

还有就是基本的物理引擎做个大概的了解,我估计用不到,如果是网游的话碰撞大概率我会写在服务器端。其他的相关的先做个了解的!

我们又可以愉快的玩耍了!

一天到晚的,别老想着白嫖!

老铁要不要关注一下呢?

写在最后,本人不提供疑难杂症的检查,岁数有点大了,人有点懒了!谢谢!!

peace&love

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20200318A0CBFQ00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券