feat: 添加前端单点登录

package.json

@@ -35,7 +35,7 @@
     "@pureadmin/components": "^1.1.0",
     "@pureadmin/descriptions": "^1.1.0",
     "@pureadmin/table": "^1.6.0",
-    "@pureadmin/utils": "^1.6.6",
+    "@pureadmin/utils": "^1.6.7",
     "@vueuse/core": "^9.5.0",
     "@vueuse/motion": "2.0.0-beta.12",
     "@wangeditor/editor": "^5.1.21",

pnpm-lock.yaml

@@ -22,7 +22,7 @@ specifiers:
   "@pureadmin/descriptions": ^1.1.0
   "@pureadmin/table": ^1.6.0
   "@pureadmin/theme": ^2.4.0
-  "@pureadmin/utils": ^1.6.6
+  "@pureadmin/utils": ^1.6.7
   "@types/element-resize-detector": 1.1.3
   "@types/intro.js": ^5.1.0
   "@types/js-cookie": ^3.0.1
@@ -133,7 +133,7 @@ dependencies:
   "@pureadmin/components": 1.1.0_vue@3.2.45
   "@pureadmin/descriptions": 1.1.1_element-plus@2.2.22
   "@pureadmin/table": 1.6.0_element-plus@2.2.22
-  "@pureadmin/utils": 1.6.6_aotapuqn7htzdjltsyimavekky
+  "@pureadmin/utils": 1.6.7_aotapuqn7htzdjltsyimavekky
   "@vueuse/core": 9.5.0_vue@3.2.45
   "@vueuse/motion": 2.0.0-beta.12_vue@3.2.45
   "@wangeditor/editor": 5.1.23
@@ -1130,8 +1130,8 @@ packages:
       vue-i18n:
         optional: true
     dependencies:
-      "@intlify/message-compiler": 9.3.0-beta.7
+      "@intlify/message-compiler": 9.3.0-beta.10
-      "@intlify/shared": 9.3.0-beta.7
+      "@intlify/shared": 9.3.0-beta.10
       jsonc-eslint-parser: 1.4.1
       source-map: 0.6.1
       vue-i18n: 9.2.2_vue@3.2.45
@@ -1169,14 +1169,14 @@ packages:
       "@intlify/shared": 9.2.2
       source-map: 0.6.1
 
-  /@intlify/message-compiler/9.3.0-beta.7:
+  /@intlify/message-compiler/9.3.0-beta.10:
     resolution:
       {
-        integrity: sha512-70r2UNp6DyKtIM4FgYCwdSuBK7xqCx2rVSXLMFiDRQi8pwooBklmOuzA0j7Q8ffbwKlFUJEEr2xPHZz2TJ6NAw==
+        integrity: sha512-RoOC6yceOykLRhN0NlbkNOBUx1el6iphx3W8NfOx3jHVNtfT1FYokx14/5sU3F1F0uxeG4sp6q+ppKvaF8o+ww==
       }
     engines: { node: ">= 14" }
     dependencies:
-      "@intlify/shared": 9.3.0-beta.7
+      "@intlify/shared": 9.3.0-beta.10
       source-map: 0.6.1
     dev: true
 
@@ -1187,10 +1187,10 @@ packages:
       }
     engines: { node: ">= 14" }
 
-  /@intlify/shared/9.3.0-beta.7:
+  /@intlify/shared/9.3.0-beta.10:
     resolution:
       {
-        integrity: sha512-weWqKXyv94rdPXbSFYvA4yIwLYDhzgIWfgrVQ6UYARobPFE3BN+woWmjlGmASTyXMzZtTsq21b0LCN9SHN8pxQ==
+        integrity: sha512-h93uAanbAt/XgjDHclrVB7xix6r7Uz11wx0iGNOCdHP7aA2LCJjUT3uNbekJjjbo+Fl5jzTSJZdm2SexzoqhRA==
       }
     engines: { node: ">= 14" }
     dev: true
@@ -1214,7 +1214,7 @@ packages:
         optional: true
     dependencies:
       "@intlify/bundle-utils": 3.4.0_vue-i18n@9.2.2
-      "@intlify/shared": 9.3.0-beta.7
+      "@intlify/shared": 9.3.0-beta.10
       "@rollup/pluginutils": 4.2.1
       debug: 4.3.4
       fast-glob: 3.2.12
@@ -1402,10 +1402,10 @@ packages:
       string-hash: 1.1.3
     dev: true
 
-  /@pureadmin/utils/1.6.6_aotapuqn7htzdjltsyimavekky:
+  /@pureadmin/utils/1.6.7_aotapuqn7htzdjltsyimavekky:
     resolution:
       {
-        integrity: sha512-BQbfN1TjamRtiyiun2sL1nxc0KEsOpqfAuXW+TVdpyoKkY+B5qiMDggpsH98fhs8yoY2Kd3E2g1WXb8VzD9mdw==
+        integrity: sha512-SNOGyhrzqMzySpicFd/ptJS7xOt9p2xGuNXFZwhq1elruPKRLRa7dl+OHGrIWzQIvhtbOf/yje9mnOFOY77PZA==
       }
     peerDependencies:
       dayjs: "*"

src/router/index.ts

@@ -1,3 +1,4 @@
+import "@/utils/sso";
 import { getConfig } from "@/config";
 import { toRouteType } from "./types";
 import NProgress from "@/utils/progress";

src/store/modules/multiTags.ts

@@ -11,11 +11,11 @@ export const useMultiTagsStore = defineStore({
   state: () => ({
     // 存储标签页信息（路由信息）
     multiTags: storageLocal.getItem<StorageConfigs>("responsive-configure")
-      .multiTagsCache
+      ?.multiTagsCache
       ? storageLocal.getItem<StorageConfigs>("responsive-tags")
       : [...routerArrays],
     multiTagsCache: storageLocal.getItem<StorageConfigs>("responsive-configure")
-      .multiTagsCache
+      ?.multiTagsCache
   }),
   getters: {
     getMultiTagsCache() {

src/utils/auth.ts

@@ -59,8 +59,10 @@ export function setToken(data: DataInfo<Date>) {
     const { username, roles } = data;
     setSessionKey(username, roles);
   } else {
-    const { username, roles } =
+    const username =
-      storageSession.getItem<DataInfo<number>>(sessionKey);
+      storageSession.getItem<DataInfo<number>>(sessionKey)?.username ?? "";
+    const roles =
+      storageSession.getItem<DataInfo<number>>(sessionKey)?.roles ?? [];
     setSessionKey(username, roles);
   }
 }

src/utils/sso.ts

@@ -0,0 +1,59 @@
+import { removeToken, setToken, type DataInfo } from "./auth";
+import { subBefore, getQueryMap } from "@pureadmin/utils";
+
+/**
+ * 简版前端单点登录，根据实际业务自行编写
+ * 划重点：
+ * 判断是否为单点登录，不为则直接返回不再进行任何逻辑处理，下面是单点登录后的逻辑处理
+ * 1.清空本地旧信息；
+ * 2.获取url中的重要参数信息，然后通过 setToken 保存在本地；
+ * 3.删除不需要显示在 url 的参数
+ * 4.使用 window.location.replace 跳转正确页面
+ */
+(function () {
+  // 获取 url 中的参数
+  const params = getQueryMap(location.href) as DataInfo<Date>;
+  const must = ["username", "roles", "accessToken"];
+  const mustLength = must.length;
+  if (Object.keys(params).length !== mustLength) return;
+
+  // url 参数满足 must 里的全部值，才判定为单点登录，避免非单点登录时刷新页面无限循环
+  let sso = [];
+  let start = 0;
+
+  while (start < mustLength) {
+    if (Object.keys(params).includes(must[start]) && sso.length <= mustLength) {
+      sso.push(must[start]);
+    } else {
+      sso = [];
+    }
+    start++;
+  }
+
+  if (sso.length === mustLength) {
+    // 判定为单点登录
+
+    // 清空本地旧信息
+    removeToken();
+
+    // 保存新信息到本地
+    setToken(params);
+
+    // 删除不需要显示在 url 的参数
+    delete params["roles"];
+    delete params["accessToken"];
+
+    const newUrl = `${location.origin}${subBefore(
+      location.hash,
+      "?"
+    )}?${JSON.stringify(params)
+      .replace(/["{}]/g, "")
+      .replace(/:/g, "=")
+      .replace(/,/g, "&")}`;
+
+    // 替换历史记录项
+    window.location.replace(newUrl);
+  } else {
+    return;
+  }
+})();