微信小程序 SocketIO 实例讲解

微信小程序 ScoketIO 简单实例：

现在好的人在搞微信小程序，ScoketIO 是微信的网络通信，它的重要性不言而喻，这里给大家讲讲如何使用以及注意事项！

微信小程序 的SocketIO 实现，基于CFETram 的实现基础上完善

/* socket.io 协议常量 /
var packets = {
open: 0 // non-ws,close: 1 // non-ws,ping: 2,pong: 3,message: 4,upgrade: 5,noop: 6
};
var events = {
CONNECT: 0,DISCONNECT: 1,EVENT: 2,ACK: 3,ERROR: 4,BINARY_EVENT: 5,BINARY_ACK: 6
};

const PING_CHECK_INTERVAL = 2000;

class WxSocketIO {
connect(url) {
return new Promise((resolve,reject) => {
wx.onSocketopen((response) => {
this.isConnected = true;
//this.ping();
resolve(response);
});
wx.onSocketError(error => {
if (this.isConnected) {
this.fire('error',error);
} else {
reject(error);
}
});
wx.onSocketMessage(message => this._handleMessage(message));
wx.onSocketClose(result => {
if (this.isConnected) {
this.fire('error',new Error("The websocket was closed by server"));
} else {
this.fire('close');
}
this.isConnected = false;
this.destory();
});
wx.connectSocket({
url: ${url}/?EIO=3&transport=websocket
});
});
}
ping() {
setTimeout(() => {
if (!this.isConnected) return;
wx.sendSocketMessage({
data: [packets.ping,'probe'].join('')
});
},PING_CHECK_INTERVAL);
}
close() {
return new Promise((resolve,reject) => {
if (this.isConnected) {
this.isConnected = false;
wx.onSocketClose(resolve);
wx.closeSocket();
} else {
reject(new Error('socket is not connected'));
}
});
}
emit(type,...params) {
const data = [type,...params];
wx.sendSocketMessage({
data: [packets.message,events.EVENT,JSON.stringify(data)].join("")
});
}
destory() {
this.removeAllListeners();
}
_handleMessage({ data }) {
const [match,packet,event,content] = /^(\d)(\d?)(.*)$/.exec(data);
if (+event === events.EVENT) {
switch (+packet) {
case packets.message:
let pack;
try {
pack = JSON.parse(content);
} catch (error) {
console.error('解析 ws 数据包失败：')
console.error(error);
}
const [type,...params] = pack;
this.fire(type,...params);
break;
}
}
else if (+packet == packets.pong) {
this.ping();
}
}
};

emitter.setup(WxSocketIO.prototype);

module.exports = WxSocketIO;

DEMO

项目附了一个微信小程序的DEMO 项目演示了接入 Scoket.IO 官方的演示聊天室，以便方便测试,关于详细用法还请参考官方文档。

How to use

{ console.info('App::WxSocketIO::onopen') console.info('App:onShow:',that.globalData) }) .catch(err => { console.error('App::WxSocketIO::onError',err) }) 其中socket.connect(ws_url,opts)中，opts目前可选值是path，用来指定使用socket.io时默认的path，比如设置opts为下列值：

{
query: 'fanweixiao',with: 'mia&una',}

完整实例地址：https://github.com/fanweixiao/wxapp-socket-io

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！