/** * WebSocket功能混入 * 提供WebSocket连接管理的通用方法和生命周期处理 * * @author kxmall * @date 2025-01-08 */ import riderWebSocketManager from '@/utils/websocket.js'; import { registerMessageHandlers, unregisterMessageHandlers } from '@/utils/messageHandlers.js'; import { mapState } from 'vuex'; export default { computed: { ...mapState(['token', 'userInfo']) }, data() { return { // WebSocket连接状态 wsConnectionStatus: 'disconnected', // disconnected, connecting, connected, error // 是否启用WebSocket(可以通过配置控制) wsEnabled: true }; }, methods: { /** * 初始化WebSocket连接 */ initWebSocket() { if (!this.wsEnabled) { console.log('WebSocket功能已禁用'); return; } if (!this.userInfo || !this.userInfo.state) { console.log('用户未通过审核,不连接WebSocket'); return; } // 注册消息处理器 registerMessageHandlers(riderWebSocketManager, this); // 连接WebSocket riderWebSocketManager.connect(this.userInfo, this.$baseUrl); console.log('WebSocket初始化完成'); }, /** * 断开WebSocket连接 */ disconnectWebSocket() { if (riderWebSocketManager.isConnected()) { unregisterMessageHandlers(riderWebSocketManager); riderWebSocketManager.disconnect(); console.log('WebSocket连接已断开'); } }, /** * 重连WebSocket */ reconnectWebSocket() { console.log('手动重连WebSocket'); riderWebSocketManager.reset(); this.disconnectWebSocket(); // 延迟一秒后重连 setTimeout(() => { this.initWebSocket(); }, 1000); }, /** * 发送WebSocket消息 * @param {String} message 消息内容 */ sendWebSocketMessage(message) { return riderWebSocketManager.send(message); }, /** * 获取WebSocket连接状态 */ getWebSocketStatus() { return riderWebSocketManager.isConnected() ? 'connected' : 'disconnected'; }, /** * 设置WebSocket启用状态 * @param {Boolean} enabled 是否启用 */ setWebSocketEnabled(enabled) { this.wsEnabled = enabled; if (enabled) { this.initWebSocket(); } else { this.disconnectWebSocket(); } } }, /** * 页面显示时的处理 */ onShow() { // 如果用户状态发生变化,重新初始化WebSocket if (this.userInfo && this.userInfo.state && this.wsEnabled) { if (!riderWebSocketManager.isConnected()) { console.log('页面显示,重新连接WebSocket'); this.initWebSocket(); } } }, /** * 页面隐藏时的处理 */ onHide() { // 页面隐藏时不断开连接,保持后台接收消息 console.log('页面隐藏,WebSocket保持连接'); }, /** * 组件销毁前的清理 */ beforeDestroy() { this.disconnectWebSocket(); }, /** * 组件销毁后的清理(兼容性) */ destroyed() { this.disconnectWebSocket(); }, /** * 页面卸载时的清理 */ onUnload() { this.disconnectWebSocket(); } };