JWT 访问令牌位于内存中？

Question

我花了很多时间在这上面，这是我第一次使用智威汤逊，真的需要你的一些想法。

现在，我将令牌存储在单独的 httpOnly cookie 中（我的访问令牌在 15 分钟后过期，并在 7 天后刷新令牌）。

我读过，存储令牌的最安全方法实际上是使用 cookie 作为刷新令牌，使用内存中（如变量）作为访问令牌。

虽然我知道这是安全的，但我并不真正了解它在实践中如何运作。这是否意味着我们必须在每个请求上使用刷新令牌创建一个新的访问令牌？或者有没有办法让它有效并复制到新变量直到过期？

顺便说一句，我正在使用 React 和 Node。

Answer 1

我也花了几天时间阅读这个内容。 根据我收集的信息，解决方案如下：

1. 用户使用登录名和密码登录。

2. 服务器生成一个长期存在的刷新令牌，并存储为 HttpOnly Cookie，防止 XSS 攻击，因为它无法通过 Javascript 访问。

   • 理想情况下，可以在服务器端使用某种黑名单来防止重复使用尚未到期但已被替换的刷新令牌。

3. 生成一个访问令牌，可以存储在 localStorage 中或内存中（在变量中）。访问令牌的有效期很短，只有几分钟。

   • 如果存储在 localStorage 中，则令牌不会在重新加载页面/浏览器 (F5) 时消失。它也将在控制台/存储中可见。
   • 当使用 localStorage 检查用户是否通过身份验证时，代码将尝试从 localStorage 读取令牌，对其进行 jwt_decode 并使用令牌中的数据设置用户变量。
   • 由于令牌未加密，仅采用 Base64，因此可以在开发控制台中更改它们的值。仅当权限更改时才会呈现“角色：admin”的页面。 API将负责检查权限，如果token被篡改则拒绝请求。
   • Afaik，如果它存储在变量中，它的可见性会稍差一些，重新加载页面/浏览器时它也会被擦除。
   • 使用变量时，为了避免在每个请求上刷新访问令牌，我们可以使用 Context API，通过使用经过身份验证的用户上下文创建一个组件，该组件将包装应用程序/路由器，然后在需要保护的每个页面上导入并使用此上下文并根据需要进行重定向。

4. 当访问令牌不再有效时，因为它已过期，或者因为它已被擦除，API 调用将被拒绝。拦截此调用，然后调用 API 刷新路由以使用刷新令牌生成新的访问令牌。

   • 我使用带有axios拦截器的axios来拦截失败的请求，调用刷新路由，设置更新的访问令牌，然后重试失败的请求。 （显然需要是 GET 请求以避免 CSRF 错误）。
   • 此外（不是代替），可以使用 setTimeout 每 X 分钟自动刷新访问令牌，以防止其过期。

5. 要注销，请删除 cookie（最终列入黑名单）并擦除上下文/本地存储。

使用 axios，

axios.defaults.withCredentials = true;

确保 cookie 与请求一起发送，并且

{ headers: { 'Authorization': `Bearer ${access_token}` } }

确保访问“承载”令牌与请求一起发送。这些可以设置为每个请求或每个请求的默认值，因此这两种语法。