websocket 心跳重连
websocket 的基本使用: var ws = new WebSocket(url);
ws.onclose = function () {
//something
reconnect(); // 自定义的 websocket 重连方法
};
ws.onerror = function () {
//something
reconnect(); // 自定义的 websocket 重连方法
}; ws.onopen = function () {
//something
};
ws.onmessage = function (event) {
//something
} 想要 websocket 一直保持连接,我们在 onclose 和 onerror 方法中执行重连方法。
但是当信号不好,网络临时断开时,websocket 连接断开而不会执行 onclose 方法,这时我们就无法重连 websocket 了。
所以需要针对断网情况使用心跳重连的方式。
var heartCheck = {
timeout: 60000,//60s
timer: null,
reset: function(){ // 终止 start 的 setTimerout,不让 ws.send() 执行,然后重新执行 start
clearTimeout(this.timer);
this.start();
},
start: function(){
this.timer= setTimeout(function(){
ws.send("HeartBeat"); // send 方法执行,如果是断网状态,则会自动触发 onclose 方法,实现重连。重连方法中会执行 start 方法,再次开始心跳检测,所以这里使用的 setTimeout 而不是 setInterval
}, this.timeout)
}
}
ws.onopen = function () {
heartCheck.start(); // onopen 的时候执行 start 开始心跳检测
};
ws.onmessage = function (event) { // 接收到后端的消息执行 reset
heartCheck.reset();
}
websocket 心跳重连的更多相关文章
- 初探和实现websocket心跳重连
心跳重连缘由 在使用websocket过程中,可能会出现网络断开的情况,比如信号不好,或者网络临时性关闭,这时候websocket的连接已经断开, 而浏览器不会执行websocket 的 onclos ...
- 初探和实现websocket心跳重连(npm: websocket-heartbeat-js)
提示:文章最下方有仓库地址 心跳重连缘由 websocket是前后端交互的长连接,前后端也都可能因为一些情况导致连接失效并且相互之间没有反馈提醒.因此为了保证连接的可持续性和稳定性,websocket ...
- websocket心跳重连 websocket-heartbeat-js
初探和实现websocket心跳重连(npm: websocket-heartbeat-js) 心跳重连缘由 websocket是前后端交互的长连接,前后端也都可能因为一些情况导致连接失效并且相互之间 ...
- 161114、websocket实现心跳重连
心跳重连缘由 在使用websocket过程中,可能会出现网络断开的情况,比如信号不好,或者网络临时性关闭,这时候websocket的连接已经断开, 而浏览器不会执行websocket 的 onclos ...
- WebSocket心跳检测和重连机制
1. 心跳重连原由 心跳和重连的目的用一句话概括就是客户端和服务端保证彼此还活着,避免丢包发生. websocket连接断开有以下两证情况: 前端断开 在使用websocket过程中,可能会出现网络断 ...
- 理解WebSocket心跳及重连机制(五)
理解WebSocket心跳及重连机制 在使用websocket的过程中,有时候会遇到网络断开的情况,但是在网络断开的时候服务器端并没有触发onclose的事件.这样会有:服务器会继续向客户端发送多余的 ...
- 【简记】前端对接WebSocket与心跳重连
前言 最近又在忙着开发别的模块,其中包含了即时通讯这一块,上一次做即时通讯时还是去年年底,一时间代码都在自己的笔记本里,还没带--这里就记录一下前端对接WebSocket的实现,包含心跳重连,简记之. ...
- 小程序websocket心跳库——websocket-heartbeat-miniprogram
前言 在16年的时候因为项目接触到websocket,而后对心跳重连做了一次总结,写了篇博客,而后18年对之前github上的demo代码进行了再次开发和开源,最终封装成库.如下: 博客:https: ...
- ws & websocket & 掉线重连
ws & websocket & 掉线重连 reconnecting websocket https://github.com/joewalnes/reconnecting-webso ...
随机推荐
- vue搭建前端相关命令
Vue搭建.新建工程并打开浏览器调试的指令: 这四行命令就是我们接下来工作了. 1.npm install –global vue-cli 我们在安装好nodejs后就可以用到“npm”这个前缀指令, ...
- SpringMVC 搭建
1. 新建一个项目 Paste_Image.png 我们用eclipse新建项目,选择Dynamic Web Project(动态的Web项目). 点击Next Paste_Image.png ...
- 廖雪峰JavaScript学习笔记(基础及数据类型、变量)
先睹为快 alert('我要学JavaScript!'); Run: 基本语法: 1.每个语句以;结束,不强制 2.语句块用{...} 3.//单行注释,/*...*/ 多行注释 数据类型: 1.不区 ...
- Codeforces 792 E. Colored Balls
题目链接:http://codeforces.com/contest/792/problem/E 假设含球较少的那些堆有 $mi$ 个球,较多的那些堆有$ma$个球,$ma=mi+1$,考虑对于最小的 ...
- hdu 5564 Clarke and digits 矩阵快速幂优化数位dp
Clarke and digits Time Limit: 5000/3000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others ...
- Javascript中DataGrid表格纵线添加数据
接之前写的一篇博客http://www.cnblogs.com/Liu30/p/7229641.html,生成一个6*24的表格之后,添加数据 表格数据一般都是按行添加,我所做的这个表格是想添加一天2 ...
- GSEA - Gene set enrichment analysis 基因集富集 | ORA - Over-Representation Analysis 分析原理与应用
RNA-seq是利器,大部分做实验的老板手下都有大量转录组数据,所以RNA-seq的分析需求应该是很大的(大部分的生信从业人员应该都差不多要沾边吧). 普通的转录组套路并不多,差异表达基因.富集分析. ...
- android ------- 开发者的 RxJava 详解
在正文开始之前的最后,放上 GitHub 链接和引入依赖的 gradle 代码: Github: https://github.com/ReactiveX/RxJava https://github. ...
- 19、Squid代理服务器
第十九章,配置Squid服务器 一.代理服务器简介 19.1.1:什么是代理服务器 代理服务器的功能就是代理网络用户去取的网络信息,好比是网络信息的中转站,大多被用来连接互联网和局域网.代理服务器好像 ...
- Lua 语言环境安装
Linux 系统上安装(本文使用了5..0版本进行安装:) curl -R -O http://www.lua.org/ftp/lua-.tar.gz tar zxf lua-.tar.gz cd l ...