关于 axios 刷新后第一次传后台没有 token

发布于 2022-09-12 03:02:38 字数 852 浏览 24 评论 0

全局配置的 axios,请求拦截处获取 token 并传到后台。刷新页面后第一次请求可以获取到 token,但是没传。不知道为什么,第二次请求就可以了。复现只出现在刷新后请求第一次不传 token。代码如下:

// http请求拦截器
axios.interceptors.request.use(config => {
    let token = window.localStorage.getItem('token');
    !!token ? axios.defaults.headers.common['token'] = token : '';
    alert(axios.defaults.headers.common['token'])
    removePending(config); //在一个axios发送前执行一下取消操作
    config.cancelToken = new cancelToken((c)=>{
        // 这里的axios标识我是用请求地址&请求方式拼接的字符串
        pending.push({ u: config.url + JSON.stringify(config.data) +'&' + config.method, f: c });  
    });
    return Promise.resolve(config)
}, error => {
    return Promise.reject(error)
})

刷新页面,点击按钮执行 axios 请求时候 可以弹出 token(弹窗:上面第五行),但是查看 network中 token 没有传过去
image.png

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

心房敞 2022-09-19 03:02:38

如果我理解的没错的化,你只是要每个 axios 请求都携带 token,没太理解你的代码为什么写的这么复杂,给你一段我写过的代码:

axios.interceptors.request.use(
    config => {
        let token = localStorage.getItem('token')
        if (token && token != '') {
            config.headers.token = token;
        }
        return config;
    },
    error => {
        return Promise.reject(error);
    });

这句

axios.defaults.headers.common['token'] = token

通常是在拦截器外面用的,既然都在拦截器里面了,直接修改 config 就好了。

而且直接返回 config 就好了,起码官方的代码是这么写的。

绝影如岚 2022-09-19 03:02:38

你应该想清楚该怎么做,而不是随便想个做法,然后一定要把它实现。

对于你这样的需求,最合适的做法是程序初始化时,从 localStorage 里取出 token,然后用 axios.defaults.headers.common['token'] = token 把值赋进去。类似的地方还有登录成功。

〆凄凉。 2022-09-19 03:02:38

你应该直接return config,而不是return Promise

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文