?后端地址是http的? ?websocket地址 ws開頭；后端地址是https的，websocket地址wss開頭；
對(duì)于websocket沒有跨域的問題
import { MessageBox } from 'element-ui';
let url = "ws://192.168.0.181:8000"; //請(qǐng)求的后端地址
let websocket = null;//全局WebSocket對(duì)象
let lockReconnect = false; // 網(wǎng)絡(luò)斷開重連
let wsCreateHandler = null; // 創(chuàng)建連接
export function createWebSocket(fn){
try{
if ('WebSocket' in window) {
websocket = new WebSocket(`${url}/webSocketServer?token=${getToken()}`);
} else if ('MozWebSocket' in window) {
websocket = new MozWebSocket(`${url}/webSocketServer?token=${getToken()}`);
} else {
websocket = new SockJS(`${url}/sockjs/webSocketServer?token=${getToken()}`);
}
}catch {
reconnect();
return;
}
websocket.onopen = function(event) {
// websocket.send("連接成功");
console.log("服務(wù)已連接")
};
websocket.onmessage = function(event){
var data=JSON.parse(event.data);
if(data.type === 'exit'){
MessageBox.alert(data.name, '提示', {
dangerouslyUseHTMLString: true,
showConfirmButton: true,
type: 'warning',
}).then(()=>{
store.dispatch('user/resetToken').then(() => {
removeToken();
// window.location.reload();
router.replace("/login")
});
});
}
fn(data);
};
websocket.onclose = function(event) {
console.log("服務(wù)連接關(guān)閉")
};
websocket.onerror = function(event) {
console.log(event,"連接出錯(cuò)")
};
}
/**
* 異常處理
* 處理可以檢測(cè)到的異常，并嘗試重新連接
*/
function reconnect() {
if (lockReconnect) {
return;
}
console.log("reconnect");
lockReconnect = true;
// 沒鏈接上會(huì)一直連接，設(shè)置延遲，避免過多請(qǐng)求
wsCreateHandler && clearTimeout(wsCreateHandler);
wsCreateHandler = setTimeout(function() {
console.log("-----websoket異常-------");
createWebSocket();
lockReconnect = false;
}, 1000);
}
export function websocketClose() {
console.log('執(zhí)行了關(guān)閉')
websocket.close(); //手動(dòng)關(guān)閉websocket
}
文章來源：http://www.zghlxwxcb.cn/news/detail-505296.html
注意：系統(tǒng)退出后需要關(guān)閉websocket，尤其是平臺(tái)需要單賬號(hào)登陸的。文章來源地址http://www.zghlxwxcb.cn/news/detail-505296.html
到了這里，關(guān)于js中使用websocket的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
