fix(axions请求实例): 修复了token过期，重新获取token后，未使用新token的BUG

src/utils/axios/axiosInstance.ts

@@ -37,58 +37,56 @@ const axiosInstance = axios.create({
 let isRefreshing = false // 是否正在刷新token
 let requestQueue: any[] = [] // 存储请求队列
 
-// /**
-//  * @description: 登出
-//  * @param msg 提示信息
-//  */
-// const clearClientInfo = (msg: string = '请先登录') => {
-//   ElMessage({
-//     type: MessageType.Warning,
-//     message: msg,
-//     duration: 1500
-//   })
-//   clearClientInfo()
-//   void router.push('/login')
-// }
+// 请求拦截器
+axiosInstance.interceptors.request.use(
+  (config) => {
+    // 要重新获取新的token
+    const token = getToken()
+    if (token) {
+      config.headers.Authorization = token
+    }
+    return config
+  },
+  (error) => Promise.reject(error)
+)
 
-// 添加响应拦截器
+// 响应拦截器
 axiosInstance.interceptors.response.use(
-  async function (response) {
+  async (response) => {
     const { code } = response.data
 
-    // -2是token为空的情况
     if (code === -2) {
       clearClientInfo()
-      void router.push('/login')
+      await router.push('/login')
     }
-    // -1是token过期的情况
+
+    // TOKEN 过期，重刷
     if (code === -1) {
-      const config = response.config // 保存一下这一次的请求，等token刷新成功之后重新请求
+      const config = response.config
 
       if (!isRefreshing) {
         isRefreshing = true
-        return await refreshToken()
-          .then((res) => {
-            if (res.data.code === 0) {
-              const token = JSON.parse(JSON.stringify(res.data.data.token))
-              setToken(token)
-              config.headers.Authorization = token // 将本次请求的token替换成新的token
-              requestQueue.forEach((cb) => cb(token)) // 将队列中的请求重新发起
-              requestQueue = []
-              return axiosInstance(config)
-            } else {
-              clearClientInfo('登录已过期，请重新登陆')
-            }
-          })
-          .catch((err) => {
-            console.log(err)
-            clearClientInfo('登录已过期，请重新登陆')
-          })
-          .finally(() => {
-            isRefreshing = false
-          })
+        try {
+          const res = await refreshToken()
+          if (res.data.code === 0) {
+            const token = res.data.data.token
+            setToken(token)
+            axiosInstance.defaults.headers.common['Authorization'] = token
+            config.headers.Authorization = token
+            requestQueue.forEach((cb) => cb(token))
+            requestQueue = []
+            return axiosInstance(config)
+          } else {
+            clearClientInfo('登录已过期，请重新登录')
+            await router.push('/login')
+          }
+        } catch (err) {
+          clearClientInfo('登录已过期，请重新登录')
+          await router.push('/login')
+        } finally {
+          isRefreshing = false
+        }
       } else {
-        // 如果正在刷新token，将本次请求加入队列，等token刷新成功之后重新发起请求
         return new Promise((resolve) => {
           requestQueue.push((token: string) => {
             config.headers.Authorization = token
@@ -97,24 +95,20 @@ axiosInstance.interceptors.response.use(
         })
       }
     }
+
     return response.data
   },
-  function (error) {
-    if (error) {
-      // 这里try，因为后端不一定返回什么格式的数据
-      try {
-        const code = error.response.data.code
-        const msg = errorCodeMsg[code] ?? '服务器错误，请稍后再试'
-
-        // 对响应错误做点什么
-        ElMessage({
-          type: MessageType.Error,
-          message: msg,
-          duration: 1500
-        })
-      } catch (err) {
-        console.error(err)
-      }
+  (error) => {
+    if (error.response) {
+      const code = error.response.data?.code
+      const msg = errorCodeMsg[code] ?? '服务器错误，请稍后再试'
+      ElMessage({ type: MessageType.Error, message: msg, duration: 1500 })
+    } else {
+      ElMessage({
+        type: MessageType.Error,
+        message: '网络异常，请检查网络连接',
+        duration: 1500
+      })
     }
     return Promise.reject(error)
   }