我们在是有websocekt的时候,有的时候由于某些原先websocket会断开连接,我们需要重现连接,该如何实现呢?这就需要我们仔细研究websocket的api的使用了。
首先我们要熟悉如下几个api
1、连接websocket的服务器的websocekt函数
2、websocekt断开后触发的onclose函数
由上面这两个函数就可以了,大致思路梳理一下:
1、首先开发一个函数websocketinit,函数主要是websocket的连接逻辑,监听信息,发送信息
2、监听onclose事件,onclose触发后重新执行websocketinit事件
思路有了大致代码如下:
代码语言:javascript复制 function webSocketInit(service){
//1、初始化ws
//2、监听onclose事件 重新执行websocketInit函数
}
具体代码如下:
代码语言:javascript复制//1.创建websocket客户端
var wsServer = 'ws://ip/';
var limitConnect = 3; // 断线重连次数
var timeConnect = 0;
webSocketInit(wsServer);
//socket初始化
function webSocketInit(service){
var ws = new WebSocket(service);
ws.onopen = function () {
console.log("已连接TCP服务器");
};
ws.onmessage = function (msg) {
console.log(msg);
};
ws.onclose = function () {
console.log('服务器已经断开');
reconnect(service);
};
// 重连
function reconnect(service) {
// lockReconnect加锁,防止onclose、onerror两次重连
if(limitConnect>0){
limitConnect --;
timeConnect ;
console.log("第" timeConnect "次重连");
// 进行重连
setTimeout(function(){
webSocketInit(service);
},2000);
}else{
console.log("TCP连接已超时");
}
}
// 心跳 * 回应
setInterval(function(){
websocket.send('');
}, 1000*100);
以上便是手动实现websocket重连的解决方案,还有一种方式是使用一个叫做reconnecting websocket的库:
只要把:
代码语言:javascript复制var ws = new WebSocket('ws://....');
替换成:
代码语言:javascript复制var ws = new ReconnectingWebSocket('ws://....');
这样就好了。
ReconnectingWebSocketa同样支持onopen、onmessage、onclose这些事件。
参考:https://www.cnblogs.com/wesky/p/12111929.html
https://www.uedbox.com/post/9276/