Win7 + Creator 2.0.0 + protobufjs 6.8.8

Posted 2021-08-20 LANGZI7758521

Win7 + Creator 2.0.0 + protobufjs 6.8.8

1.下载安装protobufjs

npm install -g protobufjs

2af6a8a42a24d2e81f3a89e1045107a0.png

可以看到protobufjs安装在C:\\Users\\Administrator\\AppData\\Roaming\\npm\\node_modules\\protobufjs中

2.在protobufjs\\dist中找到protobuf.js文件，并作为插件拖放到Creator中(注意，必须作为插件，并且是四个选项都必须选中，否则将报错！)

8a3908bf69a674bf7685803c19ac9568.png

3.新建一个通讯协议文件msg.proto，内容如下

syntax = "proto3";

package msg;

message Login {string name = 1;string pwd = 2;

}

注意：package为包名msg

4.使用如下命令将msg.proto文件转为对应的js版本文件Msg.js

::protobuf.js版本6.x生成js文件

pbjs-t static-module -w commonjs -o Msg.js msg.proto

5.修改Msg.js文件对应内容

//var $protobuf = require("protobufjs/minimal"); //将源文件中的这一行屏蔽，然后新增下面一行

var $protobuf = protobuf;

6.将Msg.js拖放到Creator中(包含Msg.js和protobuf.js文件的结构如下)

7.写一个WebSocket的处理脚本挂载到场景中即可。

import {msg} from "./Msg" //这里引入文件,msg为package的包名

cc.Class({

extends: cc.Component,

properties: {

ip: {default: "",

type: cc.string

},

port: {default: 0,

type: cc.number

}

},

ctor:function() {this.ws = null;

},

onLoad:function() {var self = this;var ipPort = "ws://" + this.ip + ":" + this.port;

console.log(ipPort);this.ws = newWebSocket(ipPort);this.ws.binaryType = 'arraybuffer'; //这里设置为发送二进制数据

this.ws.onopen = function(event) {

console.log("open");//打开成功立刻进行发送

if (self.ws.readyState ===WebSocket.OPEN) {

let message= msg.Login.create({name: "hello", pwd: "pwd"});//构造对象

let messageBuf = msg.Login.encode(message).finish(); //获取二进制数据，一定要注意使用finish函数

self.ws.send(messageBuf);//发送二进制数据

}

};this.ws.onmessage = function(event) {

console.log("onmessage : " +event.data);

};this.ws.onerror = function(event) {

console.log("on error :", event.data);

};this.ws.onclose = function(event) {

console.log("onclose");

};

}

});

PS：在实际应用中，可能需要在二进制数据前再拼接一些数据才进行发送

8.在二进制数据前再拼接一个short数据

let message = msg.Login.create({name: "hello", pwd: "pwd"});

let msgEncode= msg.Login.encode(message).finish(); //一定要注意使用finish函数

//二进制数据的长度+一个short的长度

var sendBuf = new ArrayBuffer(msgEncode.length + 2);var dv = newDataView(sendBuf);

dv.setInt16(0,1); //写入一个short值

//将二进制数据写入

var u8view = new Uint8Array(sendBuf, 2); //跳过一个short的距离

for (var i = 0, strLen = msgEncode.length; i < strLen; ++i){

u8view[i]=msgEncode[i];

}

self.ws.send(sendBuf);

9.使用JAVA的WebSocketServer接口，很方便就可以接收并处理数据

@Overridepublic voidonMessage(WebSocket conn, ByteBuffer message) {try{short val = message.getShort(); //获取short值

Msg.Login login =Msg.Login.parseFrom(message);

Log.info("val = %d name : %s pwd : %s", val, login.getName(), login.getPwd());

}catch(InvalidProtocolBufferException e) {

e.printStackTrace();

}

}

输出结果

277c7159914a994d5470c5af4a54c6ef.png

以上。
————————————————
版权声明：本文为CSDN博主「VDV空降兵费里」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_32349223/article/details/113031420

注意： npm install -g bytebuffer 把 bytebuffer.js long.js 也导入creator