WebSocket断开重连机制 实现demo,非采用onclose事件方式

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 ...
            }
        };
    }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容