JSON Web Tokens (JWT) 是一种用于在各方之间安全传输信息的紧凑、URL 安全的方式。它常用于认证流程中，以减少每次请求时需要重新验证完整会话信息的情况。然而，正确地存储 JWT 是至关重要的，因为如果存储不当，它们可能会被恶意第三方获取并滥用。

以下是关于如何安全地在 Cookie 和 Web Storage 中存储 JWT 的一些建议：

推荐方案

首选存储在 Local Storage 中。

在安全方面最大的收益便是天然的CSRF免疫，因为不会被浏览器自动发送。 如果你使用了这种方法，后端并不需要花费时间精力来做CSRF相关的防护。

JS可以直接读取JWT，方便使用。

我们的网站只要没有XSS漏洞，安全性就会有保障。如果存在 XSS漏洞，无论 JWT 存在 cookie 还是存在 Local Storage，CSRF 防护都会形同虚设。

在 Cookie 中存储 JWT

1. HttpOnly 标志：设置 HttpOnly 标志可以防止客户端脚本访问 cookie，从而降低跨站脚本（XSS）攻击的风险。这意味着 JavaScript 不能读取此 cookie 的值。

2. Secure 标志：确保为 cookie 设置 Secure 标志。这样可以确保 cookie 只通过 HTTPS 协议发送，从而避免中间人（MITM）攻击。

3. SameSite 属性：使用 SameSite 属性来限制 cookie 在第三方上下文中的使用。这有助于防止跨站请求伪造（CSRF）攻击。可以选择 Strict 或 Lax 模式。

在 Web Storage 中存储 JWT

1. LocalStorage vs. SessionStorage：如果你选择在客户端存储 JWT，考虑使用 SessionStorage 而不是 LocalStorage。SessionStorage 数据仅在页面会话期间可用，并且当页面关闭时会被删除。

2. CORS 设置：确保你的服务器正确配置了 CORS（跨源资源共享），以防止未经授权的数据访问。

3. JavaScript 安全性：虽然 HttpOnly 标志无法应用于 Web Storage，但可以通过 JavaScript 代码来保护存储的数据。例如，在存取 JWT 时添加额外的安全检查或使用加密技术。

4. 前端框架/库保护：如果你使用的是现代前端框架或库（如 React, Angular, Vue.js 等），可以利用它们提供的安全特性来保护存储的数据。

5. 最小权限原则：只在必要的时候从 Web Storage 中读取 JWT，并确保这些操作是在安全的上下文中进行的。

总的来说，虽然可以在 Web Storage 中存储 JWT，但考虑到 JavaScript 的暴露风险，通常推荐的做法是将 JWT 存储在带有适当安全属性设置的 cookie 中。无论哪种方法，都应该结合其他安全措施（如 CSRF 令牌、HTTPS、CSP 等）来保护应用程序免受攻击。

修改时间 2024-10-10