欧美三级国产三级日韩三级_亚洲熟妇丰满大屁股熟妇_欧美亚洲成人一区二区三区_国产精品久久久久久模特

微信小程序使用原生WebSokcet實現(xiàn)斷線重連及數(shù)據(jù)拼接 - 新聞資訊 - 云南小程序開發(fā)|云南軟件開發(fā)|云南網(wǎng)站建設-昆明葵宇信息科技有限公司

159-8711-8523

云南網(wǎng)建設/小程序開發(fā)/軟件開發(fā)

知識

不管是網(wǎng)站，軟件還是小程序，都要直接或間接能為您產(chǎn)生價值，我們在追求其視覺表現(xiàn)的同時，更側重于功能的便捷，營銷的便利，運營的高效，讓網(wǎng)站成為營銷工具，讓軟件能切實提升企業(yè)內(nèi)部管理水平和效率。優(yōu)秀的程序為后期升級提供便捷的支持！

您當前位置>首頁 » 新聞資訊 » 小程序相關 >

微信小程序使用原生WebSokcet實現(xiàn)斷線重連及數(shù)據(jù)拼接

發(fā)表時間：2021-3-31

發(fā)布人：葵宇科技

瀏覽次數(shù)：86

以前做小程序為了應急找了個插件去鏈接WebSokcet，文章傳送門。

回過頭在新項目中再次使用時出現(xiàn)了些許問題，不一一贅述。遂決定好好用一下原生的WebSokcet。


一、說明

1.小程序原生的WebSokcet沒有斷線重連機制，這個是他的不足之處。

2.小程序新的版本庫已經(jīng)支持存在多個 WebSokcet 連接。

官方說明：基礎庫 1.7.0 之前，一個微信小程序同時只能有一個 WebSocket 連接，如果當前已存在一個 WebSocket 連接，會自動關閉該連接，并重新創(chuàng)建一個 WebSocket 連接?；A庫版本 1.7.0 及以后，支持存在多個 WebSokcet 連接，每次成功調用 wx.connectSocket 會返回一個新的 SocketTask。

官方文檔地址：mp.weixin.qq.com/debug/


二、實際例子：

首先你需要socket地址url: let url = 'wss://xxx.xxx.com/?'

注意：1.小程序管理后臺添加socket域名的時候不能出現(xiàn)端口；2.如果使用了appID，協(xié)議必須是 wss；3.socket服務端映射的端口僅支持 80 和 443，和公眾號一個尿性。

接下來放例子：

1、socket.js

const app = getApp();
let url = 'wss://xxx.xxx.com/?xxx=xxx'
export const connect = function (cb) { // 定義一個方法
   wx.connectSocket({ // 創(chuàng)建一個 WebSocket 連接
       url: url,
       fail (err) {
if (err) {
               console.log('%cWebSocket連接失敗', 'color:red', err)
               app.globalData.socketConnectFail = true // 定義一個全局變量，當鏈接失敗時改變變量的值
}
}
})

   wx.onSocketOpen(function (res) { // 監(jiān)聽WebSocket連接打開事件。
       console.log('WebSocket打開成功');
       wx.sendSocketMessage({ // 通過 WebSocket 連接發(fā)送數(shù)據(jù)，需要先 wx.connectSocket，并在 wx.onSocketOpen 回調之后才能發(fā)送。
           data: String2Base64(), // 用于訂閱的參數(shù)，視具體情況而定
           success (data) {
               console.log('WebSocket發(fā)送消息:', data.errMsg)
},
           fail (err) {
               console.log('Err', err)
}
})

})

   wx.onSocketMessage(function (res) { // 監(jiān)聽WebSocket接受到服務器的消息事件。
       console.log('WebSocket接收到消息:', ArryBuffer2Json(res.data));
       cb(ArryBuffer2Json(res.data)); // 將接收到的消息進行回調，如果是ArryBuffer，需要進行轉換
})

   wx.onSocketError(function (res) { // 監(jiān)聽WebSocket錯誤。
       console.log('WebSocket連接打開失敗')
})

   wx.onSocketClose(function (res) { // 監(jiān)聽WebSocket關閉。
       console.log('WebSocket關閉');
})
};

function ArryBuffer2Json (data) { // ArryBuffer轉換成Json
try {
var encodedString = String.fromCharCode.apply(null, new Uint8Array(data));
var decodedString = decodeURIComponent(atob(encodedString));
return JSON.parse(decodedString);
} catch (err) {
       console.log(err);
return false;
}
}


function String2Base64 () { // 用于訂閱的參數(shù)，視具體情況而定
var packet = {};
   packet["cmd"] = "subscribe";
   packet["reqNo"] = "" + new Date().getTime();
   packet["params"] = {token: token, channelId: 'xcx', columnIds: "1"};
return stringToUint(JSON.stringify(packet))
}

function stringToUint (string) {
var string = base64_encode(encodeURIComponent(string)),
       charList = string.split(''),
       uintArray = [];
for (var i = 0; i < charList.length; i++) {
       uintArray.push(charList[i].charCodeAt(0));
}
return new Uint8Array(uintArray);
}

function base64_encode (str) { // base64轉碼
var c1, c2, c3;
var base64EncodeChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
var i = 0, len = str.length, string = '';

while (i < len) {
       c1 = str.charCodeAt(i++) & 0xff;
if (i == len) {
string += base64EncodeChars.charAt(c1 >> 2);
string += base64EncodeChars.charAt((c1 & 0x3) << 4);
string += "==";
break;
}
       c2 = str.charCodeAt(i++);
if (i == len) {
string += base64EncodeChars.charAt(c1 >> 2);
string += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xF0) >> 4));
string += base64EncodeChars.charAt((c2 & 0xF) << 2);
string += "=";
break;
}
       c3 = str.charCodeAt(i++);
string += base64EncodeChars.charAt(c1 >> 2);
string += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xF0) >> 4));
string += base64EncodeChars.charAt(((c2 & 0xF) << 2) | ((c3 & 0xC0) >> 6));
string += base64EncodeChars.charAt(c3 & 0x3F)
}
return string
}


2、index.js

let openSocket = require('../../config/socket.js');
const app = getApp();
data: {
  motto: 'Hello World',
  articleData: []
},
onLoad: function () {
let that = this;
  openSocket.connect(function (data) { // WebSocket初始化連接
let result = data.data
if (result) {
          that.setData({articleData: [result].concat(that.data.articleData)}) // 將獲得的socket推送消息拼接到當前文章列表的最前面
}
});
if (app.globalData.socketConnectFail) { // WebSocket斷線重連
      setInterval(() => {
          openSocket.connect(function (data) {
let result = data.data
if (result) {
                  that.setData({articleData: [result].concat(that.data.articleData)})
}
});
}, 1000)
}
}


3、app.js

globalData: {
  socketConnectFail: false
}

相關案例查看更多