webSocket断线重连（不需要心跳 ，纯前端 无需后端 超级简单）

webSocket断线重连

废话不多说直接上代码

<script>

    var websocket; //声明webSocket 对象

    //定时器 只执行一次的那种 只是为了限制重连频率 = =
    var heartCheck = {
        timeout: 5000, //重连时间
        timeoutObj: null,
        start: function(){
            this.timeoutObj = setTimeout(function(){
                getSocket() //这里重新创建 websocket 对象并赋值
            }, this.timeout)
        }
    }

    //第一次进来 websocket对象并赋值
    getSocket()

    function getSocket(){
        if('WebSocket' in window) {
            websocket = new WebSocket("ws://localhost:8080/doorplate/msgsocket?deviceId=551684123156");
            console.log("============Websocket");

            // 这里也可以判读 是否连接上 在进行下一步操作 这里事件紧张就不写了 比如属性变化...

            setSocket(websocket) //这里重写对象监听事件
        }else if ('MozWebSocket' in window) {
            websocket = new MozWebSocket("ws://localhost:8080/doorplate/msgsocket?deviceId=551684123156");
            console.log("=============MozWebSocket");
            setSocket(websocket)
        } else {
            websocket = new SockJS("http://localhost:8080/doorplate/msgsocket/sockjs?deviceId=551684123156");
            console.log("=============SockJS");
            setSocket(websocket)
        }
    }

    function  setSocket(websocket) {

        websocket.onopen = function(evnt) {
            console.log('连接已经建立');
        };
        websocket.onmessage = function(evnt) {
            document.getElementById("msg").innerHTML += evnt.data + '<br/>'
        };
        websocket.onerror = function(evnt) {
            console.log('发生错误');
        };
        websocket.onclose = function(evnt) {
            console.log('连接断开');
            //连接关闭启动定时任务 五秒后在创建
            heartCheck.start();
        }
    }

    //ps: 创建的socket 对象连接不上后端服务器也会执行 断开操作

</script>

ok 简单吧