25 lines
1.4 KiB
Plaintext
25 lines
1.4 KiB
Plaintext
---
|
|
title: 描述cookie、 `sessionStorage` 和 `localStorage` 之间的差异。
|
|
---
|
|
|
|
## 相似性
|
|
|
|
Cookies、`localStorage`和`sessionStorage`都是:
|
|
|
|
- 客户端的存储机制。 这意味着客户端可以阅读和修改这些值。
|
|
- 基于键值的存储。
|
|
- 他们只能存储作为字符串的值。 对象必须序列化为字符串 (`JSONstringify()`) 才能存储。
|
|
|
|
## 差异
|
|
|
|
| 属性 | Cookie | LocalStorage | SessionStorage |
|
|
| --------------- | ------------------------------- | ------------ | -------------- |
|
|
| 发起方 | 客户端或服务器。 服务器可以使用 `Set-Cookie` 头 | 客户端 | 客户端 |
|
|
| 有效期 | 手动设置 | 永久 | 标签关闭时 |
|
|
| 跨浏览器会话的持久性 | 取决于是否设置过期时间 | 是 | 否 |
|
|
| 每次HTTP请求都发送到服务器 | Cookie 会自动通过 `Cookie` 头发送 | 否 | 否 |
|
|
| 容量(每个域) | 4kb | 5MB | 5MB |
|
|
| 访问权限 | 任何窗口 | 任何窗口 | 部分标签页 |
|
|
|
|
还有其他客户端存储机制,如 [IndexedDB](https://developer.mozilla.org/en-US/docs/Web/ADI/IndexedDB_API),比上述技术更强大,但使用起来更复杂。
|