HTML H5 Vue websocket broken chain heartbeat personal note

Time:2022-1-15
let webSocket = null;
let mAudio = null;
let webSocketStateInterval = null;
let heartInterval = null;
let number = 3;
let _ closeType = false; //  True active hang up false passive hang up

export default {
    initWebsocket() {
        let _that = this;
        let userInfo = JSON.parse(localStorage.getItem("userInfo"));
        let _url = process.env.VUE_APP_socketURL + userInfo.id;
        webSocket = new WebSocket( _url);
        webSocket.onopen = function(event) {
            // console.log("webSocket onopen ----->", event);

            heartInterval = setInterval(function(){
                webSocket.send(JSON.stringify({cmd: 100}));
            }, 10000);

            webSocketStateInterval = setInterval(function(){
                switch (webSocket.readyState) {
                    case WebSocket.CONNECTING:
                        console. Log ("websocket connection ----- >");
                        break;
                    case WebSocket.OPEN:
                        console. Log ("websocket open ----- >");
                        break;
                    case WebSocket.CLOSING:
                        console. Log ("websocket closing - >");
                        break;
                    case WebSocket.CLOSED:
                        console. Log ("websocket closed successfully ----- >");
                        if(webSocketStateInterval){
                            clearInterval(webSocketStateInterval);
                        }
                        if(_closeType == false){
                            _that.initWebsocket();
                            // number--; if(number === 0) {webSocket.close();}
                        }
                        break;
                    default:
                        console.log("webSocket-------");
                        break;
                }
            }, 2000);
        };
        webSocket.onmessage = function(event) {
            // console.log("webSocket onmessage ----->", event);
            let message = JSON.parse(event.data);
            // console.log("message----->", message);
            if (message.cmd == 100) {
                console. Log ("100 - heartbeat ------", message. MSG);
            }
        };
        webSocket.onerror = function(event) {
            console.log("webSocket onerror ----->", event);
            _that.initWebsocket();
        };
        webSocket.onclose = function(event) {
            console.log("webSocket onclose --->", event);
            if(_closeType){
                if(webSocketStateInterval){
                    clearInterval(webSocketStateInterval);
                }
            }
            if(heartInterval){
                clearInterval(heartInterval);
            }
            _closeType = false;
        };
        // return new Promise((resolve, reject) => {resolve()});
    },
    sendWebSocket(text) {
        webSocket.send(JSON.stringify(text));
    },
    closeWebSocket(closeType) {
        _closeType = closeType;
        webSocket.close();
    },
    closeAudio() {
        mAudio.pause();
    }
}