websocket 断线重连

摘要

websocket reconnect

websocket是html5发布之后出现的一种新技术，说它是新技术，其实也不是多新的技术了，因为毕竟也有2-3年了，但是找了很多国内的实例，缺发现不多，不知道是它不好用呢，还是说这种技术原来就有缺陷呢，咱们暂且不说，今天我们就来介绍一下websocket的断线重连，，，，

这里先提供一个类库，https://github.com/joewalnes/reconnecting-websocket ，这是一个websocket重连的类库，对于处理一些简单的断线重连问题还是比较好用的，，，而且其中的功能也比较全，有兴趣的朋友可以去研究一下

接来我要介绍的是我在一个项目中遇到的问题，这是一个比较普遍的断线重连问题。。。好啦，废话不多说，我们直接看例子

首先呢 ，我们要创建一个websocket对象，其中对象的参数是我们要连接的地址，这个一般是服务端提供的。。。

var ws = new WebSocket('ws:../../websocket');

然后我们重写一下监听收到消息的事件，

ws.onmessage = function(msg){    console.log('msg:',msg);    //do something};

接下来我们重写一下监听关闭连接的事件，

ws.onclose = function(){    console.log('closed....');};

OK，这样的话，最简单的一个websocket就写好了，那么接下来我们就要实现断线重连的功能了喽，往下看。。。

function reconnect (){    rews = new WebSocket('ws:../../websocket');    rews.onmessage = function(){      //dosomthing      };    rews.onclose = function(){        //dosomthing    };}

没错，在这个方法里，我们把刚才干的事情重写一遍，就是这么easy

那么问题来了，我们要在哪里调用这个重连函数呢，

var disConnect = function(){    setTimeout(function(){         reconnect();    },5000);}

我们先写一个函数，每隔5秒去调用一次，这个函数我们就放在onclose里面，就是这样

ws.onclose = disConnect;

ok,这样我们一个简单的断线重连就做好了，赶紧去试一下吧

断线重连三方库参考地址：

https://github.com/joewalnes/reconnecting-websocket/