cookie，localStorage，sessionStorage之间的区别

cookie ， localStorage ， sessionStorage 的相同点和不同点

三者的相同点：

• 都是存储在用户本地终端上的数据，和服务器端的session机制不同

三者的不同点：

• 存放数据大小：
  - cookie : 存放4k左右（因为每次http请求都会携带cookie），用来存储一些比较小的数据，比如用来存储用户信息，辨识用户身份，判断用户是否登录等。
  - sessionStorage和localStorage：一般5M或更大

• 数据生命期：
  - cookie： setMaxAge()方法便可以设置Cookie对象的有效时间，如果不设置过期时间，则表示这个cookie生命周期为浏览器会话期间，只要关闭浏览器窗口，cookie就消失了。
  - sessionStorage：页面会话期间，也就是说数据只在页面关闭之前保存，浏览器窗口关闭时失效，且不同窗口，不同域下的sessionStorage存储相互独立，互不干扰。
  - localStorage ：除非数据被清空，否则一直存在

• 与服务器通信
  - cookie：由服务器的请求来传递，每次都会携带HTTP头中，如果使用cookie保持过多数据会带来性能问题
  - sessionStorage 和 localStorage：数据不是由每个服务器请求传递的，而是只有在请求时使用数据，不参与和服务器的通信
  - sessionStorage和localStorage的唯一区别：sessionStorage生命周期为当前窗口或标签页，一旦窗口或标签页被永久关闭了，那么所有通过sessionStorage存储的数据也就被清空了。 而localStorage生命周期是永久，知道被手动删除
  - sessionStorage和localStorage的增删改查：

  var str='aaa';
  localStorage.setItem('code',str);//增  参一：key，参二：value 字符串类型
  localStorage.getItem('code');//查
  localStorage.removeItem('code',str);//删 参数为key,字符串类型
  localStorage.code='zzz'; //改，重新给属性赋值，以最后一次赋的值为准
  localStorage.clear()//清除所有缓存`
  

• 安全性问题

无论是cookie还是HTML5的本地存储，都是相对不安全的，很容易受到各种各样的攻击，特别是HTML5的存储空间大，给了攻击者更大的发挥平台，所以都不能用来存储敏感信息。登录信息等重要信息还是存放到服务器里比较好。