1.Cookie

Cookie 是服务器保存在浏览器的一小段文本信息，一般大小不能超过4KB。浏览器每次向服务器发出请求，就会自动附上这段信息。

浏览器需要保存这段数据，不得轻易删除
此后每次浏览器访问该服务器，都必须带上这段数据

Cookie 一般有两个作用，第一个作用是识别用户身份，第二个作用是记录历史。

2.session

用户在输入用户名密码提交给服务端，服务端验证通过后会创建一个session用于记录用户的相关信息，这个 session 可保存在服务器内存中，也可保存在数据库中。当页面被关闭时，存储在 sessionStorage 的数据会被清除 。

创建session后，会把关联的session_id 通过setCookie 添加到http响应头部中。
浏览器在加载页面时发现响应头部有 set-cookie字段，就把这个cookie 种到浏览器指定域名下。
当下次刷新页面时，发送的请求会带上这条cookie， 服务端在接收到后根据这个session_id来识别用户。

cookie 是存储在浏览器里的一小段「数据」，而session是一种让服务器能识别某个用户的「机制」，session 在实现的过程中需要使用cookie。 二者不是同一维度的东西。

3.localStorage

只读的localStorage 属性允许你访问一个Document 源（origin）的对象 Storage；存储的数据将保存在浏览器会话中。存储在 localStorage 的数据可以长期保留；localStorage 中的键值对总是以字符串的形式存储。 (需要注意, 和js对象相比, 键值对总是以字符串的形式存储意味着数值类型会自动转化为字符串类型(JSON格式将对象转为字符串，用的时候解析成对象))。

localStorage HTML5本地存储web storage特性的API之一，用于将大量数据（最大5M）保存在浏览器中，保存后数据永远存在不会失效过期，除非用 js手动清除。
不参与网络传输
一般用于性能优化，可以保存图片、js、css、html 模板、大量数据

参考https://developer.mozilla.org/zh-CN/docs/Web/API/Window/localStorage
https://zhuanlan.zhihu.com/p/22396872?refer=study-fe