微信小游戏protobuf.js快速解决办法

protobufjs在微信小游戏环境中运行出错,一时让不少人被此问题卡住,做为pbkiller的开发者,必须将些问题了解清楚,目前提供下面几个方案:

###一. 使用预编译js
就是将proto文件转换为js文件使用,此方法支持protobufjs5.x~6.x

###二. protobufjs5.x 动态加载方案
1.在获取到protobuf对象时修改他的loadProtoFile函数

let ProtoBuf = require('protobufjs'); 
ProtoBuf.Util.IS_NODE = cc.sys.isNative; 

ProtoBuf.loadProtoFile = function(filename, callback, builder) { 
    if (callback && typeof callback === 'object') 
        builder = callback, 
        callback = null; 
    else if (!callback || typeof callback !== 'function') 
        callback = null; 
    if (callback) 
        return cc.loader.load(typeof filename === 'string' ? filename : filename["root"]+"/"+filename["file"], function(error, contents) { 
            if (contents === null) { 
                callback(Error("Failed to fetch file")); 
                return; 
            } 
            try { 
                callback(error, ProtoBuf.loadProto(contents, builder, filename)); 
            } catch (e) { 
                callback(e); 
            } 
        }); 
    var contents = cc.loader.load(typeof filename === 'object' ? filename["root"]+"/"+filename["file"] : filename); 
    return contents === null ? null : ProtoBuf.loadProto(contents, builder, filename); 
}; 

此方法是将ProtoBuf.Util.fetch函数替换成cc.loader.load函数。

2.异步加载proto文件
之后加载proto文件需要使用异步方式

//创建一个共用的builder对象
let builder = ProtoBuf.newBuilder();
...

ProtoBuf.loadProtoFile(filePath, (error, builder) => {
        let pb = builder.build(packageName);
        let player = new pb.Player(); 
        player.name = 'zzz'; 
        player.id = 123; 

        let data = player.toArrayBuffer(); 
        let player2 = pb.Player.decode(data); 
        this.log(player2);
}, builder);

###三、 protobufjs 6.x 动态加载方案
我也尝试了protobufjs6.x的动态加载方案

let protobuf = require('protobufjs');
protobuf.util.fetch = cc.loader.load.bind(cc.loader);

protobufjs 6.x动态加载可以解决加载问题,但protobufjs 6.x使用了new Function() 函数动态生成代码,导致在实例化proto对象时微信会报错,此方法暂时不可取。

微信不支持XMLHTTPRequest API,而Protobuf中正好使用了此API,思路是使用cc.loader代替XMLHTTPRequest。需要注意,我在微信开发者工具的运行环境中,在使用cc.loader.load、cc.loader.loadRes等函数时会经常出现回调不响应的情况(切换场景也不生效),需要全部关闭微信开发者工具,或清空缓存,再通过Creator运行游戏,有时可能会反复操作多次才能生效。

由于最近几天身体不适,暂时提供以上信息供大家参考。

5赞

不需要那么复杂,6.x就不说了,function报错。
5.x我直接采用的,简单粗暴,而且也通过调试了。

	fileNames.forEach((fileName) => {
            cc.loader.loadRes(fileName, function (err, proto) {
           	ProtoBuf.loadProto(proto, builder, fileName)  
                cc.log("微信平台加载proto", fileName)
            }) 
	});
1赞

方法不错,可以异步加载proto文件,同步实例化proto对象。

你好,我又发现了一个protobufjs在微信小游戏中的加载问题。
使用cc.loader.loadRes(‘xxx.proto’)可以解决xxx.proto文件的加载,但当xxx.proto文件中import了另一个yyy.proto文件,protobufjs任然会以同步的方式去加载,又导致调用了XHR。

fetch函数要用你的pbkiller里面说的重写,然后判断下微信平台,直接跳过加载,被import的就不会去加载,(被import的文件通过loadRes去加载,一样是可行的,引用的结构同样是在builder里面的)这样就没问题了。

你的方法不错,我现在的方案也差不多。
我是用cc.loader.getRes代替fetch,同步模式。
需要提前预加载所有的pb文件,我用的cc.loader.loadDir,之后就按原流程走了。

理论上所有平台都可以按照微信小游戏的方式去加载,(微信小游戏我测试过)其他平台我暂时没去测试,至于import的问题,只要被import的结构通过cc.loader.loadRes加载到了内存,其他引用了这个结构的proto都是可以使用的,反之,如果你定义的被import的结构没通过cc.loader.loadRes去加载,而且也没通过ProtoBuf.Util.fetch去加载,去使用一个引用了这个被import的结构的话,编码或者解码必然是失败。

简单说:我们用cc.loader.loadRes的方式,代替了ProtoBuf.Util.fetch去加载import, 去new一个pb结构的时候,还是能够找到那个被import的结构的。

希望我的表述是能让大伙明白的~

mark 正在研究 小游戏ts 项目中使用protobuf

研究的怎么样了 最近也准备在TS中使用ProtoBufJS

TS是JS的超集,pbkiller可以直接在TS项目中使用的

完整总结,看这里
Cocos Creator 中使用 protobufjs
https://blog.csdn.net/NRatel/article/details/84251138

@646729772 请问你这是这是6.0还是5.0?

静态方式用的6.0,动态6.0,5.0都有试

5.0可以静态吗

大哥这个完整的总结,里面的let Assets = require(“Assets”);
Assets 这个模块在哪里呢?

这里,直接用cocos的加载方法即可。我自己又封装了一下加载,不用管