添加无感刷新

This commit is contained in:
junleea 2025-06-02 19:02:46 +08:00
parent cf042ea5d1
commit 400a40cb9c
3 changed files with 168 additions and 57 deletions

View File

@ -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(
result => {
if(result.status!==200 ){
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);
// 响应拦截器
request.interceptors.response.use(
result => {
if(result.status !== 200) {
router.push("/login");
}
)
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;

View File

@ -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('登录失效,请重新登录!');
localStorage.removeItem("token");
router.push("/login");
return null;
// 检测到token过期
if (isRefreshing == false) {
isRefreshing = true;
// 这里需要替换为实际的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('该用户已存在,请重新输入!');

View File

@ -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', {
token: localStorage.getItem("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"]["token"];
const refreshToken = res.data["data"]["refresh_token"];
const token = res.data["data"]["access_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('登录已过期,请重新登录!');
localStorage.removeItem("token");
localStorage.removeItem("refresh_token");
ElMessage.error('登录已过期请重新登录12');
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);