在基于 Web 浏览器的客户端上存储授权（或 JWT）令牌的位置？答案

【问题标题】：Where to store authorization (or JWT) tokens on the web browser based clients?在基于 Web 浏览器的客户端上存储授权（或 JWT）令牌的位置？
【发布时间】：2020-03-13 03:22:59
【问题描述】：

问题仍然存在，我们必须在哪里存储 JWT 令牌，以便来自 Javascript 的 AJAX 请求可以在授权标头中使用它们。我查看了以下资源。有些人建议使用 SessionStorage 或 LocalStorage，有些人说它们不安全，但也不推荐替代方案。此外，一些（链接 3）建议将其存储为 httpOnly cookie，这显然不是单页应用程序的解决方案。因此，如果我们将它们存储为非 httpOnly cookie，它几乎与 localStorage 相同。

How do I store JWT and send them with every request using react
请停止使用本地存储 (https://dev.to/rdegges/please-stop-using-local-storage-1i04)
https://blog.logrocket.com/jwt-authentication-best-practices/

我知道这个问题可能没有特定的解决方案，但是在生产环境中使用的策略来解决这个问题可能会有所帮助。

【问题讨论】：

真的只有这两个选择。 Cookies 意味着不得不担心 CSRF 和其他 cookie 问题，而 LocalStorage 意味着观察 XSS 向量。

标签： reactjs cookies jwt authorization single-page-application

【解决方案1】：

由于安全性是您最关心的问题，因此答案相对简单：您不能将 JWT 作为授权标头提供给服务器端应用程序。这样做需要使用 Javascript 可访问的对象，这意味着 JWT 面临 XSS 攻击的风险。

目前唯一可用的安全方法是通过您的服务器应用程序生成该令牌，然后通过 httpOnly 安全 cookie 将该令牌提供给您的客户端 SPA。可以说，这个 cookie 现在可能容易受到 CSRF 的攻击，但这可能被认为比 XSS 风险更小。

对于每个后续的 AJAX 请求，该 cookie 将由浏览器自动提供。您的服务器应用程序（或应用程序服务器）还必须配置为通过该特定 cookie 接受 JWT。

此技术适用于任何寻求保护对服务器端资源的请求的应用程序（单页应用程序或其他应用程序）。

【讨论】：