javascript - 如何正确处理标头中的 JWT

Question

我正在尝试在我的项目中设置 JWT（NodeJs Express 用于后端，Javascript 用于前端）。

所以在我的后端，当用户登录时，我会像这样发送我的令牌：

[...]
     return res.send({ token, id: userId })
[...]

在我的前端，我在我的标题中设置了 Bearer 令牌，如下所示：

const data = {
        email,
        password
    }

    await instance.post('/signin', data)
        .then((res) => {
                instance.defaults.headers.common['authorization'] = `Bearer ${res.data.token}`
                window.location = './account.html'
        })
        .catch((err) => console.log(err))

我的问题是：

• 我做对了吗？
• 当我被重定向到account.html页面时，如何检索在登录时设置的令牌？

标签： javascriptnode.jsexpressjwt

Answer 1

当您使用来自该页面的任何库（我猜是 Axios）分配给instance.defaults.headers.common['authorization']通过Ajax发出的后续请求时，将包含标题。authorization

分配一个新值window.location将触发导航并丢弃instance对象（使用分配的标题值）。

（根据经验，如果您要window.location在发出 Ajax 请求后为其分配一个新值，那么您应该将 Ajax 请求替换为常规表单提交）。

---

您可以将数据分配到您可以在account.html页面中读取它的位置（例如本地存储）。

account.html但是，对于服务器自身的请求，这将不可用。

您可以将数据分配给 cookie。然后它将可用于 的请求account.html，但在 cookie 中而不是在授权标头中。

---

请注意，在授权标头中使用 JWT 通常是在单页应用程序中完成的，而不是传统的多页网站。