✨ 前端用户退出时,关闭SignalR连接

vben271/src/hooks/web/useSignalR.ts

@@ -1,12 +1,13 @@
 import * as signalR from '@microsoft/signalr';
 import { useMessage } from '/@/hooks/web/useMessage';
 import { useUserStoreWithOut } from '/@/store/modules/user';
+let connection;
 export function useSignalR() {
   /**
    * 开始连接SignalR
    */
   function startConnect(): void {
-    let connection = connectionsignalR();
+    connection = connectionsignalR();
     //接收普通文本消息
     connection.on('ReceiveTextMessageAsync', ReceiveTextMessageHandlerAsync);
     //接收广播消息
@@ -14,16 +15,24 @@ export function useSignalR() {
     //开始连接
     connection.start();
   }
+  /**
+   * 关闭SignalR连接
+   */
+  function closeConnect(): void {
+    if (connection) {
+      connection.stop();
+    }
+  }
 
   /**
    * 连接signalr
    */
-  function connectionsignalR(): signalR.HubConnection {
+  function connectionsignalR() {
     const userStore = useUserStoreWithOut();
     const token = userStore.getToken;
 
     const url = (import.meta.env.VITE_WEBSOCKE_URL as string) + '/signalr/notification';
-    const connection = new signalR.HubConnectionBuilder()
+    connection = new signalR.HubConnectionBuilder()
       .withUrl(url, {
         accessTokenFactory: () => token,
         skipNegotiation: true,
@@ -78,5 +87,5 @@ export function useSignalR() {
     });
   }
 
-  return { startConnect };
+  return { startConnect, closeConnect };
 }

vben271/src/router/index.ts

@@ -1,8 +1,8 @@
-import { createWebHistory, RouteRecordRaw } from 'vue-router';
-import type { App } from 'vue';
+import { createWebHistory, RouteRecordRaw } from "vue-router";
+import type { App } from "vue";
 
-import { createRouter, createWebHashHistory } from 'vue-router';
-import { basicRoutes } from './routes';
+import { createRouter, createWebHashHistory } from "vue-router";
+import { basicRoutes } from "./routes";
 
 // 白名单应该包含基本静态路由
 const WHITE_NAME_LIST: string[] = [];
@@ -18,7 +18,7 @@ export const router = createRouter({
   history: createWebHistory(import.meta.env.VITE_PUBLIC_PATH),
   routes: basicRoutes as unknown as RouteRecordRaw[],
   strict: true,
-  scrollBehavior: () => ({ left: 0, top: 0 }),
+  scrollBehavior: () => ({ left: 0, top: 0 })
 });
 
 // reset router

vben271/src/store/modules/user.ts

@@ -20,7 +20,7 @@ import { router } from '/@/router';
 import { usePermissionStore } from '/@/store/modules/permission';
 import { LoginInput } from '/@/services/ServiceProxies';
 import jwt_decode from 'jwt-decode';
-
+import { useSignalR } from '/@/hooks/web/useSignalR';
 import { useOidcLogout } from '/@/views/sys/login/useLogin';
 interface UserState {
   userInfo: Nullable<UserInfo>;
@@ -223,6 +223,8 @@ export const useUserStore = defineStore({
         content: t('sys.app.logoutMessage'),
         onOk: async () => {
           await this.logout(true);
+          const { closeConnect } = useSignalR();
+          closeConnect();
         },
       });
     },