背景
近期在對(duì) 【GatewayWorker】的開(kāi)發(fā)過(guò)程中
注意到，當(dāng)客戶(hù)端長(zhǎng)時(shí)間沒(méi)有反應(yīng)時(shí)，會(huì)發(fā)生 WebSocket 自動(dòng)斷開(kāi)的情況
在此，提供一個(gè)使用定時(shí)器的解決方案 …
【分析原因】
首先，對(duì)于這種報(bào)錯(cuò)信息的提示，我們小小百度下就很容易明白問(wèn)題所在
可以參考這一篇文章 ： WebSocket斷開(kāi)原因、心跳機(jī)制防止自動(dòng)斷開(kāi)連接
其次，定位的知識(shí)點(diǎn)便是開(kāi)發(fā)手冊(cè)上的講解 —— 【心跳檢測(cè)】
【解決步驟】
第一步、首先，根據(jù)前面的手冊(cè)介紹，我在服務(wù)端補(bǔ)充了如下的代碼：
// 心跳間隔
$gateway->pingInterval = 57;
$gateway->pingNotResponseLimit = 1; // 代表客戶(hù)端必須定時(shí)發(fā)送心跳給服務(wù)端
$gateway->pingData = '';
第二步、在客戶(hù)端創(chuàng)建 連接及定時(shí)器核心代碼如下：
var interval_timer = null;//計(jì)時(shí)器
var timer_count = 0;
var wsUrl = "wss://xxxeee.com/ssssmn";
var ws;
createOrConnectWebSocket();// 創(chuàng)建websocket
/**
* 創(chuàng)建websocket或掉線(xiàn)重連
*/
function createOrConnectWebSocket(){
if(!ws){
//TODO ws 不存在
ws = new WebSocket(wsUrl);
websocketInit();
}else {
if (!isOnlineCurrUser()){
ws = null;
createOrConnectWebSocket();
}
}
// 開(kāi)啟定時(shí)器
init_start_timer();
}
/**
* websocket 的初始化
*/
function websocketInit(){
ws.onmessage = function (e) {
var message = eval('(' + e.data + ')');
switch (message.type) {
case 'init':
changeNoReadLogs();
var bind = '{"type":"bind","from_id":"' + from_id + '","to_id":"' + to_id + '"}';
ws.send(bind);
message_load();
break;
....... 具體代碼省略......
}
};
ws.onclose = function (e) {
console.log('websocket 斷開(kāi): ' + e.code + ' ' + e.reason + ' ' + e.wasClean);
};
}
/**
* 設(shè)置一個(gè) 30秒的輪詢(xún)監(jiān)聽(tīng)方法，避免頁(yè)面關(guān)閉
*/
function init_start_timer() {
//重置計(jì)數(shù)器
timer_count = 0;
if(interval_timer != null){
clearInterval(interval_timer);
interval_timer = null;
}
interval_timer = setInterval(function(){ myTimer() }, 30000);
}
/**
*定時(shí)器具體實(shí)現(xiàn)方法
*/
function myTimer() {
//TODO 如果超過(guò)半小時(shí)沒(méi)有交互，則關(guān)閉計(jì)時(shí)器
if(timer_count >= 1800){
clearInterval(interval_timer);
}else {
timer_count += 30;
var online = '{"type":"timer","from_id":"' + from_id + '","to_id":"' + to_id + '"}';
ws.send(online);
console.log('timer_count',timer_count);
}
}
/**
* 判斷當(dāng)前用戶(hù)是否 還在線(xiàn)
*/
function isOnlineCurrUser() {
if(ws){
if(ws.readyState == WebSocket.OPEN){
return true;
}else {
return false;
}
}else {
return false;
}
}
然后，注意在發(fā)送消息時(shí)，
比如點(diǎn)擊發(fā)送鍵時(shí)首先判斷用戶(hù)是否在線(xiàn)，如果不在線(xiàn)進(jìn)行重連或者提示信息
同時(shí)，注意當(dāng)順利發(fā)送或接收到消息時(shí),要進(jìn)行初始化定時(shí)器操作，保證重新計(jì)數(shù)！
第三步、測(cè)試效果 （基本解決了我的需求）
在發(fā)送消息的位置，調(diào)用 "createOrConnectWebSocket（）" 方法.
以上就是“WebSocket is already in CLOSING or CLOSED state. 報(bào)錯(cuò)信息的解決方案”的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注木子天禾科技其它相關(guān)文章！
