美文网首页
WebSocket断开重连机制 实现demo,非采用onclos

WebSocket断开重连机制 实现demo,非采用onclos

作者: 小二黑儿 | 来源:发表于2019-08-08 11:50 被阅读0次

WebSocket.onclose 事件监听器,不可控性和断网情况下不触发问题,无法很好实现断线重连功能。

我们解决方案是,根据服务端一定时间,自动给客户端推送的心跳,心跳来判断是否断开,如果一定时间内没有收到服务器发送的心跳,则会触发重连。(很像医生抢救重症病人,看心跳图没有波动,启用心电复苏)

let interval;

/**
 * WebSocket 连接方式封装
 * @returns {void}
 */
function connectSocket() {
    let ws = new WebSocket(url);
    ws.onopen = function() {
        ws.onmessage = function(e) {
            let data = JSON.parse(e.data);
            console.log(data);
            // data.type 中是前后端约定的类型,我们这里"ping"是心跳
            if (data.type === 'ping') {
                clearInterval(interval);
                
                // 如果一定时间没有调用clearInterval,则执行重连
                interval = setInterval(function() {
                    connectSocket();
                }, 60000);
            }
            if (data.type && data.type !== 'ping') { // 消息推送
                // code ...
            }
        };
    }
}

相关文章

网友评论

      本文标题:WebSocket断开重连机制 实现demo,非采用onclos

      本文链接:https://www.haomeiwen.com/subject/koatjctx.html