根据初始浏览器请求向服务器发送 JWT 令牌(使用本地存储)

Posted

技术标签:

【中文标题】根据初始浏览器请求向服务器发送 JWT 令牌(使用本地存储)【英文标题】:Send JWT token to server upon initial browser request (using local storage) 【发布时间】:2019-04-07 12:13:34 【问题描述】:

好吧,假设我有一个登录页面,当用户登录时,他或她从服务器获取 JWT 令牌,然后将其保存在本地存储中(我知道 cookie 更好,但我想使用本地存储)。之后,假设我退出了浏览器(令牌仍在本地存储中,在本例中没有过期日期)。现在我想要的是以下内容:退出浏览器后(但我成功登录并在本地存储中有令牌)我如何做到这一点,以便在对同一服务器的初始请求时我不会再次启动登录页面但用户是否已经登录? Taje 进入一个我能够在第一次请求后对用户进行身份验证的帐户,并且我知道如何在初始请求中发送令牌?

【问题讨论】:

由于 JWT 是无状态的,因此您应该在每次请求时都将令牌发送到服务器。为什么第一个会有所不同? 我该如何发送呢?我的意思是我已经退出浏览器并且我的令牌位于本地存储中我将如何制作它以便在初始请求时(我在全新的选项卡中键入 URL)我从本地存储中获取令牌发送到服务器? @MTCoster 传统上,会话令牌(任何类型,不仅仅是 JWT)存储为 cookie。浏览器在每个 HTTP 请求的标头中发送 Cookie。将令牌存储为 cookie 还允许您将 HttpOnly 标志设置为 an effective defence against XSS。当您将令牌存储在 LocalStorage 中时,大概您有一些 JS 机制可以将其发送到服务器。如果令牌存在,为什么不直接发出第一个请求,如果收到Unauthorized 响应,则显示登录页面? "我知道 cookie 更好,但我想用本地存储来做" 为什么?你这样做有什么好处? 好吧,现在我想了想,不确定使用本地存储是否有好处,所以我会尝试使用 cookie 来做,看看效果如何。 【参考方案1】:

您的要求可能没有直接的解决方案。 但是,可以通过在 Head 标签中添加脚本来添加一个 hack。 并使用此脚本检查 localStorage.getItem('key') 是否存在。

如果存在值,则将请求与令牌一起直接发送到主页,否则发送登录页面。

但是,这个脚本下载是额外的服务器往返。

【讨论】:

这是真的,确实想到了这一点,尝试过,但不喜欢与我的应用程序的其余部分一起工作的方式。

以上是关于根据初始浏览器请求向服务器发送 JWT 令牌(使用本地存储)的主要内容,如果未能解决你的问题,请参考以下文章

使用浏览器获取请求发送 JWT 令牌

如何向每个标头添加 json Web 令牌?

每个请求的 JWT 令牌验证?

Angular 10 应用程序不会在跨域请求中发送 JWT 刷新令牌

找不到 Slim jwt 令牌(由 axios 请求发送)

在请求的标头中发送令牌是不是安全?