微信小程序 聊天室簡(jiǎn)單實(shí)現(xiàn)
微信小程序 聊天室簡(jiǎn)單實(shí)現(xiàn)
utils文件夾下websoctet.js文件
var url = 'ws://地址端口'; function connect(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); } //發(fā)送消息 function send(msg) { wx.sendSocketMessage({ data: msg }); } module.exports = { connect: connect, send: send }
具體頁(yè)面.js文件內(nèi)容:
var websocket = require('../../utils/websocket.js'); //事件處理函數(shù) add: function (e) { websocket.send('{"type":"say","from_client_id":"'+user.nickName+'","to_client_id":"all","content":"'+this.data.message+'"}') }, onLoad: function () { var that = this //調(diào)用應(yīng)用實(shí)例的方法獲取全局?jǐn)?shù)據(jù) 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"}'); }) }) },
下面方法很好玩,因?yàn)槭褂玫姆?wù)器 是開(kāi)源的PHP服務(wù)器,所以微信小程序接收到的聊天室中文內(nèi)容是ASCII編碼,所以經(jīng)過(guò)此方法可以轉(zhuǎn)換。
encodeStr: function (str) { var character = str.split("\\u"); var native1 = character[0]; for (var i = 1; i < character.length; i++) { var code = character[i]; native1 += String.fromCharCode(parseInt("0x" + code.substring(0, 4))); if (code.length > 4) { native1 += code.substring(4, code.length); } } return native1 },
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
相關(guān)文章
可視化埋點(diǎn)元素圈選器實(shí)現(xiàn)源碼
這篇文章主要為大家介紹了可視化埋點(diǎn)元素圈選器實(shí)現(xiàn)源碼示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-01-01精確到按鈕級(jí)別前端權(quán)限管理實(shí)現(xiàn)方案
這篇文章主要為大家介紹了精確到按鈕級(jí)別前端權(quán)限管理實(shí)現(xiàn)方案詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-09-09javascript中的箭頭函數(shù)基礎(chǔ)語(yǔ)法及使用場(chǎng)景示例
這篇文章主要為大家介紹了?javascript中的箭頭函數(shù)基礎(chǔ)語(yǔ)法及使用場(chǎng)景示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-07-07await-to-js源碼深入理解處理異步任務(wù)用法示例
這篇文章主要為大家介紹了await-to-js源碼更完美處理異步任務(wù)示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-08-08詳解微信小程序入門(mén)從這里出發(fā)(登錄注冊(cè)、開(kāi)發(fā)工具、文件及結(jié)構(gòu)介紹)
這篇文章主要介紹了微信小程序入門(mén)從這里出發(fā)(登錄注冊(cè)、開(kāi)發(fā)工具、文件及結(jié)構(gòu)介紹),本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-07-07微信小程序 textarea 組件詳解及簡(jiǎn)單實(shí)例
這篇文章主要介紹了微信小程序 textarea 組件詳解及簡(jiǎn)單實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-01-01