微信小程序 聊天室简单实现
微信小程序聊天室简单实现
utils文件夹下websoctet.js文件
varurl='ws://地址端口'; functionconnect(user,func){ wx.connectSocket({ url:url, header:{"content-type":'application/x-www-form-urlencoded'} }); wx.onSocketOpen(function(res){ send('{"type":"login","client_name":"'+user.nickName+'","room_id":"1"}') }); //接受消息 wx.onSocketMessage(func); } //发送消息 functionsend(msg){ wx.sendSocketMessage({data:msg}); } module.exports={ connect:connect, send:send }
具体页面.js文件内容:
varwebsocket=require('../../utils/websocket.js'); //事件处理函数 add:function(e){ websocket.send('{"type":"say","from_client_id":"'+user.nickName+'","to_client_id":"all","content":"'+this.data.message+'"}') }, onLoad:function(){ varthat=this //调用应用实例的方法获取全局数据 app.getUserInfo(function(userInfo){ user=userInfo; websocket.connect(user,function(res){ text=that.encodeStr(res.data)+"\n"; console.log(res) that.setData({ text:text }); //websocket.send('{"type":"pong"}'); }) }) },
下面方法很好玩,因为使用的服务器是开源的PHP服务器,所以微信小程序接收到的聊天室中文内容是ASCII编码,所以经过此方法可以转换。
encodeStr:function(str){ varcharacter=str.split("\\u"); varnative1=character[0]; for(vari=1;i4){ native1+=code.substring(4,code.length); } } returnnative1 },
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!