HTTP Cookies 解密：Web 开发者指南
内容提要
本文介绍了HTTP cookies在Web开发中的重要性，与localStorage的比较，工作原理和设置方法，以及cookies的属性和IETF标准。
延伸解读
Cookie 与 localStorage 的安全权衡
文章指出，localStorage 便于 JavaScript 访问，但无法防御 XSS 攻击，攻击者可利用漏洞窃取数据。而 Cookie 支持 HttpOnly、Secure 和 SameSite 等安全标志，能有效缓解 XSS、中间人攻击和 CSRF，因此更适合存储认证信息等敏感数据。localStorage 则适用于非敏感数据，如用户偏好或缓存内容，且存储容量更大（通常 5-10MB，而 Cookie 仅 4KB）。
跨域请求中的 Cookie 发送机制
浏览器会自动在同域请求中携带 Cookie，但跨域 POST 请求默认不发送。若需跨域携带 Cookie，客户端必须设置 withCredentials: true，同时服务器需响应 Access-Control-Allow-Credentials: true 头。若服务器未允许凭证，即使客户端设置了 withCredentials，浏览器仍会阻止 Cookie 发送。这一机制常被开发者忽视，导致跨域认证失败。
设置 Cookie 的两种途径及其限制
设置 Cookie 主要有两种方式：服务器端通过 HTTP 响应头 Set-Cookie 设置，可包含 HttpOnly、Secure、SameSite 等安全属性；客户端通过 JavaScript 的 document.cookie 设置，但无法设置 HttpOnly 属性，因此安全性较低。对于需要高安全性的 Cookie（如会话标识），应优先使用服务器端设置，以充分利用安全标志。
Q&A
HTTP cookies的主要功能是什么？
HTTP cookies用于管理用户会话、跟踪用户行为和增强用户体验。
cookies和localStorage有什么区别？
cookies更安全，适合存储敏感数据，而localStorage易于访问但不安全，适合存储非敏感数据。
如何设置HTTP cookies？
HTTP cookies通过HTTP响应中的Set-Cookie头由后端服务器发送，浏览器会自动存储这些cookies。
什么是HttpOnly和Secure标志？
HttpOnly标志防止JavaScript访问cookie，Secure标志确保cookie仅通过SSL传输。
如何在JavaScript中访问cookies？
可以通过document.cookie访问cookies，但HttpsOnly的cookies无法访问。
cookies的属性有哪些？
cookies的属性包括Expires、Domain、Path、Secure、HttpOnly和SameSite，控制cookie的行为。
