feat: 添加 CachingAsyncRoutes 是否开启动态路由缓存本地，默认 true

public/serverConfig.json

@@ -17,6 +17,7 @@
   "ShowLogo": true,
   "ShowModel": "smart",
   "MenuArrowIconNoTransition": true,
+  "CachingAsyncRoutes": true,
   "MapConfigure": {
     "amapKey": "97b3248d1553172e81f168cf94ea667e",
     "options": {

src/router/utils.ts

@@ -16,6 +16,7 @@ import {
   storageSession,
   isIncludeAllChildren
 } from "@pureadmin/utils";
+import { getConfig } from "@/config";
 import { buildHierarchyTree } from "@/utils/tree";
 import { cloneDeep, intersection } from "lodash-unified";
 import { sessionKey, type DataInfo } from "@/utils/auth";
@@ -151,41 +152,60 @@ function addPathMatch() {
   }
 }
 
+/** 处理动态路由（后端返回的路由） */
+function handleAsyncRoutes(routeList) {
+  if (routeList.length === 0) {
+    usePermissionStoreHook().handleWholeMenus(routeList);
+  } else {
+    formatFlatteningRoutes(addAsyncRoutes(routeList)).map(
+      (v: RouteRecordRaw) => {
+        // 防止重复添加路由
+        if (
+          router.options.routes[0].children.findIndex(
+            value => value.path === v.path
+          ) !== -1
+        ) {
+          return;
+        } else {
+          // 切记将路由push到routes后还需要使用addRoute，这样路由才能正常跳转
+          router.options.routes[0].children.push(v);
+          // 最终路由进行升序
+          ascending(router.options.routes[0].children);
+          if (!router.hasRoute(v?.name)) router.addRoute(v);
+          const flattenRouters: any = router
+            .getRoutes()
+            .find(n => n.path === "/");
+          router.addRoute(flattenRouters);
+        }
+      }
+    );
+    usePermissionStoreHook().handleWholeMenus(routeList);
+  }
+  addPathMatch();
+}
+
 /** 初始化路由 */
 function initRouter() {
   return new Promise(resolve => {
-    getAsyncRoutes().then(({ data }) => {
-      if (data.length === 0) {
-        usePermissionStoreHook().handleWholeMenus(data);
-        resolve(router);
+    if (getConfig()?.CachingAsyncRoutes) {
+      // 开启动态路由缓存本地sessionStorage
+      const key = "async-routes";
+      const asyncRouteList = storageSession.getItem(key) as any;
+      if (asyncRouteList?.length > 0) {
+        handleAsyncRoutes(asyncRouteList);
       } else {
-        formatFlatteningRoutes(addAsyncRoutes(data)).map(
-          (v: RouteRecordRaw) => {
-            // 防止重复添加路由
-            if (
-              router.options.routes[0].children.findIndex(
-                value => value.path === v.path
-              ) !== -1
-            ) {
-              return;
-            } else {
-              // 切记将路由push到routes后还需要使用addRoute，这样路由才能正常跳转
-              router.options.routes[0].children.push(v);
-              // 最终路由进行升序
-              ascending(router.options.routes[0].children);
-              if (!router.hasRoute(v?.name)) router.addRoute(v);
-              const flattenRouters: any = router
-                .getRoutes()
-                .find(n => n.path === "/");
-              router.addRoute(flattenRouters);
-            }
-            resolve(router);
-          }
-        );
-        usePermissionStoreHook().handleWholeMenus(data);
+        getAsyncRoutes().then(({ data }) => {
+          handleAsyncRoutes(data);
+          storageSession.setItem(key, data);
+        });
       }
-      addPathMatch();
-    });
+      resolve(router);
+    } else {
+      getAsyncRoutes().then(({ data }) => {
+        handleAsyncRoutes(data);
+        resolve(router);
+      });
+    }
   });
 }
 

src/utils/auth.ts

@@ -70,7 +70,7 @@ export function setToken(data: DataInfo<Date>) {
 /** 删除`token`以及key值为`user-info`的session信息 */
 export function removeToken() {
   Cookies.remove(TokenKey);
-  sessionStorage.removeItem(sessionKey);
+  sessionStorage.clear();
 }
 
 /** 格式化token（jwt格式） */

src/views/permission/page/index.vue

@@ -33,6 +33,7 @@ function onChange() {
     .loginByUsername({ username: username.value, password: "admin123" })
     .then(res => {
       if (res.success) {
+        sessionStorage.removeItem("async-routes");
         usePermissionStoreHook().clearAllCachePage();
         initRouter();
       }

types/global.d.ts

@@ -95,6 +95,7 @@ declare global {
     ShowLogo?: boolean;
     ShowModel?: string;
     MenuArrowIconNoTransition?: boolean;
+    CachingAsyncRoutes?: boolean;
     MapConfigure?: {
       amapKey?: string;
       options: {