博客：pionpill
浏览器持久化技术，包括：cookie，sessionStorage，localStorage。还有一种较为前卫的 indexDB。这些技术方案的特点如下：
| 特征 | cookie | sessionStorage | localStorage | indexedDB |
|---|---|---|---|---|
| 来源 | 一般由服务端生成 | 浏览器存储 | 浏览器存储 | 浏览器存储 |
| 有效期 | 持有有效，但存在过期时间 | 仅当前会话（页面）有效 | 始终有效 | 始终有效 |
| 数据大小 | 4K | 5M | 5M | 无限制 |
| 服务器通信 | 携带在请求的 header 中 | 不参与 | 不参与 | 不参与 |
| 主要用途 | 身份验证 | 会话存储 | 本地持久化 | 大数据本地持久化 |
cookie
cookie 有一个重要特性：每次请求都存被存储在 header 中，因此它常用户存储用户状态，进行一些鉴权操作。他有过期时间，比如自动登录功能就可以根据 cookie 中的信息来判断。
cookie 理论上也可以存储一些配置信息，例如主题偏好，搜索历史。但由于 cookie 最多存储 4KB 数据，因此这些非关键数据应该优先考虑 localStorage。
由于 cookie 会存储鉴权相关的信息，如果是 http 请求，这些身份相关的信息很可能被捕获并解析出来。
localStorage/sessionStorage
localStorage/sessionStorage 都是数据持久化技术，唯一的不同是 sessionStorage 只在当前对话有效，localStorage 则会对数据进行持久化，存到用户本地电脑中。
sessionStorage 存储会话相关的临时数据：表单数据，用户状态，临时操作历史等。 localStorage 存储持久化数据：用户偏好，搜索历史，离线数据。
indexedDB
indexedDB 从名字就知道是数据库，它是一种非关系型数据库（NoSQL），有如下特点：
- 使用键值对存储数据
- 支持异步操作，相对的 localStorage 是同步操作。
- 支持事务，一系列操作中只要一个步骤失败，就回退到之前的状态。
- 受同源策略影响，不能访问跨域数据库（localStorage 也受到同源策略影响）
- 可以存储二进制对象
- 理论上没有存储上限（受用户硬盘大小限制）
emm，看起来像浏览器自带的 mongoDB？
// 打开一个数据库，两个参数分别表示：数据库名，版本
const db = globalThis.indexedDB.open('db1', 1)
具体操作不演示了。可以参考这篇文章
