poxiaoxi博客登录网站后刷新页面，账号通常不会立即退出；切换页面后，购物车里的商品依然存在；网站还可能记住语言、主题等设置。这些功能背后经常会用到Cookie。
Cookie本质上是浏览器为网站保存的一小段数据。它最大的作用不是“存文件”，而是帮助网站在多次HTTP请求之间识别用户和维持状态。
网站为什么需要Cookie
HTTP本身是无状态的。浏览器先请求登录页面，再请求用户中心，对服务器来说默认是两次独立请求，并不会天然知道它们来自同一个已经登录的用户。
Cookie可以在两次请求之间建立联系。用户登录成功后，服务器可以返回：
Set-Cookie: session_id=abc123; Path=/; HttpOnly; Secure
浏览器保存后，再访问符合条件的页面时，会自动发送：
Cookie: session_id=abc123
服务器根据这个会话标识找到对应用户，就可以继续保持登录状态。
Cookie里面通常保存什么
Cookie采用名称和值的形式，例如：
language=zh-CN theme=dark session_id=abc123
网站常用Cookie保存或标记以下信息：
登录会话标识；
语言、主题等用户偏好；
购物车或临时业务状态；
统计分析所需的识别信息；
部分安全验证相关信息。
Cookie容量有限，而且符合条件的数据会随HTTP请求发送，因此并不适合保存大量内容。
登录Cookie通常不保存密码
一个常见误解是，网站保持登录状态意味着浏览器一直保存着账号和密码。正规的会话机制通常不会这样设计。
更常见的方式是Cookie只保存随机Session ID：
session_id=8f29ab31
服务器内部再维护对应关系：
8f29ab31 ↓ 用户ID：1024 ↓ 登录状态：有效
这样浏览器只需要携带会话凭据，不需要在每次请求中重新提交密码。
Cookie可以保存多久
Cookie可以是临时的，也可以设置有效期。
例如：
Set-Cookie: theme=dark; Max-Age=2592000
Max-Age表示Cookie可以保存指定时间。还可以使用Expires设置过期日期。
如果没有设置明确的有效期，Cookie通常会作为会话Cookie处理。不过现代浏览器可能具有会话恢复机制，因此不能简单理解成“关闭一个标签页就一定删除”。
几个重要的Cookie属性
实际开发Cookie时，经常会看到Secure、HttpOnly和SameSite。
Secure
Secure用于限制Cookie通过安全连接发送，通常与HTTPS配合：
Set-Cookie: session_id=abc123; Secure
HttpOnly
HttpOnly可以阻止网页JavaScript通过document.cookie直接读取Cookie，登录会话通常会考虑开启：
Set-Cookie: session_id=abc123; HttpOnly
SameSite
SameSite控制Cookie在跨站请求中的发送方式，常见值有：
SameSite=Strict SameSite=Lax SameSite=None
它与跨站请求安全以及第三方Cookie场景密切相关。其中SameSite=None通常需要同时使用Secure。
Domain和Path有什么作用
Cookie不会无条件发送给所有页面。Domain和Path可以控制它的作用范围。
Set-Cookie: user_id=123; Domain=example.com; Path=/
Domain决定Cookie适用于哪些主机，Path则进一步限制对应的URL路径。
合理设置作用范围，可以避免Cookie被发送到不需要它的请求中。
Cookie和Session不是一回事
Cookie保存在浏览器一侧，Session通常保存在服务器一侧，但两者经常配合使用。
浏览器Cookie session_id=ABC123 ↓ 服务器Session ABC123 → 用户ID 1001
Cookie负责告诉服务器“当前浏览器持有哪个会话”，Session负责保存该会话对应的实际状态。
因此，Cookie和Session不是两个互相替代的概念，而是经常组合使用。
Cookie和LocalStorage的区别
Cookie和localStorage都能保存浏览器数据，但用途不同。
Cookie最大的特点之一，是符合条件时浏览器可以自动把它附加到HTTP请求中：
Cookie: session_id=abc123
localStorage则主要用于浏览器本地存储：
localStorage.setItem("theme", "dark");它不会自动随着HTTP请求发送给服务器。因此，登录会话等需要服务器持续识别用户的场景通常会涉及Cookie，而纯前端偏好设置则可能更适合LocalStorage。
精彩评论