reactjs - React 中的安全 JWT token 处理

Question

一个小时以来，我一直在寻找一个令人满意的答案，但我仍然无法找到问题的答案:如何使用 React 在客户端安全地存储 JWT token ？
从我读到的内容来看，localStorage 解决方案并不受欢迎，因为它可以从第三方脚本访问。一个更安全的解决方案是使用 HttpOnly cookie，但问题是，它无法通过 js 访问，因此它在 React 中没有用。
因此，如何在客户端安全地存储 JWT token ？

Answer 1

简而言之 - 您无法在浏览器中安全地存储 token 。如果您的代码可以访问 token ，那么任何攻击者也可以访问它。也就是说，您可以减轻一些风险，并决定一个可能“足够安全”满足您需求的解决方案。
例如。如果丢失这样的 token 不会带来很大的风险，那么将 token 保存在本地存储中可能就足够了 - 也许您的网站处理的数据不敏感。
一个可行的选择是将 token 保留在内存中。这样窃取它就有点复杂了。那么当然您每次刷新页面时都需要获取一个新 token ，但您可能会使用 SSO cookie 在后台自动获取新 token 。
如果您想采用当前 SPA 的安全最佳实践，您应该调查 the Backend-For-Frontend图案。您添加一个轻量级后端组件，用于处理 token 和 OAuth 流，并使用基于 cookie 的常规 session 与您的 React 应用程序进行通信。在 Curity，我们创建了此类组件的示例实现，您可以将其用作灵感:https://github.com/curityio/bff-node-express
你可以看看这个很棒的视频:https://www.youtube.com/watch?v=lEnbi4KClVw Philippe de Ryck 详细说明了为什么不可能在 SPA 中安全地存储 token 。