diff --git a/src/layout/index.vue b/src/layout/index.vue index 29fb5ff..e7bec82 100644 --- a/src/layout/index.vue +++ b/src/layout/index.vue @@ -27,6 +27,7 @@ import { AppMain, Navbar, Settings, TagsView } from './components'; import useAppStore from '@/store/modules/app'; import useSettingsStore from '@/store/modules/settings'; import { initWebSocket } from '@/utils/websocket'; +import { initSSE } from "@/utils/sse"; const settingsStore = useSettingsStore(); const theme = computed(() => settingsStore.theme); @@ -69,6 +70,7 @@ onMounted(() => { onMounted(() => { let protocol = window.location.protocol === 'https:' ? 'wss://' : 'ws://'; initWebSocket(protocol + window.location.host + import.meta.env.VITE_APP_BASE_API + '/resource/websocket'); + initSSE(import.meta.env.VITE_APP_BASE_API + '/sse') }); const handleClickOutside = () => { diff --git a/src/utils/sse.ts b/src/utils/sse.ts new file mode 100644 index 0000000..7db4aa7 --- /dev/null +++ b/src/utils/sse.ts @@ -0,0 +1,48 @@ +import { getToken } from '@/utils/auth'; +import { ElNotification } from 'element-plus'; +import useNoticeStore from '@/store/modules/notice'; + +let message = ''; + +// 初始化 +export const initSSE = (url: any) => { + if (import.meta.env.VITE_APP_WEBSOCKET === 'false') { + return; + } + url = url + '?Authorization=Bearer ' + getToken() + '&clientid=' + import.meta.env.VITE_APP_CLIENT_ID + const { + data, + error + } = useEventSource(url, [], { + autoReconnect: { + retries: 10, + delay: 3000, + onFailed() { + console.log('Failed to connect after 10 retries') + }, + } + }); + + watch(error, () => { + console.log('SSE connection error:', error.value) + error.value = null; + }); + + watch(data, () => { + if (!data.value) return; + useNoticeStore().addNotice({ + message: data.value, + read: false, + time: new Date().toLocaleString() + }); + ElNotification({ + title: '消息', + message: data.value, + type: 'success', + duration: 3000 + }); + data.value = null; + }); +}; + +