添加无感刷新
This commit is contained in:
junleea
parent
17e53f3f47
commit
753179aca3
|
|
@ -6,35 +6,120 @@ const baseURL = "https://pm.ljsea.top/";
|
|||
//const baseURL= "http://localhost:8084";
|
||||
//const baseURL="https://pm.ljsea.top";
|
||||
//const baseURL = "https://gep.ljsea.xyz/";
|
||||
|
||||
let isRefreshing = false;
|
||||
let requests = [];
|
||||
|
||||
const request = axios.create({
|
||||
baseURL: baseURL,
|
||||
});
|
||||
|
||||
request.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
|
||||
}
|
||||
// 请求拦截器 - 添加token
|
||||
request.interceptors.request.use();
|
||||
|
||||
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");
|
||||
}
|
||||
)
|
||||
|
||||
if(result.data.message === "NOT_LOGIN" || [2, 3, 4].includes(result.data.code)) {
|
||||
// 检测到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('该用户已存在，请重新输入！');
|
||||
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;
|
||||
|
|
@ -7,70 +7,120 @@ const baseURL = "https://uc.ljsea.top/";
|
|||
//const baseURL= "http://localhost:8084";
|
||||
//const baseURL="https://pm.ljsea.top";
|
||||
//const baseURL = "https://gep.ljsea.xyz/";
|
||||
|
||||
let isRefreshing = false;
|
||||
let requests = [];
|
||||
|
||||
const request = axios.create({
|
||||
baseURL: baseURL,
|
||||
});
|
||||
|
||||
// 请求拦截器 - 添加token
|
||||
request.interceptors.request.use();
|
||||
|
||||
// 响应拦截器
|
||||
request.interceptors.response.use(
|
||||
result => {
|
||||
const cookie= Cookies.get("user_token");
|
||||
console.log("cookie:", cookie);
|
||||
result => {
|
||||
if(result.status !== 200) {
|
||||
router.push("/login");
|
||||
}
|
||||
|
||||
if(result.data.message === "NOT_LOGIN" || [2, 3, 4].includes(result.data.code)) {
|
||||
// 检测到token过期
|
||||
if (isRefreshing == false) {
|
||||
isRefreshing = true;
|
||||
|
||||
//请求地址
|
||||
if(result.config.url == "/user/refresh_token"){
|
||||
return result;
|
||||
}
|
||||
|
||||
if(result.data.message==="NOT_LOGIN"|| [2, 3, 4].includes(result.data.code) || result.status !== 200 ){
|
||||
//alert("登录失效，请重新登录！")
|
||||
refreshToken();
|
||||
//重新请求
|
||||
//return request(result.config);
|
||||
}
|
||||
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);
|
||||
// 这里需要替换为实际的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));
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
const refreshToken = async () => {
|
||||
//读取cookie的信息
|
||||
const user_token = Cookies.get("user_token");
|
||||
if(user_token == null){
|
||||
router.push("/login");
|
||||
if(result.data.code == 7) {
|
||||
ElMessage.error('该用户已存在，请重新输入！');
|
||||
return null;
|
||||
}
|
||||
let userTokenInfo = JSON.parse(user_token);
|
||||
let req_data = await request.post('/user/refresh_token', {
|
||||
"refresh_token": userTokenInfo.refresh_token
|
||||
}, {
|
||||
headers: {
|
||||
'token': userTokenInfo.token,
|
||||
'Content-Type': 'application/json' // 设置请求头为 JSON 格式
|
||||
}
|
||||
});
|
||||
if(req_data.status == 401 || req_data.status == 403){
|
||||
//alert("登录失效，请重新登录！");
|
||||
ElMessage.error('登录失效，请重新登录！');
|
||||
localStorage.removeItem("token");
|
||||
router.push("/login")
|
||||
}else{
|
||||
let newAccessToken = req_data.data;
|
||||
localStorage.setItem("token", newAccessToken);
|
||||
|
||||
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;
|
||||
Loading…
Reference in New Issue