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 ...
随机推荐
- arXiv 提交 pre-print 文章的相关注意事项
arXiv 提交 pre-print 文章的相关注意事项 2018-11-25 22:38:28 1. 有一个可以正常上传 paper 的 arXiv 账号:https://arxiv.org/ 这 ...
- Learning-Python【14】:匿名函数与函数递归
一.什么是匿名函数 匿名函数就是没有名字的函数,又叫lambda表达式.用于一些简单的需要用函数去解决的问题,特点是只能在定义时使用一次,且函数体只有一行 匿名函数的定义就相当于只产生一个变量的值,而 ...
- 2、haproxy配置参数详解
代理相关配置参数 内容参考自马哥教育 HAProxy官方文档 https://cbonte.github.io/haproxy-dconv/2.0/configuration.html URI Syn ...
- JAVA基础知识笔记
1.类只能用Public修饰,不能使用protected.private修饰.也可以不加修饰符,称做友好类. 2.类的实体元素包含成员变量和方法的定义,成员变量分为实例变量和类变量(static修饰的 ...
- 浅谈String中的==和对象中引用对象类型的==
@Test public void test02() { StringBuffer sb = new StringBuffer(); sb.append('a'); sb.append(11); Sy ...
- mxnet ubuntu cpu安装
sudo apt-get update sudo apt-get install -y build-essential Git libblas-dev libopencv-dev git clone ...
- Mac+Apache+PHP 安装 Xdebug 方法
MAC homebrew自2018/3/31之后弃用homebrew/php By 31st March we will deprecate and archive the Homebrew/php ...
- 【原创】一篇学会vue路由配置 、 动态路由 、多层路由(实例)
先来看看效果图: 为了方便讲解,我没有使用vue脚手架,如果需要的,可以留言跟我要.不多说开工: 首先,html先组上 <div id="app"> <div&g ...
- 最近使用Navicat for MySQl访问远程mysql数据库,出现报错,显示“2003- Can't connect MySQL Server on 'localhost'(10038)“。
优先考虑mysql数据库是否开启 1.先看报错窗口. 通过百度,最终找到的原因是:远程3306端口未对外开放. 于是下面进行远程3306端口开放操作. 首先远程连接服务器,点击“开始”-“管理 ...
- Solr安装使用教程
一.安装 1.1 安装jdk solr是基于lucene而lucene是java写的,所以solr需要jdk----当前安装的solr-7.5需要jdk-1.8及以上版本,下载安装jdk并设置JAVA ...