webSocket断线重连

心跳包重连跟断线重连有什么区别呢？ 

其实这两个都是为了达到一个目的，那就是保证当前设备的网络状态保持通畅。。。而断线重连呢，只能保证网络失去连接的时候有效，并不能保证网络断开的时候有效。。。这么说可能就有很多人迷糊了，这两者之间有什么区别呢？

其实很简单哈，至少我是这么理解的。网络失去连接的时候是你手动关闭网络或禁用网络时，这个时候会触发到websocket中的onclose事件，也就是说他会触发断线重连，

而网络断开的时候呢，指的是比较简单粗暴的方法，例如直接拔网线之类的。。。。而这个时候呢是不会触发onclose事件的，那这个时候我们要怎么办呢，我们就需要用到心跳重连了

好啦，说了这么多，现在我们直接来看代码吧。。。。

首先是断线重连，我们要创建一个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://my.oschina.net/codingBingo/blog/633985