1. 程式人生 > 實用技巧 >js websocket斷開重連

js websocket斷開重連

js websocket斷開重連例項程式碼,請根據自己需求做出相應改動

      var socket; //websocket的例項
        var lockReconnect = false; //避免重複連線

        function getwebsocket() { //新建websocket的函式 頁面初始化 斷開連線時重新呼叫
            var wsUrl = 'ws://10.200.101.121:9001/websocket?wsToken=' + window.token + '&djxh=' + window.djxh;
            socket = new WebSocket(wsUrl);
            socket.onerror = function(event) {
                //console.log('websocket服務出錯了');
                reconnect(wsUrl);
            };
            socket.onclose = function(event) {
                //console.log('websocket服務關閉了');
                reconnect(wsUrl);
            };
            socket.onopen = function(event) {
                heartCheck.reset().start(); //傳遞資訊
            };
            socket.onmessage = function(event) {
                //如果獲取到訊息,心跳檢測重置
                //拿到任何訊息都說明當前連線是正常的
                //console.log('websocket服務獲得資料了');
                //接受訊息後的UI變化
                doWithMsg(event.data);
                heartCheck.reset().start();
            };
            //收到訊息推送
            function doWithMsg(msg) {
                getdjxh()//這個函式是業務上面申請列表的函式 可以忽略
                window.external.CallFun('receiveMsg');//這個也是
            }
        }

        function reconnect(url) {
            if (lockReconnect) return;
            lockReconnect = true;
            //沒連線上會一直重連,設定延遲避免請求過多
            setTimeout(function() {
                getwebsocket();
                lockReconnect = false;
            }, 2000);
        }
        //心跳檢測
         var heartCheck = {
            timeout: 60000, //60秒
            timeoutObj: null,
            serverTimeoutObj: null,
            reset: function() {
                clearTimeout(this.timeoutObj);
                clearTimeout(this.serverTimeoutObj);
                return this;
            },
            start: function() {
                var self = this;
                this.timeoutObj = setTimeout(function() {
                    //這裡傳送一個心跳,後端收到後,返回一個心跳訊息,
                    //onmessage拿到返回的心跳就說明連線正常
                    socket.send("心跳測試");
                    self.serverTimeoutObj = setTimeout(function() { //如果超過一定時間還沒重置,說明後端主動斷開了
                        socket.close(); //如果onclose會執行reconnect,我們執行ws.close()就行了.如果直接執行reconnect 會觸發onclose導致重連兩次
                    }, self.timeout)
                }, this.timeout)
            }
        }