feat(401登录)：接口401返回登录页

package.json

@@ -31,6 +31,7 @@
     "js-cookie": "3.0.5",
     "mitt": "3.0.1",
     "pinia": "2.2.8",
+    "pinia-plugin-persist": "1.0.0",
     "screenfull": "6.0.2",
     "vue": "3.5.13",
     "vue-i18n": "10.0.5",

src/base/ajax.js

@@ -4,6 +4,8 @@ import { kuky_Authorization } from './storage';
 
 import replaceProxyUrl from './ajax/replace-proxy-url';
 
+import { backToLogin } from './ajax/back-to-login';
+
 const ajax = axios.create({
   withCredentials: true, // 跨域发送 cookie
   timeout: 300000, // 请求超时
@@ -33,12 +35,20 @@ ajax.interceptors.response.use(
   (response) => {
     const res_data = response.data;
     const { code, data, msg } = res_data;
-
+    if (res_data.code == '401' || res_data.retcode == '401') {
+      // 回到登录页面
+      backToLogin();
+    }
     return res_data;
   },
   (error) => {
+    if (error.message.includes('401')) {
+      backToLogin();
+    }
+    if (error.status === 401) {
+      backToLogin();
+    }
     return Promise.reject(error);
   }
 );
-
 export default ajax;

src/base/ajax/back-to-login.js

@@ -0,0 +1,24 @@
+import { ref } from 'vue';
+import { Modal } from '@arco-design/web-vue';
+import { kuky_Authorization } from '../storage';
+import router from '../../router';
+
+const is_need_relogin = ref(false);
+const backToLogin = () => {
+  if (!is_need_relogin.value) {
+    is_need_relogin.value = true;
+    Modal.warning({
+      title: '系统提示',
+      content: '登录信息已过期，请重新登录',
+      onOk: () => {
+        kuky_Authorization.remove();
+        is_need_relogin.value = false;
+        router.push('/login');
+      },
+      onCancel: () => {
+        is_need_relogin.value = false;
+      }
+    });
+  }
+};
+export { backToLogin };

src/base/store/index.js

@@ -0,0 +1,7 @@
+import { createPinia } from 'pinia';
+import piniaPersist from 'pinia-plugin-persist';
+
+const store = createPinia();
+store.use(piniaPersist);
+
+export default store;

src/base/store/use-current-user.js

@@ -6,6 +6,17 @@ import { kuky_Authorization } from '../storage';
  * 当前登录的用户信息
  */
 export const useCurrentUserStore = defineStore('current_user', {
+  persist: {
+    enabled: true,
+    // 可选：自定义存储的 key 和要持久化的路径
+    strategies: [
+      {
+        key: 'info',
+        storage: localStorage,
+        paths: ['username'] // 只持久化 username 属性
+      }
+    ]
+  },
   state: () => {
     return {
       name: 'Jack',

src/index.js

@@ -15,9 +15,6 @@ import './index.css';
  * @see https://wujie-micro.github.io/doc/pack/#%E5%BC%95%E5%85%A5
  */
 import WujieVue from 'wujie-vue3';
-
-import { createPinia } from 'pinia';
-
 import App from './App.vue';
 
 import router from './router'; // 路由
@@ -25,14 +22,13 @@ import router from './router'; // 路由
 import { setupI18n } from './i18n';
 
 import { initTheme } from './base/theme';
-
-const pinia = createPinia();
+import store from './base/store';
 const app = createApp(App);
 
 app.use(router);
 // app.use(directive);
 app.use(WujieVue);
-app.use(pinia);
+app.use(store);
 app.use(ArcoVue);
 app.use(ArcoVueIcon);