cocos2d-x-js(or Cocos creator)使用protobufjs

最近项目中正准备protobufjs,之前测试了gooogle-protobuf-javascript版。也可以用。但是功能相对不够强大。所以选择protobufjs版来处理数据问题,并成功merge进项目,拿出来分享一下给需要的同学:

nodeJS类库的形式引用protobufjs进行开发

项目是基于webpack,模块式开发。当然能很好的引用nodejs的类库,于是就:npm install protobufjs@6.7.3 测试了一下,结果在cocos2d-x-js项目中,出错打印是:

ScriptingCore:: evaluateScript fail fs
ScriptingCore:: evaluateScript fail bytes
ScriptingCore:: evaluateScript fail long
win32能运行。也能正常显示。但是一进android版本。就直接黑屏了。runtime出错了。寻找各种方法,都无果。
(当然直接用protobufjs版里的用browsify编译好的protobufjs.直接引用进项目是没有问题。但是有个问题。不能用pbjs生成对应的proto定义文件,生成类文件,进行代码的开发。只能加载proto文件,然后通过反射的方式拿到类。这让人有点不爽。)

找了大概一上午,看看底层问题出在哪里了。经过查找。原来cocos2d-x-js,绑定了一个require的方法,执行excuteScript,就是执行js文件,而protobufjs用到了inquire,动态执行require方法,象动态require(“fs”),requrei(“long”).当然找不到了,而webpack编译的时候又不报错。于是想到。我可以把cocos2d-x-js里的reuqire全部换成另外一个名字(ccrequire),这样protobufjs动态require就不会出错了,下面替换一下这几个文件的require为ccrequire就可以了:
fr

  • frameworks\cocos2d-x\cocos\scripting\js-bindings\ScriptCore.cpp
  • frameworks\cocos2d-x\cocos\scripting\js-bindings\script\debugger\actors\webconsole.js
  • frameworks\cocos2d-x\cocos\scripting\js-bindings\script\debugger\jsb.js
  • frameworks\cocos2d-x\cocos\scripting\js-bindings\script\debugger\jsb_boot.js
  • frameworks\cocos2d-x\cocos\scripting\js-bindings\script\debugger\jsb_debugger.js

定义UserInfo.proto文件。内容如下:

syntax = "proto3";
option java_package = "com.nikoer.data";
message UserInfo {
    string name=1;
}

pbjs命令生成js类文件(命令执行在node_modules.bin目录下):

pbjs -t static-module -w commonjs -o UserInfo.js UserInfo.proto

编写测试代码,把生成的UserInfo.js文件放在根目录下:

var protobuf = require("protobufjs");
var $root = require("./UserInfo.js");
var message =$root.UserInfo.create({ name: "cocos"});
cc.log(JSON.stringify(message.toJSON()));

执行webpack打包,运行项目,打印平台输出cocos.没有任何出错提示,

同样:cocos creator项目。只要在项目的根据目录下运行npm install protobufjs,然后定制一下cocos2d-lite,同样的修改上面几个文件。一样的。

如何用编译好的protobufjs直接用到cocos2d-x-js项目中:

  1. 下载编译好的protobufjs:https://github.com/dcodeIO/protobuf.js/tree/master/dist/protobuf.js,放到项目的src目录下
  2. 修改项目下的project.json文件。在jsList数组里添加一条记录:src/protobuf.js
  3. 定义proto文件,放到项目的res目录下,内容:
package awesomepackage;
syntax = "proto3";

message AwesomeMessage {
    string awesome_field = 1; // becomes awesomeField
}

4,编写测试代码:

var protoValue= jsb.fileUtils.getStringFromFile("res/awesome.proto");// 读取文件内容
var root = protobuf.parse(protoValue, { keepCase: true }).root;
var AwesomeMessage = root.lookup("awesomepackage.AwesomeMessage");
var mesage = AwesomeMessage.create({
      awesome_field : "Sloppy"
});
cc.log(mesage .awesome_field);

这种方式只能反射类,不太喜欢。

cococs2d-x-js如何使用webpack进行模块式开发,可以bing搜索一下。好多教程

3赞

赞 

我用cocos creator做了对应文件的更改,但是模拟器还是报相同的错误。我是用ts的。希望能帮忙解答一下。

TS版的在这里:http://forum.cocos.com/t/cocos-creator-protobufjs-ts/47687

好的,我参考一下。谢谢

npm install protobufjs@6.7.3 这个能说下详细点吗? 我的报错找不到 “C:\Ussers\Administraor\package.json”

cocos creator项目。只要在项目的根据目录下运行npm install protobufjs,然后定制一下cocos2d-lite,同样的修改上面几个文件。一样的。按照你说的报错

安装nodejs