Vue.js 和 Axios - 在 401 上重定向

Question

我正在运行 Vue.js 和 axios 并试图创建一个通用 API 对象，如下所示：

 import router from './router'
import auth from './auth'
const axios = require('axios')

export const API = axios.create({
  baseURL: `https://my-api.com/`,
  headers: {
    Authorization: auth.getToken()
  }
})

API.interceptors.response.use(null, function (error) {
  if (error.response.status === 401) {
    console.log('Failed to login')
    router.push('/Login')
  }
  return Promise.reject(error)
})

每当收到 401 错误代码时，我试图将用户重定向到我的单页应用程序中的 Login 屏幕。但是我没有被重定向，我在 Chrome 中的开发者工具中也没有出现错误。我确实得到了 console.log 和 Failed to login 。

原文由 Alfred Balle 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我发现了类似的情况。我已经修复了这段代码：

 import router from 'router'
import store from 'store'
...
...
axios.interceptors.response.use(function (response) {
  return response
}, function (error) {
  console.log(error.response.data)
  if (error.response.status === 401) {
    store.dispatch('logout')
    router.push('/login')
  }
  return Promise.reject(error)
})

原文由 Rubén Pozo 发布，翻译遵循 CC BY-SA 4.0 许可协议