javascript - 在基于 Web 的应用程序中，在何处正确且安全地存储 JWT token ？

Question

我熟悉 Web 存储 API 和 cookie，但我不知道什么是存储身份验证 token 的最安全方法。我想知道这是否会破坏任何第三方库。

我想要一份详尽的可用方法列表，列出每种方法的优缺点，以及最好的方法(如果有的话)。

Answer 1

在哪里存储你的 JWT

使用基于 token 的身份验证，您可以选择存储 JWT 的位置。我们强烈建议您将 token 存储在本地存储/ session 存储或 cookie 中。

Web Storage(本地存储/ session 存储)

通常，JWT 放置在浏览器的本地存储中，这适用于大多数用例。

当使用用户名和密码登录用户时，响应正文包含access_token JWT。然后您需要在客户端代码中处理此响应。然后可以将该 token 存储在 localStorage 或 sessionStorage 中。

Click here for an example using sessionStorage

localStorage 和sessionStorage 都扩展了Storage。它们之间的唯一区别是数据的持久性:

localStorage - 数据一直存在，直到被明确删除。所做的更改将被保存并可供所有当前和将来访问该网站时使用。

sessionStorage - 所做的更改被保存并可用于当前页面，以及在同一窗口中对站点的 future 访问。窗口关闭后，存储将被删除。

网络存储的缺点

• 与 cookie 不同，本地存储被沙盒化到特定域，并且其数据不能被任何其他域(包括子域)访问。
• 网络存储可通过同一域中的 JavaScript 访问，因此您网站上运行的任何 JavaScript 都可以访问网络存储，因此容易受到跨站点脚本 (XSS) 攻击。
• 开发人员必须确保 JWT 始终通过 HTTPS 而不是 HTTP 发送。

使用 Cookie

您还可以使用 cookie 来存储 JWT。设置 cookie 的确切方法取决于您使用的客户端语言。

有不同的选项来控制 cookie 的生命周期:

• Cookie 可以在浏览器关闭后销毁( session cookie)。
• 实现服务器端检查(通常由正在使用的网络框架为您完成)，您可以实现过期或滑动窗口过期。
• Cookie 可以是永久性的(在浏览器关闭后不会被销毁)，但会过期。
• 如果设置了 httpOnly 标志，则 JavaScript 和服务器端代码都可以读取 Cookie，或者只能由服务器端读取。

Cookie 的缺点

• cookie 的最大大小仅为 4kb，因此如果您对 token 附加了很多声明，则可能会出现问题。
• Cookie 可能容易受到跨站点请求伪造(CSRF 或 XSRF)攻击。当恶意网站导致用户的 Web 浏览器在用户当前已通过身份验证的受信任站点上执行不需要的操作时，就会发生此类攻击。这是对浏览器如何处理 cookie 的利用。使用 Web 应用程序框架的 CSRF 保护使 cookie 成为存储 JWT 的安全选项。还可以通过检查 HTTP Referer 和 Origin header 来部分阻止 CSRF。
• 如果应用程序需要跨域访问，则可能难以实现。 Cookie 具有额外的属性(域/路径)，可以修改这些属性以允许您指定允许将 Cookie 发送到哪里。

原文:https://auth0.com/docs/security/store-tokens#how-to-implement