import { getToken } from '@/utils/auth'; let webSock = null; let connectState = false; // 标记 WebSocket 连接状态 let rec; //断线重连后,延迟5秒重新创建WebSocket连接 rec用来存储延迟请求的代码 let closeFlag = false; // 是否关闭socket let global_callback = null; const wsUrl = `${import.meta.env.VITE_APP_BASE_WEBSOCKET}/api/pattern/`; function createWebSocket(id, callback) { if (webSock != null) { return; } webSock = new WebSocket(wsUrl + id + '/ws'); global_callback = callback; webSock.onopen = function () { // 连接打开时的处理 websocketOpen(); }; webSock.onmessage = function (e) { // 接收消息时的处理 websocketOnMessage(e); }; webSock.onclose = function (e) { // 连接关闭时的处理 websocketClose(e); }; // 连接发生错误的回调方法 webSock.onerror = function () { websocketError(); }; return webSock; } //心跳设置 const heartCheck = { timeout: 30000, //每段时间发送一次心跳包 这里设置为20s timeoutObj: null, //延时发送消息对象(启动心跳新建这个对象,收到消息后重置对象) start: function () { this.timeoutObj = setInterval(function () { if (connectState) webSock.send(JSON.stringify({ operation: 'heartCheck' })); }, this.timeout); }, reset: function () { clearTimeout(this.timeoutObj); this.start(); } }; //定义重连函数 const reConnect = () => { console.log('尝试重新连接'); if (connectState) return; //如果已经连上就不在重连了 rec && clearTimeout(rec); rec = setTimeout(function () { // 延迟5秒重连 避免过多次过频繁请求重连 if (!connectState) { createWebSocket(); } }, 5000); }; // 实际调用的方法 function sendSock(agentData) { if (webSock.readyState === webSock.OPEN) { // 若是ws开启状态 webSock.send(agentData); } else if (webSock.readyState === webSock.CONNECTING) { // 若是 正在开启状态,则等待1s后重新调用 setTimeout(function () { sendSock(agentData); }, 1000); } else { // 若未开启 ,则等待1s后重新调用 setTimeout(function () { sendSock(agentData); }, 1000); } } function websocketClose() { connectState = false; webSock = null; global_callback = null; closeFlag = false; heartCheck.timeoutObj && clearTimeout(heartCheck.timeoutObj); // 清除重连定时器 rec && clearTimeout(rec); } // 数据接收 function websocketOnMessage(msg) { if (!msg || !msg.data || msg.data === 'null') { // 可能得情况 - 心跳机制、无关信息接收 console.log('收到数据:空消息'); return; } console.log(msg); // 收到信息为Blob类型时 const result = JSON.parse(msg.data); if (result.type === 0 || result.type === '0') { //自己的业务 } else { global_callback(result); } } function closeSock({ activeClose = false }) { closeFlag = activeClose; // 清除心跳定时器 heartCheck.timeoutObj && clearTimeout(heartCheck.timeoutObj); // 清除重连定时器 rec && clearTimeout(rec); if (closeFlag) { // 关闭socket webSock.close(); } // 初始化相关变量 webSock = null; connectState = false; } const websocketError = () => { closeSock({ activeClose: true }); // 执行重连 reConnect(); }; function websocketOpen() { webSock.send('Authorization: Bearer ' + getToken()); connectState = true; heartCheck.start(); //发送心跳 看个人项目需求 } export { sendSock, createWebSocket, closeSock };