Merge branch 'master' of http://192.168.1.22:3000/frontend/pqs-9100_client

# Conflicts:
#	frontend/src/utils/webSocketClient.ts

frontend/src/utils/jwtUtil.ts

@@ -0,0 +1,234 @@
+import { useUserStore } from "@/stores/modules/user";
+
+// JWT Token解析后的载荷接口
+export interface JwtPayload {
+    userId?: string;
+    loginName?: string;
+    exp?: number;
+    iat?: number;
+    [key: string]: any;
+}
+
+// Token信息摘要接口
+export interface TokenInfo {
+    userId: string | null;
+    loginName: string | null;
+    expiration: string | null;
+    isExpired: boolean;
+    remainingTime: string;
+}
+
+/**
+ * JWT工具类
+ * 提供JWT token的解析、验证等功能
+ */
+export class JwtUtil {
+    /**
+     * Base64URL解码
+     * @param str Base64URL编码的字符串
+     */
+    private static base64UrlDecode(str: string): string {
+        try {
+            // Base64URL转Base64
+            let base64 = str.replace(/-/g, '+').replace(/_/g, '/');
+            
+            // 补齐padding
+            while (base64.length % 4) {
+                base64 += '=';
+            }
+            
+            // Base64解码
+            const decoded = atob(base64);
+            
+            // 处理UTF-8编码
+            return decodeURIComponent(
+                decoded
+                    .split('')
+                    .map(c => '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2))
+                    .join('')
+            );
+        } catch (error) {
+            throw new Error('Base64URL解码失败: ' + error);
+        }
+    }
+
+    /**
+     * 解析JWT Token获取载荷信息
+     * @param token JWT token字符串，如果不传则从store中获取
+     */
+    static parseToken(token?: string): JwtPayload | null {
+        try {
+            let targetToken = token;
+            
+            // 如果没有传入token，从store中获取
+            if (!targetToken) {
+                const userStore = useUserStore();
+                targetToken = userStore.accessToken;
+            }
+            
+            if (!targetToken) {
+                console.warn('Token不存在');
+                return null;
+            }
+
+            // JWT token由三部分组成，用.分割：header.payload.signature
+            const parts = targetToken.split('.');
+            if (parts.length !== 3) {
+                console.error('无效的JWT token格式');
+                return null;
+            }
+
+            // 解码payload部分（第二部分）
+            const payload = parts[1];
+            const decodedPayload = this.base64UrlDecode(payload);
+            const tokenData: JwtPayload = JSON.parse(decodedPayload);
+
+            return tokenData;
+        } catch (error) {
+            console.error('解析JWT Token失败:', error);
+            return null;
+        }
+    }
+
+    /**
+     * 获取指定字段的值
+     * @param field 字段名
+     * @param token JWT token字符串，可选
+     */
+    static getField<T = any>(field: string, token?: string): T | null {
+        const tokenData = this.parseToken(token);
+        return tokenData?.[field] || null;
+    }
+
+    /**
+     * 获取用户ID
+     * @param token JWT token字符串，可选
+     */
+    static getUserId(token?: string): string | null {
+        return this.getField<string>('userId', token);
+    }
+
+    /**
+     * 获取登录名
+     * @param token JWT token字符串，可选
+     */
+    static getLoginName(token?: string): string | null {
+        return this.getField<string>('loginName', token);
+    }
+
+    /**
+     * 获取Token过期时间戳（秒）
+     * @param token JWT token字符串，可选
+     */
+    static getExpiration(token?: string): number | null {
+        return this.getField<number>('exp', token);
+    }
+
+    /**
+     * 获取Token签发时间戳（秒）
+     * @param token JWT token字符串，可选
+     */
+    static getIssuedAt(token?: string): number | null {
+        return this.getField<number>('iat', token);
+    }
+
+    /**
+     * 检查Token是否过期
+     * @param token JWT token字符串，可选
+     */
+    static isExpired(token?: string): boolean {
+        const exp = this.getExpiration(token);
+        if (!exp) return true;
+        
+        // JWT中的exp是秒级时间戳，需要转换为毫秒
+        const expTime = exp * 1000;
+        return Date.now() >= expTime;
+    }
+
+    /**
+     * 获取Token剩余有效时间（毫秒）
+     * @param token JWT token字符串，可选
+     */
+    static getRemainingTime(token?: string): number {
+        const exp = this.getExpiration(token);
+        if (!exp) return 0;
+        
+        const expTime = exp * 1000;
+        const remaining = expTime - Date.now();
+        return Math.max(0, remaining);
+    }
+
+    /**
+     * 格式化剩余时间为可读字符串
+     * @param ms 毫秒数
+     */
+    static formatRemainingTime(ms: number): string {
+        if (ms <= 0) return '已过期';
+        
+        const seconds = Math.floor(ms / 1000);
+        const minutes = Math.floor(seconds / 60);
+        const hours = Math.floor(minutes / 60);
+        const days = Math.floor(hours / 24);
+        
+        if (days > 0) return `${days}天 ${hours % 24}小时`;
+        if (hours > 0) return `${hours}小时 ${minutes % 60}分钟`;
+        if (minutes > 0) return `${minutes}分钟 ${seconds % 60}秒`;
+        return `${seconds}秒`;
+    }
+
+    /**
+     * 获取完整的Token信息摘要
+     * @param token JWT token字符串，可选
+     */
+    static getTokenInfo(token?: string): TokenInfo {
+        const exp = this.getExpiration(token);
+        const remainingMs = this.getRemainingTime(token);
+        
+        return {
+            userId: this.getUserId(token),
+            loginName: this.getLoginName(token),
+            expiration: exp ? new Date(exp * 1000).toLocaleString() : null,
+            isExpired: this.isExpired(token),
+            remainingTime: this.formatRemainingTime(remainingMs)
+        };
+    }
+
+    /**
+     * 验证Token是否有效（格式正确且未过期）
+     * @param token JWT token字符串，可选
+     */
+    static isValid(token?: string): boolean {
+        const tokenData = this.parseToken(token);
+        return tokenData !== null && !this.isExpired(token);
+    }
+
+    /**
+     * 获取Token的头部信息
+     * @param token JWT token字符串，可选
+     */
+    static getHeader(token?: string): any | null {
+        try {
+            let targetToken = token;
+            
+            if (!targetToken) {
+                const userStore = useUserStore();
+                targetToken = userStore.accessToken;
+            }
+            
+            if (!targetToken) return null;
+
+            const parts = targetToken.split('.');
+            if (parts.length !== 3) return null;
+
+            const header = parts[0];
+            const decodedHeader = this.base64UrlDecode(header);
+            return JSON.parse(decodedHeader);
+        } catch (error) {
+            console.error('解析JWT Header失败:', error);
+            return null;
+        }
+    }
+}
+
+// 导出单例方法，方便直接调用
+export const jwtUtil = JwtUtil;

frontend/src/utils/webSocketClient.ts

@@ -1,186 +1,703 @@
-import {ElMessage} from "element-plus";
+/**
+ * WebSocket客户端服务
+ * 提供WebSocket连接管理、心跳机制、消息处理等功能
+ * 集成JWT token解析，支持自动获取用户登录名
+ * 
+ * @author hongawen
+ * @version 2.0
+ */
 
+import { ElMessage } from "element-plus";
+import { jwtUtil } from "./jwtUtil";
 
+// ============================================================================
+// 类型定义 (Types & Interfaces)
+// ============================================================================
+
+/**
+ * WebSocket消息接口定义（对应后端WebSocketVO结构）
+ */
+interface WebSocketMessage<T = any> {
+    type: string;           // 消息类型
+    requestId?: string;     // 请求ID
+    operateCode?: string;   // 操作代码
+    code?: number;          // 状态码
+    desc?: string;          // 描述信息
+    data?: T;              // 泛型数据
+}
+
+/**
+ * 回调函数类型定义
+ */
+type CallbackFunction<T = any> = (message: WebSocketMessage<T>) => void;
+
+/**
+ * WebSocket配置接口
+ */
+interface SocketConfig {
+    url: string;                    // WebSocket服务器地址
+    heartbeatInterval?: number;     // 心跳间隔时间(ms)
+    reconnectDelay?: number;        // 重连延迟时间(ms)
+    maxReconnectAttempts?: number;  // 最大重连次数
+    timeout?: number;               // 超时时间(ms)
+}
+
+/**
+ * 连接状态枚举
+ */
+enum ConnectionStatus {
+    DISCONNECTED = 'disconnected',   // 未连接
+    CONNECTING = 'connecting',       // 连接中
+    CONNECTED = 'connected',         // 已连接
+    RECONNECTING = 'reconnecting',   // 重连中
+    ERROR = 'error'                  // 连接错误
+}
+
+/**
+ * 常用的WebSocket消息类型定义命名空间
+ */
+namespace WebSocketMessageTypes {
+    /**
+     * 预检测相关消息
+     */
+    export interface PreTestMessage {
+        deviceId?: string;
+        status?: string;
+        progress?: number;
+        errorInfo?: string;
+    }
+    
+    /**
+     * 系数校准相关消息
+     */
+    export interface CoefficientMessage {
+        deviceId: string;
+        channel: number;
+        voltage?: string;
+        current?: string;
+        calibrationResult?: boolean;
+    }
+    
+    /**
+     * 正式检测相关消息
+     */
+    export interface TestMessage {
+        deviceId: string;
+        testType: string;
+        testResult?: 'success' | 'failed' | 'processing';
+        testData?: any;
+    }
+    
+    /**
+     * 通用响应消息
+     */
+    export interface CommonResponse {
+        success: boolean;
+        message?: string;
+        timestamp?: number;
+    }
+}
+
+// ============================================================================
+// 导出类型
+// ============================================================================
+
+export type { 
+    WebSocketMessage, 
+    CallbackFunction, 
+    SocketConfig, 
+    WebSocketMessageTypes
+};
+
+export { 
+    ConnectionStatus
+};
+
+// ============================================================================
+// 主要服务类
+// ============================================================================
+
+/**
+ * WebSocket服务类
+ * 单例模式实现，提供完整的WebSocket连接管理功能
+ */
 export default class SocketService {
-    static instance = null;
+    // ========================================================================
-    static get Instance() {
+    // 静态属性和方法 (Static)
+    // ========================================================================
+
+    /**
+     * 单例实例
+     */
+    private static instance: SocketService | null = null;
+    
+    /**
+     * 获取单例实例
+     * @returns SocketService实例
+     */
+    static get Instance(): SocketService {
         if (!this.instance) {
             this.instance = new SocketService();
         }
         return this.instance;
     }
-    // 和服务端连接的socket对象
-    ws = null;
-    // 存储回调函数
-    callBackMapping = {};
-    // 标识是否连接成功
-    connected = false;
-    // 记录重试的次数
-    sendRetryCount = 0;
-    // 重新连接尝试的次数
-    connectRetryCount = 0;
-    work:any;
-    workerBlobUrl:any;
-    lastActivityTime= 0; // 上次活动时间戳
-    lastResponseHeartTime = Date.now();//最后一次收到心跳回复时间
 
-    reconnectDelay= 5000; // 重新连接延迟，单位毫秒
+    // ========================================================================
+    // 实例属性 (Properties)
+    // ========================================================================
 
-    //  定义连接服务器的方法
+    /**
-    connect() {
+     * WebSocket连接实例
+     */
+    private ws: WebSocket | null = null;
+    
+    /**
+     * 消息回调函数映射表
+     */
+    private callBackMapping: Record<string, CallbackFunction<any>> = {};
+    
+    /**
+     * 当前连接状态
+     */
+    private connectionStatus: ConnectionStatus = ConnectionStatus.DISCONNECTED;
+    
+    /**
+     * 发送消息重试计数器
+     */
+    private sendRetryCount: number = 0;
+    
+    /**
+     * 连接重试计数器
+     */
+    private connectRetryCount: number = 0;
+    
+    /**
+     * 心跳Worker实例
+     */
+    private heartbeatWorker: Worker | null = null;
+    
+    /**
+     * Worker脚本的Blob URL
+     */
+    private workerBlobUrl: string | null = null;
+    
+    /**
+     * 最后一次收到心跳响应的时间戳
+     */
+    private lastResponseHeartTime: number = Date.now();
+    
+    /**
+     * WebSocket连接配置
+     */
+    private config: SocketConfig = {
+        url: 'ws://127.0.0.1:7777/hello',
+        heartbeatInterval: 9000,        // 9秒心跳间隔
+        reconnectDelay: 5000,           // 5秒重连延迟
+        maxReconnectAttempts: 5,        // 最多重连5次
+        timeout: 30000                  // 30秒超时
+    };
 
-        // 连接服务器
+    // ========================================================================
+    // 构造函数 (Constructor)
+    // ========================================================================
+
+    /**
+     * 私有构造函数，防止外部直接实例化
+     */
+    private constructor() {
+        this.initializeProperties();
+    }
+
+    /**
+     * 初始化属性
+     */
+    private initializeProperties(): void {
+        this.lastResponseHeartTime = Date.now();
+    }
+
+    // ========================================================================
+    // Getter属性 (Computed)
+    // ========================================================================
+
+    /**
+     * 获取连接状态
+     * @returns 是否已连接
+     */
+    get connected(): boolean {
+        return this.connectionStatus === ConnectionStatus.CONNECTED;
+    }
+
+    // ========================================================================
+    // 公共方法 (Public Methods)
+    // ========================================================================
+
+    /**
+     * 配置WebSocket连接参数
+     * @param config 部分配置对象
+     */
+    public configure(config: Partial<SocketConfig>): void {
+        this.config = { ...this.config, ...config };
+    }
+
+    /**
+     * 连接WebSocket服务器（同步方式，保持向后兼容）
+     */
+    public connect(): Promise<void> | void {
+        // 检查浏览器支持
         if (!window.WebSocket) {
-            return console.log('您的浏览器不支持WebSocket');
+            console.log('您的浏览器不支持WebSocket');
+            return;
         }
 
-        // let token = $.cookie('123');
+        // 防止重复连接
-        // let token = '4E6EF539AAF119D82AC4C2BC84FBA21F';
+        if (this.connectionStatus === ConnectionStatus.CONNECTING || this.connected) {
+            console.warn('WebSocket已连接或正在连接中');
+            return;
+        }
+
+        this.connectionStatus = ConnectionStatus.CONNECTING;
+        
+        try {
+            this.ws = new WebSocket(this.buildWebSocketUrl());
+            this.setupEventHandlersLegacy();
+        } catch (error) {
+            this.connectionStatus = ConnectionStatus.ERROR;
+            console.error('WebSocket连接失败:', error);
+        }
+    }
+
+    /**
+     * 异步连接WebSocket服务器
+     * @returns Promise<void>
+     */
+    public connectAsync(): Promise<void> {
+        return new Promise((resolve, reject) => {
+            // 检查浏览器支持
+            if (!window.WebSocket) {
+                const error = '您的浏览器不支持WebSocket';
+                console.error(error);
+                reject(new Error(error));
+                return;
+            }
+
+            // 防止重复连接
+            if (this.connectionStatus === ConnectionStatus.CONNECTING || this.connected) {
+                console.warn('WebSocket已连接或正在连接中');
+                resolve();
+                return;
+            }
+
+            this.connectionStatus = ConnectionStatus.CONNECTING;
+            
+            try {
+                this.ws = new WebSocket(this.buildWebSocketUrl());
+                this.setupEventHandlers(resolve, reject);
+            } catch (error) {
+                this.connectionStatus = ConnectionStatus.ERROR;
+                reject(error);
+            }
+        });
+    }
+
+    /**
+     * 注册消息回调函数（支持泛型）
+     * @param messageType 消息类型
+     * @param callback 回调函数
+     */
+    public registerCallBack<T = any>(messageType: string, callback: CallbackFunction<T>): void {
+        if (!messageType || typeof callback !== 'function') {
+            console.error('注册回调函数参数无效');
+            return;
+        }
+        this.callBackMapping[messageType] = callback;
+        console.log(`注册消息处理器: ${messageType}`);
+    }
+
+    /**
+     * 注销消息回调函数
+     * @param messageType 消息类型
+     */
+    public unRegisterCallBack(messageType: string): void {
+        if (this.callBackMapping[messageType]) {
+            delete this.callBackMapping[messageType];
+            console.log(`注销消息处理器: ${messageType}`);
+        }
+    }
+
+    /**
+     * 发送数据到WebSocket服务器
+     * @param data 要发送的数据
+     * @returns Promise<void>
+     */
+    public send(data: any): Promise<void> {
+        return new Promise((resolve, reject) => {
+            if (!this.connected || !this.ws) {
+                // 未连接时的重试机制
+                if (this.sendRetryCount < 3) {
+                    this.sendRetryCount++;
+                    setTimeout(() => {
+                        this.send(data).then(resolve).catch(reject);
+                    }, this.sendRetryCount * 500);
+                    return;
+                } else {
+                    reject(new Error('WebSocket未连接且重试失败'));
+                    return;
+                }
+            }
+
+            try {
+                // 重置重试计数
+                this.sendRetryCount = 0;
+                
+                // 尝试发送JSON数据，失败则发送原始数据
+                const message = typeof data === 'string' ? data : JSON.stringify(data);
+                this.ws.send(message);
+                
+                console.log('发送消息:', message);
+                resolve();
+            } catch (error) {
+                console.error('发送消息失败:', error);
+                reject(error);
+            }
+        });
+    }
+
+    /**
+     * 关闭WebSocket连接
+     */
+    public closeWs(): void {
+        console.log('正在关闭WebSocket连接...');
+        
+        // 清理心跳
+        this.clearHeartbeat();
+        
+        // 关闭连接
+        if (this.ws) {
+            this.ws.close(1000, '主动关闭连接');
+            this.ws = null;
+        }
+        
+        // 更新状态
+        this.connectionStatus = ConnectionStatus.DISCONNECTED;
+        this.connectRetryCount = 0;
+        this.sendRetryCount = 0;
+        
+        console.log('WebSocket连接已关闭');
+    }
+
+    /**
+     * 获取当前连接状态
+     * @returns 连接状态枚举值
+     */
+    public getConnectionStatus(): ConnectionStatus {
+        return this.connectionStatus;
+    }
+
+    /**
+     * 获取连接统计信息
+     * @returns 连接统计对象
+     */
+    public getConnectionStats(): {
+        status: ConnectionStatus;
+        connectRetryCount: number;
+        lastResponseHeartTime: number;
+    } {
+        return {
+            status: this.connectionStatus,
+            connectRetryCount: this.connectRetryCount,
+            lastResponseHeartTime: this.lastResponseHeartTime
+        };
+    }
 
 
+<<<<<<< HEAD
         const url = 'ws://127.0.0.1:7777/hello?name=cdf'
         //const url = 'ws://192.168.1.124:7777/hello?name=cdf'
         this.ws = new WebSocket(url);
         // 连接成功的事件
+=======
+    // ========================================================================
+    // 私有方法 (Private Methods)
+    // ========================================================================
+
+    /**
+     * 构建完整的WebSocket URL
+     * 自动从JWT token中获取loginName作为name参数
+     * @returns 完整的WebSocket URL
+     */
+    private buildWebSocketUrl(): string {
+        const { url } = this.config;
+        
+        // 直接从JWT token中获取loginName作为name参数
+        const loginName = jwtUtil.getLoginName();
+        
+        if (loginName) {
+            const separator = url.includes('?') ? '&' : '?';
+            return `${url}${separator}name=${encodeURIComponent(loginName)}`;
+        }
+        
+        // 如果无法获取loginName，返回原始URL并输出警告
+        console.warn('无法从JWT token中获取loginName，WebSocket连接可能会失败');
+        return url;
+    }
+
+    /**
+     * 设置WebSocket事件处理器（异步版本）
+     * @param resolve Promise resolve回调
+     * @param reject Promise reject回调
+     */
+    private setupEventHandlers(resolve: () => void, reject: (error: Error) => void): void {
+        if (!this.ws) return;
+        
+        // 连接成功事件
+        this.ws.onopen = () => {
+            ElMessage.success("WebSocket连接服务端成功");
+            console.log('WebSocket连接成功');
+            this.connectionStatus = ConnectionStatus.CONNECTED;
+            this.connectRetryCount = 0;
+            this.startHeartbeat();
+            resolve();
+        };
+
+        // 连接关闭事件
+        this.ws.onclose = (event: CloseEvent) => {
+            console.log('WebSocket连接关闭', event.code, event.reason);
+            this.connectionStatus = ConnectionStatus.DISCONNECTED;
+            this.clearHeartbeat();
+            
+            // 非正常关闭且未超过最大重连次数，尝试重连
+            if (event.code !== 1000 && this.connectRetryCount < this.config.maxReconnectAttempts!) {
+                this.attemptReconnect();
+            }
+        };
+
+        // 连接错误事件
+        this.ws.onerror = (error: Event) => {
+            console.error('WebSocket连接错误:', error);
+            ElMessage.error("WebSocket连接异常");
+            this.connectionStatus = ConnectionStatus.ERROR;
+            reject(new Error('WebSocket连接失败'));
+        };
+
+        // 消息接收事件
+        this.ws.onmessage = (event: MessageEvent) => {
+            this.handleMessage(event);
+        };
+    }
+
+    /**
+     * 设置WebSocket事件处理器（兼容版本）
+     */
+    private setupEventHandlersLegacy(): void {
+        if (!this.ws) return;
+        
+        // 连接成功事件
+>>>>>>> d6d63523a3b094a6b60ea32f7779cb3888d13923
         this.ws.onopen = () => {
             ElMessage.success("webSocket连接服务端成功了");
             console.log('连接服务端成功了');
-            this.connected = true;
+            this.connectionStatus = ConnectionStatus.CONNECTED;
-            // 重置重新连接的次数
             this.connectRetryCount = 0;
-            this.updateLastActivityTime();
             this.startHeartbeat();
         };
-        // 1.连接服务端失败
+
-        // 2.当连接成功之后, 服务器关闭的情况
+        // 连接关闭事件
-        this.ws.onclose = () => {
+        this.ws.onclose = (event: CloseEvent) => {
             console.log('连接webSocket服务端关闭');
-            this.connected = false;
+            this.connectionStatus = ConnectionStatus.DISCONNECTED;
-            this.connectRetryCount++;
             this.clearHeartbeat();
-           /* setTimeout(() => {
+            
+            // 保持原有的重连逻辑（被注释掉的）
+            // this.connectRetryCount++;
+            /* setTimeout(() => {
                 this.connect();
             }, 500 * this.connectRetryCount);*/
-
-
         };
 
+        // 连接错误事件
         this.ws.onerror = () => {
             ElMessage.error("webSocket连接异常！");
-
+            this.connectionStatus = ConnectionStatus.ERROR;
-
         };
 
+        // 消息接收事件
+        this.ws.onmessage = (event: MessageEvent) => {
+            this.handleMessage(event);
+        };
+    }
 
-        // 得到服务端发送过来的数据
+    /**
-        this.ws.onmessage = (event) => {
+     * 处理接收到的消息
-            // console.log('🚀 ~ SocketService ~ connect ~ event:', event)
+     * 支持心跳响应、JSON消息和普通文本消息
-            if(event.data == 'over') {
+     * @param event WebSocket消息事件
-                //心跳消息处理
+     */
-                this.lastResponseHeartTime = Date.now();
+    private handleMessage(event: MessageEvent): void {
-                this.updateLastActivityTime(); // 收到心跳响应时更新活动时间
+        // console.log('Received message:', event.data);
-            }else {
+        
-                let message: { [key: string]: any };
+        // 心跳响应处理
-                try {
+        if (event.data === 'over') {
-                    console.log('Received message:',event.data)
+            console.log(`${new Date().toLocaleTimeString()} - 收到心跳响应`);
-                    message = JSON.parse(event.data);
+            this.lastResponseHeartTime = Date.now();
-                } catch (e) {
+            return;
-                    return console.error("消息解析失败", event.data, e);
+        }
-                }
 
-                /* 通过接受服务端发送的type字段来回调函数 */
+        // 检查消息是否为空或无效
+        if (!event.data || event.data.trim() === '') {
+            console.warn('收到空消息，跳过处理');
+            return;
+        }
+
+        // 业务消息处理
+        try {
+            // 检查是否为JSON格式
+            if (typeof event.data === 'string' && (event.data.startsWith('{') || event.data.startsWith('['))) {
+                const message: WebSocketMessage = JSON.parse(event.data);
                 if (message?.type && this.callBackMapping[message.type]) {
                     this.callBackMapping[message.type](message);
                 } else {
-                    console.log("抛弃====>")
+                    console.warn('未找到对应的消息处理器:', message.type);
-                    console.log(event.data)
+                }
-                    /* 丢弃或继续写你的逻辑 */
+            } else {
+                // 非JSON格式的消息，作为普通文本处理
+                console.log('收到非JSON格式消息:', event.data);
+                // 可以添加文本消息的处理逻辑
+                if (this.callBackMapping['text']) {
+                    this.callBackMapping['text']({ 
+                        type: 'text', 
+                        data: event.data 
+                    });
                 }
             }
-
+            
-
+        } catch (error) {
-        };
+            console.error('消息解析失败:', event.data, error);
-    }
+            console.error('消息类型:', typeof event.data);
-
+            console.error('消息长度:', event.data?.length || 0);
-
-
-
-
-    startHeartbeat() {
-        this.lastResponseHeartTime = Date.now();
-        const  _this = this
-        _this.workerBlobUrl  = window.URL.createObjectURL(new Blob(['(function(e){setInterval(function(){this.postMessage(null)},9000)})()']));
-
-        this.work = new Worker(_this.workerBlobUrl);
-        this.work.onmessage = function(e){
-            //判断多久没收到心跳响应
-
-            if(_this.lastActivityTime - _this.lastResponseHeartTime > 30000){
-                //说明已经三轮心跳没收到回复了，关闭检测，提示用户。
-                ElMessage.error("业务主体模块发生未知异常，请尝试重新启动！");
-                _this.clearHeartbeat();
-                return;
-            }
-            _this.sendHeartbeat();
-		}
-
-    }
-    sendHeartbeat() {
-        console.log(new Date()+"进入心跳消息发送。。。。。。。。。。。。。")
-        this.ws.send('alive');
-        this.updateLastActivityTime(); // 发送心跳后更新活动时间
-    }
-
-
-    updateLastActivityTime() {
-        this.lastActivityTime = Date.now();
-    }
-
-    clearHeartbeat() {
-        const  _this = this
-        if (_this.work) {
-            _this.work.terminate();
-            _this.work = null;
-        }
-        if (_this.workerBlobUrl) {
-            window.URL.revokeObjectURL(_this.workerBlobUrl); // 释放临时的Blob URL
-            _this.workerBlobUrl = null;
         }
     }
 
+    // ========================================================================
+    // 重连机制相关方法
+    // ========================================================================
 
+    /**
+     * 尝试重新连接WebSocket
+     */
+    private attemptReconnect(): void {
+        if (this.connectionStatus === ConnectionStatus.RECONNECTING) {
+            return;
+        }
 
-    // 回调函数的注册
+        this.connectionStatus = ConnectionStatus.RECONNECTING;
-    registerCallBack(socketType, callBack) {
+        this.connectRetryCount++;
-        this.callBackMapping[socketType] = callBack;
+        
-    }
+        const delay = this.config.reconnectDelay! * this.connectRetryCount;
-    // 取消某一个回调函数
+        
-    unRegisterCallBack(socketType) {
+        console.log(`尝试第${this.connectRetryCount}次重连，${delay}ms后开始...`);
-        this.callBackMapping[socketType] = null;
+        
-    }
+        setTimeout(() => {
-    // 发送数据的方法
-    send(data) {
-        // 判断此时此刻有没有连接成功
-        if (this.connected) {
-            this.sendRetryCount = 0;
             try {
-                this.ws.send(JSON.stringify(data));
+                const result = this.connect();
-            } catch (e) {
+                if (result instanceof Promise) {
-                this.ws.send(data);
+                    result.catch((error: any) => {
+                        console.error('重连失败:', error);
+                    });
+                }
+            } catch (error: any) {
+                console.error('重连失败:', error);
             }
-        } else {
+        }, delay);
-            this.sendRetryCount++;
+    }
-            setTimeout(() => {
+
-                this.send(data);
+    // ========================================================================
-            }, this.sendRetryCount * 500);
+    // 心跳机制相关方法
+    // ========================================================================
+
+    /**
+     * 启动心跳机制
+     */
+    private startHeartbeat(): void {
+        this.lastResponseHeartTime = Date.now();
+        this.createHeartbeatWorker();
+    }
+
+    /**
+     * 创建心跳Worker
+     * 使用Worker在独立线程中处理心跳定时器，避免主线程阻塞
+     */
+    private createHeartbeatWorker(): void {
+        try {
+            // 创建Worker脚本
+            const workerScript = `
+                setInterval(function() {
+                    postMessage('heartbeat');
+                }, ${this.config.heartbeatInterval});
+            `;
+            
+            this.workerBlobUrl = window.URL.createObjectURL(
+                new Blob([workerScript], { type: 'application/javascript' })
+            );
+            
+            this.heartbeatWorker = new Worker(this.workerBlobUrl);
+            
+            // 心跳Worker消息处理
+            this.heartbeatWorker.onmessage = (event: MessageEvent) => {
+                this.handleHeartbeatTick();
+            };
+            
+            // Worker错误处理
+            this.heartbeatWorker.onerror = (error: ErrorEvent) => {
+                console.error('心跳Worker错误:', error);
+                this.clearHeartbeat();
+            };
+            
+        } catch (error) {
+            console.error('创建心跳Worker失败:', error);
         }
     }
 
-    // 断开方法
+    /**
-    closeWs() {
+     * 处理心跳定时器事件
-        if (this.connected) {
+     * 检查连接超时并发送心跳消息
-            this.ws.close()
+     */
+    private handleHeartbeatTick(): void {
+        // 检查是否超时（距离上次收到心跳响应的时间）
+        const timeSinceLastResponse = Date.now() - this.lastResponseHeartTime;
+        
+        if (timeSinceLastResponse > this.config.timeout!) {
+            console.error(`WebSocket心跳超时: ${timeSinceLastResponse}ms > ${this.config.timeout}ms`);
+            ElMessage.error("WebSocket连接超时，请检查网络连接！");
+            this.clearHeartbeat();
+            this.closeWs();
+            return;
         }
-        console.log('执行WS关闭命令..');
+        
+        this.sendHeartbeat();
     }
-}
+
+    /**
+     * 发送心跳消息到服务器
+     */
+    private sendHeartbeat(): void {
+        if (this.connected && this.ws) {
+            console.log(`${new Date().toLocaleTimeString()} - 发送心跳消息`);
+            this.ws.send('alive');
+        }
+    }
+
+    /**
+     * 清理心跳机制
+     * 终止Worker并清理相关资源
+     */
+    private clearHeartbeat(): void {
+        if (this.heartbeatWorker) {
+            this.heartbeatWorker.terminate();
+            this.heartbeatWorker = null;
+        }
+        
+        if (this.workerBlobUrl) {
+            window.URL.revokeObjectURL(this.workerBlobUrl);
+            this.workerBlobUrl = null;
+        }
+    }
+}

frontend/src/views/home/components/testPopup.vue

@@ -199,7 +199,6 @@ const handleSubmitFast = () => {
       if (preTestStatus.value == 'waiting') {
         if (checkStore.selectTestItems.preTest) {
           startPreTest({
-            userPageId: "cdf",
             devIds: deviceIds,
             planId: planId,
             operateType: checkStore.reCheckType == 1 ? '1' : '2',
@@ -227,7 +226,6 @@ const handleSubmitFast = () => {
       if (channelsTestStatus.value == 'waiting') {
         if (!checkStore.selectTestItems.preTest && checkStore.selectTestItems.channelsTest) {
           startPreTest({
-            userPageId: "cdf",
             devIds: deviceIds,
             planId: planId,
             operateType: checkStore.reCheckType == 1 ? '1' : '2',
@@ -253,7 +251,6 @@ const handleSubmitFast = () => {
       if (TestStatus.value == "waiting") {
         if (!checkStore.selectTestItems.preTest && !checkStore.selectTestItems.channelsTest && checkStore.selectTestItems.test) {
           startPreTest({
-            userPageId: "cdf",
             devIds: deviceIds,
             planId: planId,
             operateType: checkStore.reCheckType == 1 ? '1' : '2',
@@ -392,7 +389,6 @@ const sendResume = () => {
 const sendReCheck = () => {
   console.log('发送重新检测指令')
   startPreTest({
-    userPageId: "cdf",
     devIds: checkStore.devices.map((item) => item.deviceId),
     planId: checkStore.plan.id,
     operateType: '2', // 0:'系数校验'，'1'为预检测、‘2‘为正式检测、'8'为不合格项复检