心跳检测的目的时什么呢?
-
是为了定时发送消息,使连接不超时自动断线,可能后端设了超时时间就会自动断线,所以需要定时发送消息给后端,让后端服务器知道连接还在通消息不能断。
-
为了检测在正常还连接着的情况下,判断后端是否正常,如果我们发了一个定时检测给后端,后端按照约定要下发一个检测消息给前端,这样才是正常的。
可是如果后端没有正常下发呢,我们就要设定一下超时要重连了,我们把重连写在了onclose里面,当时正常连接的情况下,超时未能响应检测消息的情况下,浏览器不会自动断掉触发onclose,所以需要我们手动触发,也就是在超时里写一个ws.close()让ws关闭触发onclose方法,实现重连。
==浏览器会触发onclose的情况是断网断线的情况下,当时正常连接还未断线,浏览器时不会自动触发onclose的,所以就有超时手动触发onclose的必要。
//心跳检测
var heartCheck = {
timeout: 10000, //9分钟发一次心跳
timeoutObj: null,
serverTimeoutObj: null,
reset: function() {
clearTimeout(this.timeoutObj);
clearTimeout(this.serverTimeoutObj);
return this;
},
start: function() {
var self = this;
this.timeoutObj = setTimeout(function() {
//这里发送一个心跳,后端收到后,返回一个心跳消息,
//onmessage拿到返回的心跳就说明连接正常
ws.send("ping");
console.log("ping!")
self.serverTimeoutObj = setTimeout(function() {
//如果超过一定时间还没重置,说明后端主动断开了
console.log("try=close")
ws.close();
/* 这里为什么要在send检测消息后,倒计时执行这个代码呢,
因为这个代码的目的时为了触发onclose方法,这样才能实现
onclose里面的重连方法所以这个代码也很重要,没有这个方法,
有些时候发了定时检测消息给后端,后端超时(我们自己设定的时
间)后,不会自动触发onclose方法。我们只有执行ws.close()代
码,让ws触onclose方法的执行。如果没有这个代码,连接没有断
线的情况下而后端没有正常检测响应,那么浏览器时不会自动超时
关闭的(比如谷歌浏览器),谷歌浏览器会自动触发onclose是在断
网的情况下,在没有断线的情况下,也就是后端响应不正常的情况
下,浏览器不会自动触发onclose,所以需要我们自己设定超时自
动触发onclose,这也是这个代码的的作用。*/
}, self.timeout)
}, this.timeout)
}
}