记录一下我这几天升级colyseus版本的一些采坑。
我尝试将colyseus版本升级到0.15+之后,按照官方npm重新安装,
导入
import Colyseus from "colyseus.js"
结果在cocos中提示
“Current environment does not provide a require() for requiring ‘events’.”
后来我又通过直接导入
import Colyseus from "../colyseus-sdk/colyseus.js";
的方式加载编译后的js文件。
到此web版本可以正常连接socket。
但是,当我编译为微信小游戏中遇到报错,提示fetch或者XMLHttpRequest不存在,这是因为在加入房间时,客户端要发起一个colyseus内部的post请求。但我不清楚cocos的adapter编译为什么没生效。在微信小游戏端仍然在执行fetch或者XMLHttpRequest(0.15.20版本以下是XMLHttpRequest,以上为fetch),于是我对colyseus.js的send函数做了改造,在fetch请求部分添加了对wx.request的支持。
这里以colyseus0.15.20以上版本(fetch)版本为例
修改\colyseus-sdk\colyseus.js中的send方法。
function send(method, uri, opts) {
opts = opts || {};
var timer, ctrl, tmp=opts.body;
opts.method = method;
opts.headers = opts.headers || {};
if (tmp && typeof tmp == 'object') {
opts.headers['content-type'] = 'application/json';
opts.body = JSON.stringify(tmp);
}
if (opts.withCredentials) {
opts.credentials = 'include';
}
if (opts.timeout) {
ctrl = new AbortController;
opts.signal = ctrl.signal;
timer = setTimeout(ctrl.abort, opts.timeout);
}
return new Promise((res, rej) => {
if(window.wx){
window.wx.request({
url: uri,
method: opts.method || 'GET',
data: opts.body,
header: opts.headers,
success: (rr) => {
console.log("JSON.parse1",rr)
clearTimeout(timer);
// apply(rr, rr); //=> rr.headers
let reply = rr.statusCode >= 400 ? rej : res;
let tmp = rr.header['Content-Type'];
if (!tmp || tmp.indexOf('application/json') === -1) {
reply(rr);
} else {
try {
console.log("JSON.parse",rr.data,opts.reviver,rr,opts)
// rr.data = JSON.parse(rr.data, opts.reviver);
reply(rr);
} catch (err) {
err.headers = rr.headers;
// apply(rr, err);
rej(err);
}
}
},
fail: (err) => {
err.timeout = ctrl && ctrl.signal.aborted;
rej(err);
}
});
}else{
fetch(uri, opts).then((rr, reply) => {
clearTimeout(timer);
apply(rr, rr); //=> rr.headers
reply = rr.status >= 400 ? rej : res;
tmp = rr.headers.get('content-type');
if (!tmp || !~tmp.indexOf('application/json')) {
reply(rr);
} else {
rr.text().then(str => {
try {
rr.data = JSON.parse(str, opts.reviver);
reply(rr);
} catch (err) {
err.headers = rr.headers;
apply(rr, err);
rej(err);
}
});
}
}).catch(err => {
err.timeout = ctrl && ctrl.signal.aborted;
rej(err);
});
}
});
}
注意:socket似乎可以被cocos的adapter识别成功,所以socket部分不用做改造。
cocos新人,这可能不是最优解决方案,如有更好的建议欢迎回贴提出意见。