fix：完善sse，增加事件处理

apps/web-antd/src/store/notify.ts

@@ -2,6 +2,7 @@ import type { NotificationItem } from '@vben/layouts';
 
 import { computed, ref, watch } from 'vue';
 
+import { SSEEvent } from '@vben/constants';
 import { SvgMessageUrl } from '@vben/icons';
 import { $t } from '@vben/locales';
 import { useUserStore } from '@vben/stores';
@@ -46,27 +47,28 @@ export const useNotifyStore = defineStore(
       if (!sseReturnData) {
         return;
       }
-      const { data } = sseReturnData;
+      const { event, data } = sseReturnData;
 
       watch(data, (message) => {
-        if (!message) return;
-        console.log(`接收到消息: ${message}`);
-
-        notification.success({
-          description: message,
-          duration: 3,
-          message: $t('component.notice.received'),
-        });
-
-        notificationList.value.unshift({
-          // avatar: `https://api.multiavatar.com/${random(0, 10_000)}.png`, 随机头像
-          avatar: SvgMessageUrl,
-          date: dayjs().format('YYYY-MM-DD HH:mm:ss'),
-          isRead: false,
-          message,
-          title: $t('component.notice.title'),
-          userId: userId.value,
-        });
+        if (!event || !message) return;
+        console.log(`接收到事件为：${event.value} 的消息: ${message}`);
+        if (event.value === SSEEvent.MESSAGE) {
+          notification.success({
+            description: message,
+            duration: 3,
+            message: $t('component.notice.received'),
+          });
+
+          notificationList.value.unshift({
+            // avatar: `https://api.multiavatar.com/${random(0, 10_000)}.png`, 随机头像
+            avatar: SvgMessageUrl,
+            date: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+            isRead: false,
+            message,
+            title: $t('component.notice.title'),
+            userId: userId.value,
+          });
+        } else if (event.value === SSEEvent.HAZARD) { /* empty */ }
 
         // 需要手动置空 vue3在值相同时不会触发watch
         data.value = null;

apps/web-antd/src/utils/message.ts

@@ -1,3 +1,4 @@
+import { SSEEvent } from '@vben/constants';
 import { useAppConfig } from '@vben/hooks';
 import { useAccessStore } from '@vben/stores';
 
@@ -21,15 +22,19 @@ export function useSseMessage() {
 
   const sseAddr = `${apiURL}/resource/sse?clientid=${clientId}&Authorization=Bearer ${token}`;
 
-  const sseReturnData = useEventSource(sseAddr, [], {
-    autoReconnect: {
-      delay: 1000,
-      onFailed() {
-        console.error('sse重连失败.');
+  const sseReturnData = useEventSource(
+    sseAddr,
+    [SSEEvent.MESSAGE, SSEEvent.HAZARD],
+    {
+      autoReconnect: {
+        delay: 1000,
+        onFailed() {
+          console.error('sse重连失败.');
+        },
+        retries: 3,
       },
-      retries: 3,
     },
-  });
+  );
 
   return sseReturnData;
 }

packages/@core/base/shared/src/constants/index.ts

@@ -1,3 +1,4 @@
 export * from './dict-enum';
 export * from './globals';
+export * from './sse-event';
 export * from './vben';

packages/@core/base/shared/src/constants/sse-event.ts

@@ -0,0 +1,7 @@
+export const SSEEvent = {
+  NULL: null,
+  MESSAGE: 'message',
+  HAZARD: 'hazard',
+} as const;
+
+export type SSEEventKey = keyof typeof SSEEvent;