在javascript中阻止http调用的最佳方法是什么?

在javascript中阻止http调用的最佳方法是什么?,javascript,http,jwt,fetch,jwt-auth,Javascript,Http,Jwt,Fetch,Jwt Auth,我正在使用JWT进行身份验证。一旦令牌过期,我就使用fetch(而不是像其他调用那样使用Axios)来获取新的访问令牌。这将导致对新访问令牌的多次调用。有没有办法只允许一个http请求使用过期的令牌并阻止其他请求,然后在新的访问令牌到达后重试 基本上 当前情景: 使用过期的访问令牌调用1->新建访问令牌A1 使用过期的访问令牌调用2->新建访问令牌A2 使用过期的访问令牌调用3->新建访问令牌A3 3个新的访问令牌到达 我想要的是: 使用过期的访问令牌调用1->新建访问令牌A1 使用过期访问令牌

我正在使用JWT进行身份验证。一旦令牌过期,我就使用fetch(而不是像其他调用那样使用Axios)来获取新的访问令牌。这将导致对新访问令牌的多次调用。有没有办法只允许一个http请求使用过期的令牌并阻止其他请求,然后在新的访问令牌到达后重试

基本上

当前情景:

使用过期的访问令牌调用1->新建访问令牌A1

使用过期的访问令牌调用2->新建访问令牌A2

使用过期的访问令牌调用3->新建访问令牌A3

3个新的访问令牌到达

我想要的是:

使用过期的访问令牌调用1->新建访问令牌A1

使用过期访问令牌调用2->阻塞--(新访问令牌到达)->使用新访问令牌重试

使用过期访问令牌调用3->被阻止--(新访问令牌到达)->使用新访问令牌重试

代码如下:

instance.interceptors.response.use(response => {
    // console.log(response);
    // Edit response config
    return response;
}, error => {
    // console.log(error);
    // return Promise.reject(error);

    const refreshToken = localStorage.getItem('refreshToken');

    if(refreshToken !== null && refreshToken !== undefined){
        const refreshTokenCheck = jwt_decode(refreshToken);
    }

    if(refreshToken && refreshToken !== null && refreshToken !== undefined && !refreshToken.message){
        return new Promise((resolve) => {
        const originalRequest = error.config;

        if(error.response && error.response.status === 401 && refreshToken !== null){
            // originalRequest._retry = true;

            const response = fetch(REACT_APP_AXIOS_BASEURL.concat('/').concat(REACT_APP_AXIOS_API_V1).concat('token/refresh/'), {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    refresh: refreshToken
                }),
            })
            .then((res) => res.json())
            .then((res) => {
                console.log(res)
                localStorage.removeItem('accessToken');
                localStorage.removeItem('accessTokenDecoded');
                localStorage.setItem('accessToken', res.access);
                localStorage.setItem('accessTokenDecoded', JSON.stringify(jwt_decode(res.access)));
            })
            .then((res) => {
                const token = localStorage.getItem('accessToken');
                originalRequest.headers['Authorization'] = `Bearer ${token}`;
                // console.log(originalRequest)
                return axios(originalRequest);
            })
            resolve(response)
        }
        return Promise.reject(error)
    })
    }
        return Promise.reject(error); 
});
任何帮助都将不胜感激。另外,如果在vanilla js中有一种方法可以做到这一点,那将比使用库更好

蒂亚