diff --git a/yudao-admin-vue3/.env.local b/yudao-admin-vue3/.env.local index 39157cd..be87319 100644 --- a/yudao-admin-vue3/.env.local +++ b/yudao-admin-vue3/.env.local @@ -4,9 +4,9 @@ NODE_ENV=development VITE_DEV=true # 请求路径 -VITE_BASE_URL='https://zysc.fjptzykj.com' +# VITE_BASE_URL='https://zysc.fjptzykj.com' # VITE_BASE_URL='http://192.168.10.75:6127' -# VITE_BASE_URL='http://127.0.0.1:6127' +VITE_BASE_URL='http://127.0.0.1:6127' # 文件上传类型:server - 后端上传, client - 前端直连上传,仅支持 S3 服务 VITE_UPLOAD_TYPE=server diff --git a/yudao-admin-vue3/src/App.vue b/yudao-admin-vue3/src/App.vue index 356eef0..6a70736 100644 --- a/yudao-admin-vue3/src/App.vue +++ b/yudao-admin-vue3/src/App.vue @@ -6,7 +6,11 @@ import { CACHE_KEY, useCache } from '@/hooks/web/useCache' import routerSearch from '@/components/RouterSearch/index.vue' import EventBus from '@/utils/eventBus' import { debounce } from 'lodash' +import { getRefreshToken, getAccessToken } from '@/utils/auth' +import { useWebSocket } from '@vueuse/core' import { ElNotification } from 'element-plus' +import bgm from './xm3463.mp3' +const audio = new Audio(bgm) defineOptions({ name: 'APP' }) const { getPrefixCls } = useDesign() @@ -26,15 +30,76 @@ const setDefaultTheme = () => { } setDefaultTheme() const debounceNotify = debounce((msg) => { - alert(msg) - ElNotification.info({ - title: "新消息", - message: msg, - duration: 3000, - }) - }, 600); + //alert(msg) + ElNotification.info({ + title: "新消息", + message: msg, + duration: 3000, + }) +}, 600); +const server = ref('') +const wsInstance = ref(null) + +// 创建 WebSocket 连接 +const createWebSocket = () => { + if (!getAccessToken()) return + + server.value = (import.meta.env.VITE_BASE_URL + '/infra/ws?token=').replace('http', 'ws') + getAccessToken() + wsInstance.value = useWebSocket(server.value, { + onConnected: (ws) => { + // if (typeof shangxian === 'function') { + // shangxian() + // } + console.log('websocket 连接成功!', ws) + }, + onDisconnected: (ws, event) => { + // if (typeof xiaxian === 'function') { + // xiaxian() + // } + console.log('WebSocket 连接断开', event) + }, + onMessage: (ws, event) => { + if (event.data === 'pong') { + return + } + const jsonMessage = JSON.parse(event.data) + if( jsonMessage.type === 'kefu_message_type'){ + console.log('来自用户发送的消息:', JSON.parse(jsonMessage.content)) + const message = JSON.parse(jsonMessage.content) + if (message.senderType == 1) { + audio.play() + debounceNotify(message.content) + } + } + }, + autoReconnect: true, + heartbeat: true + }) +} +// 监听 token 变化 +// watch(() => getAccessToken(), (newToken) => { +// if (wsInstance.value?.close) { +// wsInstance.value.close() +// } +// if (newToken) { +// createWebSocket() +// } +// }) onMounted(() => { -EventBus.on('show-notification', debounceNotify); + // 初始化事件监听 + EventBus.on('show-notification', debounceNotify) + // token 更新时重新建立连接 + EventBus.on('update-token', () => { + if (wsInstance.value?.close) { + wsInstance.value.close() + } + createWebSocket() + }) + if (wsInstance.value?.close) { + wsInstance.value.close() + } + // 初始化连接 + createWebSocket() })