总结：前端常用的四种存储方式有cookie、localStorage、sessionStorage、indexedDB
| 容量 | 生命周期 | 通信 | |
| cookie | 4kb | 可以设置 | 每次发送请求都会携带在header中 |
| localStorage | 5M | 永久（需要手动清除） | 不参与 |
| sessionStorage | 5M | 仅在当前对话保留 |
不参与 |
| indexedDB | 不限 | 永久（需要手动清除） | 不参与 |
1、cookie
主要用于三个方面： • 会话状态管理（如用户登录状态、购物车、游戏分数或其它需要记录的信息） • 个性化设置（如用户自定义设置、主题等） • 浏览器行为跟踪（如跟踪分析用户行为等）优点：兼容性好，请求头携带cookie很方便；缺点：容量小，上限只有4kb，每次请求都自动携带会消耗性能，会被利用与CSRF(跨站请求伪造）攻击;cookie的原生api需要拼接字符串，为了方便一般会再进行封装。
2、localStorage HTML5加⼊的以键值对(Key-Value)为标准的存储⽅式，优点是操作⽅便，永久性储存（除⾮⼿动删除），⼤⼩为5M。 localStorage 中的键值对总是以字符串的形式存储，对于对象、整数 key 值会自动转换成字符串形式。
3、sessionStorage 与localStorage基本类似，区别是sessionStorage当⻚⾯关闭后会被清理，⽽且与cookie、localStorage不同，他不能在所有同源窗⼝中共享，是会话级别的储存⽅式，会话结束时会被清除
4、IndexedDB 是非关系型数据库，基于文件存储，理论上容量无上限（基于硬盘容量）；⽤键值对进⾏储存，可以进⾏快速读取操作；所有操作都要在回调中进行 标签：存储,sessionStorage,前端,几种,5M,localStorage,cookie,键值 From： https://www.cnblogs.com/hwinter/p/16821586.html