vue登录界面跳转到首页但接口未及时加载又被拦截器重新定向到登录界面如何解决？

Question

在vue项目登录跳转到首页的时候，又被重新定向到登录界面，看了下报错是

分析了下原因可能是拦截器对401状态造成的，我把拦截器去掉以后跳转到首页多刷新几次数据就出来了，token是正常存入的，登录跳转代码如下

 .then(response => {
      localStorage.setItem("token", response.data.result.authToken);
      this.$router.push(this.$route.query.redirect || "/");
     })

拦截器

axios.defaults.headers.common['Authorization'] = localStorage.getItem("token")

axios.interceptors.response.use(
    response => {
        return response
    },
    error => {
        if (error.response) {
            switch (error.response.status) {
                case 401:
                    router.replace({
                        path: '/login',
            })
          }
       }
        return Promise.reject(error.response.data)
    })

我应该如何处理，感谢您的解答

Answer 1

请求前的拦截器逻辑是什么样的，可以获取token的吧？有没有通过token来判断是否要登录？
另外确定一下后端的token是字符串的吧，localStorage保存的数据都是字符串的。

Answer 2

泻药～
楼主，你好。思路换下。登录接口是不需要在 headers 添加 token 验证的。所以会出现 401 的问题。解决方案也简单，添加头部验证的时候，判断下当前的请求是不是登录接口即可。
希望对你有所帮助～