为什么我无法在本地安全存储 auth0 JWT 令牌？

Question

我在 React 应用程序中使用 Auth0。默认情况下，身份验证令牌存储在内存中，并在浏览器重新加载时重新获取。这会导致重新加载页面时出现明显的延迟，特别是当 wifi 不太好时。

我可以使用

cacheLocation='localstorage'

选项将它们存储在本地存储中，当我这样做时，应用程序感觉更快。不幸的是，在本地存储令牌会增加 XSS 攻击的风险，因此不建议在生产中使用。

我不想为了性能而牺牲安全性。但真的不可能以安全的方式在本地持久保存这些令牌吗？那么网络工作者呢？索引数据库？可以使用内存中的密钥对令牌进行加密吗？难道这里就没有更好的解决方案了吗？

Answer 1

据我所知，Web Workers 可以用来执行后台任务，但它们本身不提供安全的存储机制。 IndexedDB 是 localStorage 的更安全的替代方案，因为它允许异步 API。但是，它仍然无法防御 XSS 攻击。 （IndexedDB 在同源策略下运行，这意味着如果攻击者可以通过 XSS 漏洞将脚本注入您的站点，他们也可以访问您的 IndexedDB 存储。）

1. 可以选择在将令牌存储到 localStorage 或 IndexedDB 之前对其进行加密。您可以使用内存中的密钥来加密和解密令牌。
2. 将令牌存储在安全的 HttpOnly cookie 中可能是更好的方法，因为它们无法通过 JavaScript 访问，从而降低 XSS 攻击的风险。您可以将 cookie 配置为只能通过 HTTPS 访问，并将它们设置为 HttpOnly。