小程序webSocket使用心得
Posted fjl-beat-it
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了小程序webSocket使用心得相关的知识,希望对你有一定的参考价值。
1:如何实现webSocket服务器断开重连,隐藏小程序或者退出小程序断开不重连
最近在做项目的时候,产品提到了这样一个需求,就是当前端和服务器端断开连接的时候,前端要每隔一定时间(5秒,10秒,15秒,30秒,60)之后与服务器尝试重连,也就是5次。如果5次重连不成功,则前端去开启setInterval定时器,手动刷新列表数据。这样做的好处其实是显而易见的。降低连接失败的风险。
当时在做这个需求的时候。考虑到一个问题:就是当我小程序隐藏或者退出的时候一样要关闭websocket,这样一来就会和服务器自动断开一样会走重连websocket的方法。因为sockTask.close和wx.onSocketClose其实是一样的,反正webSocket一旦断开了。这两个方法都会被调用。那如何区分是用户手动断开了webSocket还是因为网络不稳定而导致了websocket断开呢。下面是我的处理方法。记录下来以方便下次遇到时可以作为参考
第一步 在data里面定义几个过程中会用到的全局变量
首先需要注意一下 我在webSocket内部this指向需要先保存在一个为that的变量里,避免this指向出错
//一下这些变量 为了操作方便 我就不把他放在data对象里面
var num = 0;//这是重连的次数
var t = 5; // 这次每次重连的时间 默认为5秒之后
var setTimer = null; // 存放定时器 为了关闭用到的
var that;
data:{
automaticClose:true // 这里默认是客户端和服务器自动断开
}
第二步连接服务器和有关操作
connetWebsocket() { // wbsocket逻辑
that = this;// 保存this指向
if( webSocket ) that.closeWebSocket(); // 先关 再开 避免多次重复连接
webSocket = wx.connectSocket({
url: ‘你的服务器地址‘,
header:{
"Authorization" : getEncryToken(wx.getStorageSync(_token)), // 加密的token 这是我们的项目需要
}
})
wx.onSocketOpen(function (res) { // 打开webSocket
console.log(‘WebSocket连接已打开!‘)
})
wx.onSocketMessage(function (res) { // 接收数据
console.log(res)
})
wx.onSocketError(function(){ //这里是监听链接出错
that.readConnectWebSocket()
})
wx.onSocketClose(function (res) { //监测webSocket关闭
automaticClose && that.readConnectWebSocket() // 只有是自动断开时才开启重连 这判断挺重要
})
},
closeWebSocket(){ // 手动关闭webSocket
webSocket.close({
success(){
webSocket = null;
console.log(‘webSocket关闭成功‘)
}
})
},
readConnectWebSocket(){ // 重新连接webSocket
clearTimeout(setTimer); // 先关闭定时器
if( num <= 5 ){
num += 1; // 每次重连一次num递增1
num <= 3? t = num*5:t = t*2; // t的值每次为 5 10 15 30 60
setTimer = setTimeout(function name(params) {
that.connetWebsocket()
},t*1000)
}else{ //5次链接都失败走这里
that.startLogTimer() // startLogTimer为一个开启setInterval的函数
}
},
onShow(){
this.setData({ automaticClose:true,num:0,t:5 }) // 恢复小程序websocket默认自动断开 初始化数据
},
onHide(){
this.setData({ automaticClose:false }) // 这一步其实是告诉小程序 这是用户手动断开websocket的, 这一步也判断是否需要重连webSocket的条件依据
},
以上是关于小程序webSocket使用心得的主要内容,如果未能解决你的问题,请参考以下文章