我通过Axios通过pinia存储发出某些请求。这些请求通过计时器,可以发送多个请求。我的服务器使用需要刷新的令牌。我已经编写了一个拦截器,用于检查访问令牌的过期时间并在其无效之前发送刷新令牌。在我处理刷新令牌时发生的所有请求都存储在一个数组中。现在这可以工作了,但是我没有返回到请求的地方(pinia store),所以数据没有调整。
import axios from 'axios';
import {useAuthStore} from "@/stores/Authentication/AppAuthStore.js";
import VueJwtDecode from 'vue-jwt-decode';
axios.defaults.baseURL = import.meta.env.VITE_API_ENDPOINT;
axios.defaults.maxRedirects = 0;
let refreshing_token = null;
let myTimeout= null;
let busy = false;
let requestArray = [];
const baseURL = import.meta.env.VITE_API_ENDPOINT;
axios.interceptors.request.use( async req =>{
if (req.url.endsWith("refresh")) {
// if we are making a refresh token call, return it to prevent infinite loop
return req;
}
const accesstoken = sessionStorage.getItem("accesstoken")
if (accesstoken){
req.headers.Authorization = `Bearer ${accesstoken}`;
//const {header,payload} = useJwt(accesstoken)
let user = VueJwtDecode.decode(accesstoken);
const isExpired = Date.now() >= ((user.exp * 1000) - 10000)
console.log(isExpired)
if (!isExpired) return req;
requestArray.push(req);
console.log("is expired");
/* refreshing_token = refreshing_token ? refreshing_token : refresh_token();
let res = await refreshing_token;
refreshing_token = null;
clearTimeout(myTimeout);*/
if (!busy){
busy = true;
const refreshtoken = sessionStorage.getItem("refreshtoken")
axios.post(baseURL + 'auth/refresh', {
refresh_token : refreshtoken
}).then((res) => {
console.log(res);
console.log("token refreshed : " + res.data.accesstoken);
const authappstore = useAuthStore()
authappstore.isAppOK = true;
sessionStorage.setItem("accesstoken",res.data.accesstoken);
sessionStorage.setItem("refreshtoken", res.data.refreshtoken);
req.headers.Authorization = `Bearer ${res.data.accesstoken}`;
if (requestArray.length !== 0) {
requestArray.forEach(x => {
try {
console.log(x);
axios(x)
} catch (e) {
console.log(e)
}
});
requestArray = [];
}
}) .catch((err) => {
const errStatus = err.statusCode || 500;
const errMsg = err.message || 'Something went wrong';
console.log(errMsg)
}) .finally(() => {
busy = false;
});
}
}
else {
return req
}
})
export default axios;
字符串
我不知道该怎么做?
1条答案
按热度按时间laximzn51#
我只是提供了一个想法,你需要等待一个新的访问令牌当一个请求的访问令牌过期,并继续该请求(而不是推送到数组中),所以我们需要在请求拦截器中返回一个Promise,让请求处于等待状态,并且我们需要创建一个CustomEvent,当getRefreshToken的请求完成时,CustomEvent被触发,Promise此时会被解析,请求将继续。
字符串