javascript - 获取身份验证信息后如何在 vue3 中重新初始化 main.js？

Question

我目前正在使用 javascript 构建 vue3 项目，但面临一些错误。

我想做什么？

• 登录成功 => 存储令牌

我期望看到什么？

• 登录成功 => 存储令牌 => 然后使用最新的令牌调用 API。

我实际看到了什么？

• 登录成功 => 令牌存储 => 调用 API 仍然使用旧令牌/null
• 仅再次刷新，将使用最新的令牌

我认为这种方式会发生什么？

• 登录成功后，main.js没有重新初始化，所以token还是用旧的。
• 需要刷新，然后main.js会再次获取到最新的token。

这是我控制 axios 的代码

//main.js

function getToken() {
    return localStorage.getItem('token');
}

const httpClient = axios.create({
    baseURL: "http://localhost/",
    headers: {
        Authorization: `Bearer ${getToken()}`
    }
});

axiosInterceptors.decorate(httpClient);

请帮忙指出我做错了哪一部分，谢谢。

标签： javascriptaxiosvuejs3