| 特性 | cookie | localStorage | sessionStorage | IndexDB |
|---|
| 数据存储大小 | 4kb | 5M | 5M | 无限 |
| 与服务端通信 | 每次都会携带在header中 | 不参与 | 不参与 | 不参与 |
| 数据生命周期 | 默认tab页关闭后就失效了，可以通过expire设置。 | 除非被清理，否则一直存在 | 页面关闭就清理 | 除非被清理，否则一直存在 |
| 作用域 | 由domain和path确定 | 同源 | 同源 | 同源 |
| 存储的地方 | 硬盘中 | 硬盘中 | 内存中 | 硬盘中 |
| 应用场景 | 每次信息处理都需要和server端交互的情景。 | 需要做持久化，少量数据处理不用每次都和后端交互的情况。 | 不需要做持久化，少量数据处理不用每次都和后端交互的情况。 | 需要做持久化，大量数据处理不用每次都和后端交互的情况。 |
| 缺点 | 存储量少，操作麻烦，增加传输负担。 | 存储量较少，性能随着容量减小显著下降, 不同项目都存在一起，维护困难，只能保存字符串。 | 存储量较少，性能随着容量减小显著下降，不同项目都存在一起，维护困难，只能保存字符串。 | 性能随着数据变多会显著下降 |
如果没有大量数据存储需求的话，可以使用localStorage和sessionStorage。对于不怎么改变的数据使用localStorage否则sessionStorage
cookie注意事项
| 属性 | 作用 |
|---|
| value | 如果用于保存用户登录态，应该将该值加密，不能使用明文的用户标识 |
| http-only | 不能通过 JS 访问 Cookie，减少 XSS 攻击 |
| secure | 只能在协议为 HTTPS 的请求中携带 |
| same-site | 规定浏览器不能在跨域请求中携带 Cookie，减少 CSRF 攻击 |
