服务器之家:专注于服务器技术及软件下载分享
分类导航

node.js|vue.js|jquery|angularjs|React|json|js教程|

服务器之家 - 编程语言 - JavaScript - js教程 - CocosCreator入门教程之网络通信

CocosCreator入门教程之网络通信

2022-03-03 16:49houjia159 js教程

这篇文章主要介绍了CocosCreator的网络通信,内容不多,涉及到的细节,读者可以根据实际情况,自己去延申

网络通信概况

开发一个网络游戏,难免要处理网络通信。有几点问题需要注意:

1.服务端为了快速开发可能前期使用http通信,后面再改成websocket/socket。

2.同时存在http和websocket/socket通信

3.通信数据格式可能需要随时替换为json或protocol buffer,可能需要添加额外头部。

4.在新手引导里使用本地数据做模拟,请求不需要发送给后端。

5.重连后数据简单同步

具体实施

针对第一、二个问题,我在设计通信模块时会考虑将通信尽量抽象为统一的对外接口,在游戏启动时通过不同的驱动器创建实例(如果只使用一种通信方式,使用单一实例)。

?
1
2
3
public constructor(driver: ConnectDriver) {
        this._driver = driver;
}

先定义通用的网络通信数据结构。其中请求分为数据和控制两种类型,用于区分心跳、登录、重连

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
/**
 * 请求类型
 */
export enum RequestType {
    DATA = 1,
    CTRL
}
 
/**
 * 网络通信数据结构
 */
export interface NetData {
    seq?: number; // 序列号
    mod: number; // 模块
    cmd: number; // 命令
    path?: string; // 路径
    data?: any; // 数据
    tmpData?: any; // 数据处理器临时数据
    status?: number; //状态码
    type?: RequestType;  //请求类型
}

然后定义通用的对外接口

?
1
2
3
4
5
6
7
8
9
public open(url: string, port: number, isBinary: boolean, timeout: number, retryCount: number, params: any, cb: (succ: boolean) => void): void {}
 
public close(): number {}
 
public reopen(cb: (succ: boolean) => void): void {}
 
public sendData(data: NetData, params: HttpReq | any, succCb: (data: NetData) => void, failedCb: (code: number, reason: string) => void): void {}
 
public resendNotRecv(): void {}

其中resendNotRecv用于重连后发送没有收到响应的包,后端根据序列号决定是否处理。

这里没有对推送的处理,实际上推送是接收到服务端数据后,调用广播给监听者。下面定义监听者

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/**
 * 网络连接事件监听接口
 */
export interface ConnectEventListener {
    onOpen(driver: ConnectDriver);
    onClosed(driver: ConnectDriver);
    onError(driver: ConnectDriver, msg: string);
    onSendStart(driver: ConnectDriver);
    onRecvEnd(driver: ConnectDriver);
}
 
/**
 * 网络事件监听接口
 */
export interface NetEventListener extends ConnectEventListener {
    onPush(driver: ConnectDriver, data: NetData): void;
}

对外提供注册和移除接口

?
1
2
3
public addEventListener(listener: NetEventListener): void {}
 
public removeEventListener(listener: NetEventListener): void {}

针对第三个问题,需要定义一些预处理器,在发送数据前和接收到数据后,做拦截预处理。

?
1
2
3
4
5
6
7
/**
 * 网络通信数据处理器接口
 */
export interface NetDataProcessor {
    processReqData(data: any): any;
    processRespData(data: any): any;
}

对外提供添加和移除接口,这样就可以灵活定义通信数据格式

?
1
2
3
public addDataProcessor(processor: NetDataProcessor): void {}
 
public removeDataProcessor(processor: NetDataProcessor): void {}

针对第四个问题,同样是增加一个特殊的拦截器,在请求发送前对其处理,如果拦截器能处理,就不再发送给后端。

?
1
2
3
4
5
6
/**
 * 模拟服务器接口
 */
export interface SimServer {
    handleRequest(data: NetData): NetData;
}

对外提供设置接口

?
1
public setSimServer(server: SimServer): void {}

针对第五个问题,所有数据请求都有序列号,对请求进行记录,没有响应的请求包放到一个队列里,重连后重发这些包给后端处理

?
1
public resendNotRecv(): void {}

以上就是CocosCreator入门教程之网络通信的详细内容,更多关于CocosCreator网络通信的资料请关注服务器之家其它相关文章!

原文链接:https://blog.csdn.net/houjia159/article/details/108420231

延伸 · 阅读

精彩推荐
  • js教程微信小程序实现登录注册功能

    微信小程序实现登录注册功能

    这篇文章主要介绍了微信小程序实现登录注册功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...

    保护我方豆豆5512021-12-22
  • js教程原生js实现自定义难度的扫雷游戏

    原生js实现自定义难度的扫雷游戏

    这篇文章主要为大家详细介绍了原生js实现自定义难度的扫雷游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...

    清欢灬6532022-01-06
  • js教程js面向对象方式实现拖拽效果

    js面向对象方式实现拖拽效果

    这篇文章主要为大家详细介绍了js面向对象方式实现拖拽效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...

    web前端的清流7332022-01-25
  • js教程详解Typescript里的This的使用方法

    详解Typescript里的This的使用方法

    这篇文章主要介绍了详解Typescript里的This的使用方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们...

    hardfist7542021-12-28
  • js教程基于JS绘制2021的烟花效果 附源码下载

    基于JS绘制2021的烟花效果 附源码下载

    这篇文章主要介绍了基于JS绘制2021的烟花效果,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下...

    3512022-02-17
  • js教程微信小程序全局状态的深入讲解

    微信小程序全局状态的深入讲解

    这篇文章主要介绍了微信小程序全局状态的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们...

    明月依旧9512022-02-17
  • js教程推荐!数据可视化的十种优秀JavaScript图表库

    推荐!数据可视化的十种优秀JavaScript图表库

    网上有许多具有不同特点的JavaScript图表库资源,本文列举了十种能够实现数据可视化最佳JS库,供您参考。...

    51CTO3682022-03-02
  • js教程你不知道的 JS 沙箱隔离

    你不知道的 JS 沙箱隔离

    本文接下来的内容,将介绍我在探索基于 Web Worker 实现 JavaScript 沙箱隔离方案过程中的一些资料收集、理解以及我的踩坑和思考的过程。...

    前端大全10362021-12-29