路由,异常修改

src/lang/package/zh-cn/common.js

@@ -24,6 +24,7 @@ export default {
   cancel: '取消',
   user_confirm: '用户确认',
   re_login: '重新登录',
+  reload: '重新加载',
   opera_success: '操作成功',
   opera_fail: '操作失败',
   token_error: '用户验证失败,请重新登录'

src/router/guard.js

@@ -1,9 +1,6 @@
-import { hasNecessaryRoute, addUserRoutes, getUserMeta } from './register'
 import { get } from 'lodash-es'
 import NProgress from 'nprogress'
 import 'nprogress/nprogress.css'
-import { ElMessageBox } from 'element-plus'
-import i18n from '@/lang'
 import { UserStore } from '@/store/user'
 
 const whiteList = ['/redirect', '/login', '/401', '/404', '/route/loading']

src/router/register.js

@@ -1,6 +1,21 @@
-import { AxiosWrapper } from '@/utils/axios-wrapper'
 import { UserStore } from '@/store/user'
 import { cloneDeep, isArray, omit } from 'lodash-es'
+
+// 获取用户信息,返回菜单
+export const getUserMeta = async (token) => {
+  const userStore = UserStore()
+  const result = await userStore.tokenView(token)
+  if (result.errcode === 0) {
+    userStore.setUser(result.data)
+    const resetMenusResult = resetMenus(result.data.menus)
+    const storeMenus = toRaw(userStore.menus)
+    if (storeMenus.length <= 0) {
+      userStore.setMenus(resetMenusResult)
+    }
+    return { menus: result.data.menus, errcode: 0 }
+  }
+}
+
 // 检查路由是否存在
 export const hasNecessaryRoute = (to, router) => {
   // 将默认注册的路由平铺成一维数组
@@ -92,27 +107,6 @@ const routesRegister = (menus, defaultRoutes, router) => {
   }
 }
 
-// 获取用户信息,返回菜单
-export const getUserMeta = async (token) => {
-  const userStore = UserStore()
-  const axios = new AxiosWrapper()
-  const result = await axios.$get(`/token/tokenView`, null, {
-    headers: {
-      token: token
-    }
-  })
-  if (result.errcode === 0) {
-    userStore.setUser(result.data)
-    const resetMenusResult = resetMenus(result.data.menus)
-    const storeMenus = toRaw(userStore.menus)
-    if (storeMenus.length <= 0) {
-      userStore.setMenus(resetMenusResult)
-    }
-    return { menus: result.data.menus, errcode: 0 }
-  }
-  return { errmsg: result.errmsg, errcode: result.errcode }
-}
-
 const resetMenus = (menus) => {
   if (!isArray(menus) || menus.length <= 0) return []
   const cMenus = cloneDeep(menus)

src/store/user.js

@@ -1,4 +1,6 @@
 import { defineStore } from 'pinia'
+import { AxiosWrapper } from '@/utils/axios-wrapper'
+const axios = new AxiosWrapper()
 export const UserStore = defineStore('user', () => {
   const user = ref({})
   const menus = ref([])
@@ -19,5 +21,14 @@ export const UserStore = defineStore('user', () => {
   const setMenus = (payload) => {
     menus.value = payload
   }
-  return { user, setUser, logOut, menus, setMenus }
+
+  const tokenView = async (token) => {
+    const result = await axios.$get(`/token/tokenView`, null, {
+      headers: {
+        token: token
+      }
+    })
+    return result
+  }
+  return { user, setUser, logOut, menus, setMenus, tokenView }
 })

src/utils/axios-wrapper.js

@@ -10,7 +10,7 @@ import i18n from '@/lang'
 import * as crypto from './crypto'
 let currentRequests = 0
 const { VITE_APP_BASE_API, VITE_USE_CRYPTO } = import.meta.env
-
+const userErrorCodeList = ['NOT_LOGIN', 'ACCOUNT_HAS_EXPIRED', 'ACCOUNT_LOGGED_IN_ELESWHERE', 'USER_NOT_FOUND', 'USER_IS_DISABLED', 'ROLE_IS_DISABLED']
 export class AxiosWrapper {
   constructor({ baseUrl = VITE_APP_BASE_API, unwrap = true } = {}) {
     this.baseUrl = baseUrl
@@ -79,50 +79,8 @@ export class AxiosWrapper {
         baseURL: this.baseUrl,
         withCredentials: true
       })
-      // #region 加密部分
-      // 加密,需要根据env文件判断是否启用加密
-      if (JSON.parse(VITE_USE_CRYPTO)) {
-        // 生成随机字符串
-        const reqCode = crypto.getRandomString()
-        axios.interceptors.request.use(async (config) => {
-          // 加密真实使用的加密字符串
-          const deReqCode = crypto.pemEncrypt(reqCode)
-          // 加密数据并替换
-          config.transformRequest = (data) => {
-            if (data) {
-              console.group('请求')
-              console.log(`加密串:${reqCode}`)
-              console.log(`原数据:`)
-              // 加密 加密字符串
-              const strData = JSON.stringify(data)
-              console.log(strData)
-              // 加密数据
-              const enCodeData = crypto.encrypt(reqCode, strData)
-              console.log(`加密后数据:`)
-              console.log(enCodeData)
-              // 替换数据位置
-              return JSON.stringify({ data: enCodeData })
-            }
-            return undefined
-          }
-          // 添加请求头,将 加密的真实使用加密字符串附上
-          config.headers['api-token'] = deReqCode
-          return config
-        })
-        axios.interceptors.response.use(
-          (response) => {
-            if (get(response, 'data.data')) {
-              let data = crypto.decrypt(reqCode, get(response, 'data.data'))
-              const dobj = JSON.parse(data || '{}')
-              const others = pick(get(response, 'data'), ['errcode', 'errmsg'])
-              response.data = { ...others, ...dobj }
-            }
-            return response
-          },
-          (error) => Promise.reject(error)
-        )
-      }
-      // #endregion
+      AxiosWrapper.toCropty(axios)
+
       const token = localStorage.getItem('token')
       if (token) axios.defaults.headers.common['token'] = token
 
@@ -139,15 +97,19 @@ export class AxiosWrapper {
       if (errcode) {
         console.warn(`[${uri}] fail: ${errcode}-${errmsg} ${details}`)
         if (errcode !== 0) {
-          console.log(router)
-          if (errcode.includes('FRAMEERROR_401')) {
-            // await ElMessageBox.alert(errmsg, i18n.global.t('common.user_confirm'), {
-            //   confirmButtonText: i18n.global.t('common.re_login'),
-            //   type: 'error',
-            //   callback: (act) => {
-            //     // router.replace('/login')
-            //   }
-            // })
+          if (userErrorCodeList.includes(errcode)) {
+            const nowRouteFullPath = router.currentRoute.value.fullPath
+            ElMessageBox.confirm(errmsg, i18n.global.t('common.user_confirm'), {
+              confirmButtonText: i18n.global.t('common.re_login'),
+              cancelButtonText: i18n.global.t('common.reload'),
+              type: 'error'
+            })
+              .then(() => {
+                if (nowRouteFullPath !== '/login') window.location.href = `${import.meta.env.VITE_BASE_URL}/login`
+              })
+              .catch(() => {
+                if (nowRouteFullPath !== '/login') location.reload()
+              })
           }
         }
         return returnRes
@@ -181,4 +143,51 @@ export class AxiosWrapper {
       }
     }
   }
+
+  static toCropty(axios) {
+    // #region 加密部分
+    // 加密,需要根据env文件判断是否启用加密
+    if (JSON.parse(VITE_USE_CRYPTO)) {
+      // 生成随机字符串
+      const reqCode = crypto.getRandomString()
+      axios.interceptors.request.use(async (config) => {
+        // 加密真实使用的加密字符串
+        const deReqCode = crypto.pemEncrypt(reqCode)
+        // 加密数据并替换
+        config.transformRequest = (data) => {
+          if (data) {
+            console.group('请求')
+            console.log(`加密串:${reqCode}`)
+            console.log(`原数据:`)
+            // 加密 加密字符串
+            const strData = JSON.stringify(data)
+            console.log(strData)
+            // 加密数据
+            const enCodeData = crypto.encrypt(reqCode, strData)
+            console.log(`加密后数据:`)
+            console.log(enCodeData)
+            // 替换数据位置
+            return JSON.stringify({ data: enCodeData })
+          }
+          return undefined
+        }
+        // 添加请求头,将 加密的真实使用加密字符串附上
+        config.headers['api-token'] = deReqCode
+        return config
+      })
+      axios.interceptors.response.use(
+        (response) => {
+          if (get(response, 'data.data')) {
+            let data = crypto.decrypt(reqCode, get(response, 'data.data'))
+            const dobj = JSON.parse(data || '{}')
+            const others = pick(get(response, 'data'), ['errcode', 'errmsg'])
+            response.data = { ...others, ...dobj }
+          }
+          return response
+        },
+        (error) => Promise.reject(error)
+      )
+    }
+    // #endregion
+  }
 }

src/views/login/index.vue

@@ -57,9 +57,11 @@ const toLogin = async (data) => {
     localStorage.setItem('token', res.data)
     // 路由
     router.push({ path: '/' })
-  } else {
-    ElMessage({ message: `${res.errmsg}`, type: 'error' })
   }
+  // 如果登录有问题,就会被之前的中断
+  // else {
+  //   ElMessage({ message: `${res.errmsg}`, type: 'error' })
+  // }
   loading.value = false
 }
 /**