/** * Author: Fu Guobin * Date: 2022/08/02 * Last Modified by: Fu Guobin * Last Modified time: 2023/09/21 * Copyright:Daniel(Fu Guobin) * Description:websocket方法封装 */ import type { Action } from 'element-plus'; import mitt from '@/plugins/bus'; class WebSocketService { url: string; websocket: WebSocket | null; isInitialized: boolean; isConnected: boolean; heartTimer: number | null; heartbeatInterval: number; reconnectInterval: number; maxReconnectAttempts: number; reconnectAttempts: number; data: any; constructor() { this.url = ''; this.websocket = null; this.isInitialized = false; this.isConnected = false; //连接状态 this.heartTimer = null; //心跳计时 this.heartbeatInterval = 30000; // 默认心跳30秒 this.reconnectInterval = 10000; // 默认重连10秒 this.maxReconnectAttempts = 5; // 默认尝试重连5次 this.reconnectAttempts = 0; //重连次数 this.data = null; } initialize(url: string): void { //初始化 console.log('websocket初始化'); this.url = url; this.websocket = new WebSocket(url); console.log('readyState1--', this.websocket?.readyState); this.websocket.onopen = e => { console.log('readyState--', this.websocket?.readyState); console.log('websocket onopen--', e); }; this.websocket.onopen = this.onOpen.bind(this); this.websocket.onclose = this.onClose.bind(this); this.websocket.onerror = this.onError.bind(this); this.websocket.onmessage = this.onMessage.bind(this); this.isInitialized = true; } onOpen(): void { console.log('readyState2--', this.websocket?.readyState); console.log('websocket onOpen'); this.isConnected = true; // 连接状态 this.reconnectAttempts = 0; // 重置重连次数 this.startHeartbeat(); } onSend(data: any): void { //发送消息处理 console.log('websocketSend:', JSON.stringify(data)); if (this.isConnected) { this.websocket?.send(JSON.stringify(data)); } } onMessage(event: MessageEvent): void { //获取消息处理 if (event.data != '连接成功') { const response = JSON.parse(event.data); console.log('response:', response); this.data = response; // 处理返回的数据 if (response.code === 'datareal') { console.log('table'); mitt.emit('tableMessage', response); } else if (response.code === 'alertDev') { console.log('waring'); mitt.emit('waringMessage', response); } else if (response.code === 'respMsg') { if (response.data[0].code === -1 || response.data[0].code === 1) { this.close(false); ElMessageBox.alert(response.msg, '提示', { // if you want to disable its autofocus // autofocus: false, confirmButtonText: 'OK', callback: (action: Action) => { localStorage.clear(); window.location.href = '/'; } }); } console.log(response.msg); } } } onClose(): void { // 关闭WebSocket连接的处理逻辑 console.log('websocket关闭'); // this.isInitialized = status === false ? false : true; this.isConnected = false; //关闭连接 this.stopHeartbeat(); //关闭心跳 if (this.isInitialized) { console.log('WebSocke尝试重连1'); this.tryReconnect(); } } onError(error: Event): void { // 错误处理的逻辑 console.error('WebSocket连接错误:', error); ElNotification({ message: 'webSocket连接发生错误,正在尝试重连…', type: 'error' }); this.isConnected = false; //关闭连接 this.stopHeartbeat(); //关闭心跳 if (this.isInitialized) { console.log('WebSocke尝试重连2'); this.tryReconnect(); } } tryReconnect() { //尝试重连 console.log('WebSocket尝试重连:', this.reconnectAttempts); if (this.reconnectAttempts < this.maxReconnectAttempts) { setTimeout(() => { this.reconnectAttempts++; this.initialize(this.url); }, this.reconnectInterval); } else { this.close(false); } } startHeartbeat() { // 发送心跳 console.log('websocket发送心跳'); this.heartTimer = setInterval(() => { console.log('websocket心跳计时--', this.heartTimer); if (this.websocket?.readyState === WebSocket.OPEN) { const userStorageInfo = sessionStorage.getItem('userInfo'); const userInfo = JSON.parse(userStorageInfo === null ? '' : userStorageInfo); const hearData = { code: 'heart', data: { username: userInfo.userName } }; console.log(hearData); this.websocket.send(JSON.stringify(hearData)); //心跳消息 } }, this.heartbeatInterval); } stopHeartbeat() { // 停止心跳 console.log('websocket停止心跳'); if (this.heartTimer != null) { clearInterval(this.heartTimer); this.heartTimer = null; } console.log('websocket停止心跳--', this.heartTimer); } close(status: any): void { console.log('close--', status); this.isInitialized = status; this.websocket?.close(); console.log('websocket连接已关闭'); } } const webSocketService = new WebSocketService(); export default webSocketService;