實現 WebSocket 斷開自動重連的 JavaScript 庫

ReconnectingWebSocket 是一個小型的 JavaScript 庫，封裝了 WebSocket API 提供了在連接斷開時自動重連的機制。

 

只需要簡單的將：

ws = new WebSocket('ws://....');

替換成：

ws = new ReconnectingWebSocket('ws://....');

 

//間隔發送心跳包數據給服務器，服務器在一定時間內發回心跳包響應，對比超時限定，如果超過設定的超時時間，則認為當前與服務器的websocket連接已經斷開，關閉當前web socket連接，善后處理，例如重新連接，或者彈出提示……
function keepalive(ws) {
    var time = new Date();
    if (last_health != -1 && (time.getTime() - last_health > health_timeout)) {
        //連接斷開，可設置重連或者關閉連接
        $("#keeplive_box").html("服務器沒有響應.").css({
            "color" : "red"
        });
        //ws.close();
    } else {
        $("#keeplive_box").html("連接正常").css({
            "color" : "green"
        });
        if (ws.bufferedAmount == 0) {
            ws.send('~H#C~');
        }
    }
}

var ws = new WebSocket(to_url);
ws.onopen = function () {
    $("#statustxt").html("connected.");
    $("#send_btn").attr("disabled", false);
    heartbeat_timer = setInterval(function () {
            keepalive(ws)
        }, 3000);
}