使用 axios 拦截器刷新 vue.js jwt 令牌答案

【问题标题】：vue.js jwt token refresh with axios interceptors使用 axios 拦截器刷新 vue.js jwt 令牌
【发布时间】：2022-11-03 20:14:21
【问题描述】：

我试图在 vue.js 中刷新用户 jwt 令牌。所以我的解决方案是当用户发送带有过期令牌的请求被状态代码 401 拒绝时，然后在 axios 拦截器中我尝试通过发送令牌刷新请求来刷新令牌我的后端。问题是当令牌刷新发生时它没有重复原始请求

axios.interceptors.response.use(function (response) {
  return response
  }, async function (error) {
    if(error.response.status===401){    
    let newtokens= await axios.post('RefreshToken',{
        oldtoken:store.state.user.token,
        refreshtoken:store.state.user.refreshtoken
    })
    let user=store.state.user
    console.log(user)
    user.token=newtokens.data.token
    user.refreshtoken=newtokens.data.refreshtoken
    axios.defaults.headers.common['Authorization']='Bearer '+ user.token
    console.log(newtokens)
    store.dispatch("user",user)
    console.log(store.state.user)  
    return axios(error.config)
}
  return Promise.reject(error)
})

我尝试控制台记录 axios 拦截器中发生的情况，看起来它已成功将请求发送到后端并刷新用户令牌。唯一的问题是它没有重复原始请求

【问题讨论】：

标签： vue.js

【解决方案1】：

如果你的 axios 版本介于(1.1.0) 至 (1.1.3)然后发生了这样的问题，但在降级到版本（0.27.2）时效果很好。 Github问题：https://github.com/axios/axios/issues/5143

而且似乎仍然没有解决更高版本的问题

【讨论】：