token失效或退出登录，重置store

package.json

@@ -36,7 +36,7 @@
     "@vitejs/plugin-vue": "^2.2.4",
     "autoprefixer": "^10.4.2",
     "eslint": "^8.10.0",
-    "eslint-config-prettier": "^8.4.0",
+    "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-vue": "^8.5.0",
     "postcss": "^8.4.7",
     "prettier": "^2.5.1",

pnpm-lock.yaml

@@ -12,7 +12,7 @@ specifiers:
   axios-progress-bar: ^1.2.0
   axios-retry: ^3.2.4
   eslint: ^8.10.0
-  eslint-config-prettier: ^8.4.0
+  eslint-config-prettier: ^8.5.0
   eslint-plugin-vue: ^8.5.0
   lodash-es: ^4.17.21
   moment: ^2.29.1
@@ -55,7 +55,7 @@ devDependencies:
   '@vitejs/plugin-vue': 2.2.4_vite@2.8.6+vue@3.2.31
   autoprefixer: 10.4.2_postcss@8.4.7
   eslint: 8.10.0
-  eslint-config-prettier: 8.4.0_eslint@8.10.0
+  eslint-config-prettier: 8.5.0_eslint@8.10.0
   eslint-plugin-vue: 8.5.0_eslint@8.10.0
   postcss: 8.4.7
   prettier: 2.5.1
@@ -474,7 +474,7 @@ packages:
       '@vue/reactivity-transform': 3.2.31
       '@vue/shared': 3.2.31
       estree-walker: 2.0.2
-      magic-string: 0.25.7
+      magic-string: 0.25.8
       postcss: 8.4.7
       source-map: 0.6.1
     dev: false
@@ -497,7 +497,7 @@ packages:
       '@vue/compiler-core': 3.2.31
       '@vue/shared': 3.2.31
       estree-walker: 2.0.2
-      magic-string: 0.25.7
+      magic-string: 0.25.8
     dev: false
 
   /@vue/reactivity/3.2.31:
@@ -1175,8 +1175,8 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  /eslint-config-prettier/8.4.0_eslint@8.10.0:
-    resolution: {integrity: sha512-CFotdUcMY18nGRo5KGsnNxpznzhkopOcOo0InID+sgQssPrzjvsyKZPvOgymTFeHrFuC3Tzdf2YndhXtULK9Iw==}
+  /eslint-config-prettier/8.5.0_eslint@8.10.0:
+    resolution: {integrity: sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==}
     hasBin: true
     peerDependencies:
       eslint: '>=7.0.0'
@@ -1696,8 +1696,8 @@ packages:
       yallist: 4.0.0
     dev: true
 
-  /magic-string/0.25.7:
-    resolution: {integrity: sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==}
+  /magic-string/0.25.8:
+    resolution: {integrity: sha512-n9NlSgfkB2rPYjSd/EZDoQcsXzwYAv4CIB/vi3ZSvZ2Tjax5W5Ie1NMy4HG3PVdcL4bBMMR20Ng4UcISMzqRLw==}
     dependencies:
       sourcemap-codec: 1.4.8
 
@@ -2092,8 +2092,8 @@ packages:
       glob: 7.2.0
     dev: true
 
-  /rollup/2.68.0:
-    resolution: {integrity: sha512-XrMKOYK7oQcTio4wyTz466mucnd8LzkiZLozZ4Rz0zQD+HeX4nUK4B8GrTX/2EvN2/vBF/i2WnaXboPxo0JylA==}
+  /rollup/2.69.0:
+    resolution: {integrity: sha512-kjER91tHyek8gAkuz7+558vSnTQ+pITEok1P0aNOS45ZXyngaqPsXJmSel4QPQnJo7EJMjXUU1/GErWkWiKORg==}
     engines: {node: '>=10.0.0'}
     hasBin: true
     optionalDependencies:
@@ -2280,7 +2280,7 @@ packages:
       '@antfu/utils': 0.5.0
       '@rollup/pluginutils': 4.1.2
       local-pkg: 0.4.1
-      magic-string: 0.25.7
+      magic-string: 0.25.8
       resolve: 1.22.0
       unplugin: 0.3.3_vite@2.8.6
     transitivePeerDependencies:
@@ -2309,7 +2309,7 @@ packages:
       debug: 4.3.3
       fast-glob: 3.2.11
       local-pkg: 0.4.1
-      magic-string: 0.25.7
+      magic-string: 0.25.8
       minimatch: 3.1.2
       resolve: 1.22.0
       unplugin: 0.3.3_vite@2.8.6
@@ -2394,7 +2394,7 @@ packages:
       esbuild: 0.14.23
       postcss: 8.4.7
       resolve: 1.22.0
-      rollup: 2.68.0
+      rollup: 2.69.0
     optionalDependencies:
       fsevents: 2.3.2
     dev: true

src/plugins/axiosApp.ts

@@ -1,6 +1,6 @@
 import axios from "axios";
 import { loadProgressBar } from "axios-progress-bar";
-// import { notifyInvalidTokenThrottled } from "./axiosNotice";
+import { notifyInvalidTokenThrottled } from "./axiosNotice";
 import axiosRetry from "axios-retry";
 import { store } from "@/store/store";
 
@@ -63,7 +63,7 @@ _axiosApp.interceptors.response.use(
 
     // 登录失效 跳转登录页面
     if (status == 403 || status == 401) {
-      // notifyInvalidTokenThrottled();
+      notifyInvalidTokenThrottled();
       return Promise.reject(error);
     } else if (status == 405) {
       if (showErrorMessage) {

src/plugins/axiosNotice.ts

@@ -0,0 +1,14 @@
+import { store } from "@/store/store";
+import { throttle } from "lodash-es";
+
+export const notifyInvalidTokenThrottled = throttle(
+  () => {
+    $message.error("登录失效，请重新登录！");
+    setTimeout(() => {
+      store.user.token = null;
+    }, 3000);
+    logger({ pgu: "AUTO", dtl: "登录失效" });
+  },
+  1000,
+  { trailing: false }
+);

src/router/index.ts

@@ -2,6 +2,7 @@ import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";
 import UserLogin from "@/features/UserLogin/UserLogin.vue";
 import MainLayout from "@/components/MainLayout/MainLayout.vue";
 import ChangePassword from "@/features/ChangePassword/ChangePassword.vue";
+import { resetStore, store } from "@/store/store";
 
 const routes: RouteRecordRaw[] = [
   { path: "/", component: UserLogin },
@@ -32,4 +33,26 @@ const router = createRouter({
   routes, // short for `routes: routes`
 });
 
+router.beforeEach((to, from, next) => {
+  const loginPath = "/login/";
+
+  // if (to.path) {
+  //   window._hmt.push(["_trackPageview", "/oe-web" + to.fullPath]);
+  // }
+
+  if (to.path.match(/^\/?/) || to.path.match(/^\/login\/.?$/)) {
+    resetStore();
+    next();
+  } else {
+    if (!localStorage.getItem("domain")) {
+      alert("地址出错，找不到机构！请关闭应用后重试！");
+    }
+    if (!store.user.token) {
+      next({ path: loginPath });
+    } else {
+      next();
+    }
+  }
+});
+
 export default router;

src/store/store.ts

@@ -1,12 +1,36 @@
 import { defineStore } from "pinia";
 import { Store } from "@/types/student-client";
 
+const initStore: Store = {
+  user: {} as Store["user"],
+  globalMaskCount: 0,
+  QECSConfig: {} as Store["QECSConfig"],
+  network: {} as Store["network"],
+  sysTime: {} as Store["sysTime"],
+} as Store;
+
+const resetState: Omit<
+  Store,
+  "globalMaskCount" | "network" | "sysTime" | "QECSConfig" | "camera"
+> = {
+  user: {} as Store["user"],
+  menus: {} as Store["menus"],
+  appDownload: {} as Store["appDownload"],
+  exam: {} as Store["exam"],
+  endedExamList: {} as Store["endedExamList"],
+  examList: {} as Store["examList"],
+  homeworkList: {} as Store["homeworkList"],
+  practiceList: {} as Store["practiceList"],
+  siteMessage: {} as Store["siteMessage"],
+};
+
+export function resetStore() {
+  Object.assign(store.$state, resetState);
+}
+
 export const useStore = defineStore("ecs", {
   state: () => {
-    return {
-      user: {},
-      globalMaskCount: 0,
-    } as Store;
+    return initStore;
   },
   getters: {
     /** 当前是否有globalMask */

src/types/student-client.d.ts

@@ -23,7 +23,7 @@ export type Store = {
     /** 用户的另一个id */
     key: string;
     /** 登录认证信息 */
-    token: string;
+    token: string | null;
     /** 专业 */
     specialty: string;
   };