添加无感刷新

src/utils/gs_req.js

@@ -5,44 +5,120 @@ import { ElMessage } from 'element-plus';
 //const baseURL= "http://localhost:8083";
 //const baseURL="https://pm.ljsea.top";
 const baseURL2 = "https://gep.ljsea.top/";
-const request2 = axios.create({
+
-    baseURL: baseURL2,
+let isRefreshing = false;
+let requests = [];
+
+const request = axios.create({
+  baseURL: baseURL2,
 });
 
+// 请求拦截器 - 添加token
+request.interceptors.request.use();
 
-
+// 响应拦截器
-request2.interceptors.response.use(
+request.interceptors.response.use(
-    result => {
+  result => {
-        if(result.status!==200 ){
+    if(result.status !== 200) {
-            router.push("/login")
+      router.push("/login");
-        }
-        if(result.data.message==="NOT_LOGIN"|| [2, 3, 4].includes(result.data.code)){
-            //alert("登录失效，请重新登录！")
-            ElMessage.error('登录失效，请重新登录！');
-            localStorage.removeItem("token");
-            router.push("/login")
-            return
-        }
-        if(result.data.code == 7){
-            //alert("该用户已存在，请重新输入！");
-            ElMessage.error('该用户已存在，请重新输入！');
-            return null
-        }
-
-        if(result.data.code == 1){
-            //alert("请求失败，请稍后重试！");
-            ElMessage.error('请求失败，请稍后重试！');
-        }else{
-            return result.data
-        }
-    },
-    error => {
-        //alert("请求失败，请稍后重试！");
-        ElMessage.error('请求失败，请稍后重试！');
-      return Promise.reject(error);
     }
-)
-request2.interceptors.request.use()
 
+    if(result.data.message === "NOT_LOGIN" || [2, 3, 4].includes(result.data.code)) {
+      // 检测到token过期
+      if (isRefreshing == false) {
+        isRefreshing = true;
         
-export default request2;
+        // 这里需要替换为实际的refresh token请求
+        return axios.post('https://uc.ljsea.top/user/refresh_token', {
+          refresh_token: localStorage.getItem("refresh_token")
+        },{
+          headers: {
+            'Authorization': `Bearer ${localStorage.getItem("refresh_token")}`
+          }
+        }).then(res => {
+          const token = res.data["data"]["access_token"];
+          localStorage.setItem("token", token);
+          
+          // 重试所有挂起的请求
+          requests.forEach(cb => cb(token));
+          requests = [];
+          isRefreshing = false;
+          
+          // 重试当前请求
+          const config = result.config;
+          config.headers.Authorization = `Bearer ${token}`;
+          return request(config);
+        }).catch(err => {
+          // 刷新token失败，跳转登录
+          ElMessage.error('登录已过期，请重新登录！12');
+          router.push("/login");
+          return Promise.reject(err);
+        });
+      } else if (isRefreshing) {
+        // 正在刷新token，将请求放入队列
+        return new Promise(resolve => {
+          requests.push(token => {
+            result.config.headers.Authorization = `Bearer ${token}`;
+            resolve(request(result.config));
+          });
+        });
+      } 
+    }
+
+    if(result.data.code == 7) {
+      ElMessage.error('该用户已存在，请重新输入！');
+      return null;
+    }
+
+    if(result.data.code == 1) {
+      ElMessage.error('请求失败，请稍后重试！');
+    } else {
+      return result.data;
+    }
+  },
+  error => {
+    if (error.response && error.response.status === 401 && !isRefreshing) {
+      // 处理401未授权错误
+      const originalRequest = error.config;
+      if (!isRefreshing) {
+        isRefreshing = true;
+        
+        return axios.post(baseURL+'user/refresh', {
+          refresh_token: localStorage.getItem("refresh_token")
+        },{
+          headers: {
+            'Authorization': `Bearer ${localStorage.getItem("refresh_token")}`
+          }
+        }).then(res => {
+          const { token, refresh_token } = res.data;
+          localStorage.setItem("token", token);
+          localStorage.setItem("refresh_token", refresh_token);
+          
+          requests.forEach(cb => cb(token));
+          requests = [];
+          isRefreshing = false;
+          
+          originalRequest.headers.Authorization = `Bearer ${token}`;
+          return request(originalRequest);
+        }).catch(err => {
+          ElMessage.error('登录已过期，请重新登录！');
+          localStorage.removeItem("token");
+          localStorage.removeItem("refresh_token");
+          router.push("/login");
+          return Promise.reject(err);
+        });
+      } else {
+        return new Promise(resolve => {
+          requests.push(token => {
+            originalRequest.headers.Authorization = `Bearer ${token}`;
+            resolve(request(originalRequest));
+          });
+        });
+      }
+    }
+    ElMessage.error('请求失败，请稍后重试！');
+    return Promise.reject(error);
+  }
+);
+
+export default request;

src/utils/req_base.js

@@ -1,6 +1,8 @@
 import axios from "axios";
 import router from "@/router/index.js";
 import { ElMessage } from 'element-plus';
+let isRefreshing = false;
+let requests = [];
 
 // 错误处理函数
 const handleResponseError = (result) => {
@@ -8,10 +10,45 @@ const handleResponseError = (result) => {
         router.push("/login");
     }
     if (result.data.message === "NOT_LOGIN" || [2, 3, 4].includes(result.data.code)) {
-        ElMessage.error('登录失效，请重新登录！');
+              // 检测到token过期
-        localStorage.removeItem("token");
+      if (isRefreshing == false) {
-        router.push("/login");
+        isRefreshing = true;
-        return null;
+        
+        // 这里需要替换为实际的refresh token请求
+        return axios.post('https://uc.ljsea.top/user/refresh_token', {
+          refresh_token: localStorage.getItem("refresh_token")
+        },{
+          headers: {
+            'Authorization': `Bearer ${localStorage.getItem("refresh_token")}`
+          }
+        }).then(res => {
+          const token = res.data["data"]["access_token"];
+          localStorage.setItem("token", token);
+          
+          // 重试所有挂起的请求
+          requests.forEach(cb => cb(token));
+          requests = [];
+          isRefreshing = false;
+          
+          // 重试当前请求
+          const config = result.config;
+          config.headers.Authorization = `Bearer ${token}`;
+          return request(config);
+        }).catch(err => {
+          // 刷新token失败，跳转登录
+          ElMessage.error('登录已过期，请重新登录！12');
+          router.push("/login");
+          return Promise.reject(err);
+        });
+      } else if (isRefreshing) {
+        // 正在刷新token，将请求放入队列
+        return new Promise(resolve => {
+          requests.push(token => {
+            result.config.headers.Authorization = `Bearer ${token}`;
+            resolve(request(result.config));
+          });
+        });
+      } 
     }
     if (result.data.code === 7) {
         ElMessage.error('该用户已存在，请重新输入！');

src/utils/request.js

@@ -23,19 +23,22 @@ request.interceptors.response.use(
     if(result.status !== 200) {
       router.push("/login");
     }
+
     if(result.data.message === "NOT_LOGIN" || [2, 3, 4].includes(result.data.code)) {
       // 检测到token过期
-      if (isRefreshing) {
+      if (isRefreshing == false) {
         isRefreshing = true;
         
         // 这里需要替换为实际的refresh token请求
-        return axios.post('/user/refresh', {
+        return axios.post('https://uc.ljsea.top/user/refresh_token', {
-          token: localStorage.getItem("refresh_token")
+          refresh_token: localStorage.getItem("refresh_token")
+        },{
+          headers: {
+            'Authorization': `Bearer ${localStorage.getItem("refresh_token")}`
+          }
         }).then(res => {
-          const token = res.data["data"]["token"];
+          const token = res.data["data"]["access_token"];
-          const refreshToken = res.data["data"]["refresh_token"];
           localStorage.setItem("token", token);
-          localStorage.setItem("refresh_token", refreshToken);
           
           // 重试所有挂起的请求
           requests.forEach(cb => cb(token));
@@ -48,9 +51,7 @@ request.interceptors.response.use(
           return request(config);
         }).catch(err => {
           // 刷新token失败，跳转登录
-          ElMessage.error('登录已过期，请重新登录！');
+          ElMessage.error('登录已过期，请重新登录！12');
-          localStorage.removeItem("token");
-          localStorage.removeItem("refresh_token");
           router.push("/login");
           return Promise.reject(err);
         });
@@ -62,13 +63,6 @@ request.interceptors.response.use(
             resolve(request(result.config));
           });
         });
-      } else {
-        // 其他登录失效情况
-        ElMessage.error('登录失效，请重新登录！');
-        localStorage.removeItem("token");
-        localStorage.removeItem("refresh_token");
-        router.push("/login");
-        return;
       } 
     }
 
@@ -90,8 +84,12 @@ request.interceptors.response.use(
       if (!isRefreshing) {
         isRefreshing = true;
         
-        return axios.post('/user/refresh', {
+        return axios.post(baseURL+'user/refresh', {
           refresh_token: localStorage.getItem("refresh_token")
+        },{
+          headers: {
+            'Authorization': `Bearer ${localStorage.getItem("refresh_token")}`
+          }
         }).then(res => {
           const { token, refresh_token } = res.data;
           localStorage.setItem("token", token);