客户端cookie,localstorage和sessionstorage的区别

1.cookie

• 如果不在浏览器中设置过期时间，cookie被保存在内存中，生命周期随浏览器的关闭而结束，这种cookie简称会话cookie。如果在浏览器中设置了cookie的过期时间，cookie被保存在硬盘中，关闭浏览器后，cookie数据仍然存在，直到过期时间结束才消失。
• cookie只能保存字符串类型，以文本的方式
• cookie存储的数据较小，单个cookie保存的数据不能超过4kb
• 用户可以操作（禁用）cookie，使功能受限
• 每次访问都要传送cookie给服务器，浪费带宽。
• 应用场景：
  （1）判断用户是否登陆过网站，以便下次登录时能够实现自动登录（或者记住密码）。如果我们删除cookie，则每次登录必须从新填写登录的相关信息。
  （2）保存上次登录的时间等信息。
  （3）保存上次查看的页面
  （4）浏览计数

2.WebStorage

• 存储大小：localStorage和sessionStorage的存储数据大小一般都是：5MB
• 存储位置：localStorage和sessionStorage都保存在客户端，不与服务器进行交互通信。
• 存储内容类型：localStorage和sessionStorage只能存储字符串类型，对于复杂的对象可以使用ECMAScript提供的JSON对象的stringify和parse来处理
• WebStorage提供了一些方法，数据操作比cookie方便；
  setItem (key, value) —— 保存数据，以键值对的方式储存信息。
  getItem (key) —— 获取数据，将键值传入，即可获取到对应的value值。
  removeItem (key) —— 删除单个数据，根据键值移除对应的信息。
  clear () —— 删除所有的数据
  key (index) —— 获取某个索引的key

2.1 localstorage(本地存储）

• localStorage的生命周期是永久的，关闭页面或浏览器之后localStorage中的数据也不会消失。localStorage除非主动删除数据，否则数据永远不会消失。
• 应用场景：localStoragese：常用于长期登录（+判断用户是否已登录），适合长期保存在本地的数据。

2.2 sessionstorage（会话存储）

• sessionStorage的生命周期是在仅在当前会话下有效。sessionStorage引入了一个“浏览器窗口”的概念，sessionStorage是在同源的窗口中始终存在的数据。只要这个浏览器窗口没有关闭，即使刷新页面或者进入同源另一个页面，数据依然存在。但是sessionStorage在关闭了浏览器窗口后就会被销毁。同时独立的打开同一个窗口同一个页面，sessionStorage也是不一样的。
• 应用场景：sessionStorage：敏感账号一次性登录；