Cookie 的安全配置（HttpOnly, Secure, SameSite）

Cookie 是 Web 开发中常用的客户端存储机制，但由于其容易被滥用或攻击，合理配置安全属性至关重要。HttpOnly、Secure 和 SameSite 是三种关键的安全配置，能有效减少 XSS、CSRF 等攻击风险。

HttpOnly：防止 XSS 窃取 Cookie

HttpOnly 是 Cookie 的一个属性，用于阻止 JavaScript 通过 document.cookie 访问该 Cookie。当设置为 true 时，Cookie 仅能通过 HTTP 请求发送到服务器，无法被客户端脚本读取。这对于防御跨站脚本攻击（XSS）尤为重要，因为攻击者无法通过注入的恶意脚本窃取用户的敏感 Cookie。

如何设置 HttpOnly

在服务器端设置 HttpOnly 属性非常简单。以下是不同语言中的示例：

Node.js (Express)

res.cookie('sessionId', '12345', {
  httpOnly: true,
  maxAge: 24 * 60 * 60 * 1000 // 1天
});

PHP

setcookie('sessionId', '12345', time() + 86400, '/', '', false, true);
// 最后一个参数 `true` 表示启用 HttpOnly

Django (Python)

response.set_cookie('sessionId', '12345', httponly=True, max_age=86400)

实际效果测试

尝试通过 JavaScript 读取 HttpOnly Cookie：

console.log(document.cookie); // 不会显示标记为 HttpOnly 的 Cookie

Secure：确保 Cookie 仅通过 HTTPS 传输

Secure 属性确保 Cookie 只在加密的 HTTPS 连接中传输，防止中间人攻击（MITM）在明文 HTTP 中截获 Cookie。如果网站启用了 HTTPS，所有敏感 Cookie 都应设置 Secure 属性。

如何设置 Secure

Node.js (Express)

res.cookie('authToken', 'xyz789', {
  secure: true,
  httpOnly: true
});

Nginx 配置

如果使用代理服务器，确保在 HTTPS 环境下转发 Cookie：

proxy_cookie_flags ~ secure samesite=strict;

注意事项

• 本地开发环境（localhost）通常使用 HTTP，此时 Secure Cookie 不会被发送。可通过环境变量动态设置：

  res.cookie('test', 'value', {
    secure: process.env.NODE_ENV === 'production'
  });
  

SameSite：防御 CSRF 攻击

SameSite 属性控制 Cookie 是否随跨站请求发送，是防御 CSRF（跨站请求伪造）的核心手段。它有三个可选值：

1. Strict：Cookie 仅限同站请求（严格模式）。
2. Lax：允许部分安全跨站请求（如导航链接）。
3. None：允许所有跨站请求（需配合 Secure）。

配置示例

Express 中设置 SameSite

res.cookie('csrfToken', 'abc123', {
  sameSite: 'strict', // 或 'lax'/'none'
  secure: true,       // SameSite=None 时必须启用 Secure
  httpOnly: true
});

浏览器行为差异

• Strict：用户从外部站点点击链接跳转时，Cookie 不会发送。
• Lax（默认）：GET 请求跳转会发送 Cookie，但 POST 表单或 AJAX 不会。
• None：允许所有跨站请求，但现代浏览器要求同时设置 Secure。

实战场景分析

案例1：防止 CSRF

<!-- 恶意网站中的表单 -->
<form action="https://bank.com/transfer" method="POST">
  <input type="hidden" name="amount" value="10000">
</form>
<script>document.forms[0].submit();</script>

如果银行的会话 Cookie 设置为 SameSite=Strict，此攻击会失败。

案例2：第三方服务集成

// 嵌入第三方 iframe 需要 SameSite=None
res.cookie('widget_session', 'data', {
  sameSite: 'none',
  secure: true
});

高级配置与陷阱

多层级域名下的 Cookie

对于 example.com 和 sub.example.com：

• 明确指定 domain 属性：

  res.cookie('shared', 'value', { domain: '.example.com' });
  

• SameSite 需保持一致，否则可能被浏览器拒绝。

浏览器兼容性处理

旧版浏览器可能忽略 SameSite，需要后端补充 CSRF 令牌：

<form action="/checkout" method="POST">
  <input type="hidden" name="_csrf" value="token-from-server">
</form>

调试技巧

通过浏览器开发者工具检查 Cookie 属性：

1. 打开 Application > Cookies。
2. 查看各 Cookie 的 HttpOnly、Secure、SameSite 状态。

性能与安全权衡

会话管理优化

短期会话 Cookie 可更严格：

res.cookie('temp', 'data', {
  sameSite: 'strict',
  maxAge: 3600000 // 1小时过期
});

大型应用的分区策略

• 核心认证 Cookie：SameSite=Strict + HttpOnly
• 分析跟踪 Cookie：SameSite=Lax（允许跨站 GET）