Как я могу перенаправить в Axios Interceptor?

Question

я написал axios interceptor для токена обновления в vue js (main.js) и хочу, чтобы при получении кода ошибки 401 в моем проекте он попытался получить новый токен с моим refresh_token и снова отправить запрос с новымтокен, если токен обновления тоже недействителен, я хочу перенаправить на страницу входа и разорвать запросы axios, но моя проблема в том, что когда токен обновления недействителен, я застряну в цикле вызова API обновления токена, и я получу множественную ошибку (duplicate navigation)В консоли другая проблема заключается в том, что я не могу перехватить ошибку в catch block, и всегда она переходит к then block, а ответ undefined

axios.interceptors.response.use((response) => {
        return response
    },
    function (error) {
        const originalRequest = error.config;
        if (error.response.status === 401) {
            axios.post(process.env.VUE_APP_BASE_URL + process.env.VUE_APP_REFRESH_TOKEN,
                {
                    "refresh_token": localStorage.getItem("refresh_token")
                })
                .then(res => {
                        localStorage.setItem("token", "Bearer " + res.data.result.access_token);
                        originalRequest.headers['Authorization'] = localStorage.getItem("token");
                        return axios(originalRequest);
                }).catch(error=>{
                    console.log(error);
                    router.push({'name':'login'})
            })
        }
    });

Answer 1

Вы можете попробовать добавить флаг. Например,

let isAlready401=false
axios.interceptors.response.use((response) => {
        return response
    },
    function (error) {
        const originalRequest = error.config;
        if (!isAlready401&&error.response.status === 401) {
            isAlready401 = true
            axios.post(process.env.VUE_APP_BASE_URL + process.env.VUE_APP_REFRESH_TOKEN,
                {
                    "refresh_token": localStorage.getItem("refresh_token")
                })
                .then(res => {
                        localStorage.setItem("token", "Bearer " + res.data.result.access_token);
                        originalRequest.headers['Authorization'] = localStorage.getItem("token");
                        return axios(originalRequest);
                }).catch(error=>{
                    console.log(error);
                    router.push({'name':'login'})
                    isAlready401 = false
            })
        }
    });