参考资料：
Cookies：
web存储是大多数网站应用都会拥有的功能，最常会用到的cookies用来存储用户令牌以达到身份验证的目的，这样用户可以持久地保持登录状态。因为HTTP是无状态的，服务端与客户端之间要请求必须开启连接，请求完毕之后又会关闭掉连接，所以需要cookies来记录用户相关的一些数据，以便服务端辨识。
它会被服务器和客户端通信的过程往返携带，像是HTTP请求报文上会出现cookies这样的字段，HTTP响应报文上会出现set-cookies这样的字段。它由服务端创建以set-cookies字段的形式返回，客户端收到之后会保存下来，以便下次请求的时候能够以cookies字段的形式携带发送给服务端。
它是采用的是类似同源策略的方式来存储数据，仅限于同一个域下的访问。默认会在浏览器关闭之后被清除，但是如果有设置过期时间的话，只要用户不主动清除浏览器数据，都能够长期的存储数据在本地。但因为某些原因会不太适用于在一些场景里面：
- 存储的容量和数量上的限制：在一个域下可以有20个cookies，单个cookies容量也会被限制。
- 不确定性：在一些浏览器下如果容量或数量超过了，会选择覆盖掉近期被很少使用的cookies
- 安全性：攻击者采用诸如XSS的攻击方式可以获取到用户的cookies值，从而冒充用户的请求。不过上面的图片中的set-cookies中有HttpOnly的字段，这个字段可以在一定程度上防止这类的攻击，限制客户端使用javascript访问cookies。()
- API不健全：在BOM中会开放document.cookies这样的一个接口来访问cookies，它会返回一堆键值对形式的字符串数据，就同上图一样，一般需要借助第三方库才能够管理这些数据。
- 带宽上的消耗：因为每次HTTP请求的时候都会被携带传送，造成了HTTP通信上的带宽消耗。
Web存储：
下面介绍的两个API都是Store的实例：localStore 与 sessionStore 它们在HTML5中被加入，它们不是什么新奇的东西，早在IE6就已经出现了userData这样的存储技术，这里就不叙述了。
相比Cookies有以下的优点：
- 能存储较为多的数据，一般为5MB
- 生命周期默认是长期存储的，但是sessionStore，就如同英文上的示意一样，它是以会话的形式存在，会在浏览器关闭或者网页关闭的时候就会被销毁。localStore则能够保存到用户清楚数据之前。
- 仅保存在客户端，不参与和服务端的通信，不会带来性能上的消耗，同时安全问题会较少，但仍然不适用于存储敏感信息
- 原生API良好，易用性好。
- 仍然是同源限制
兼容性：
LocalStore 和 SessionStore区别：
localStroage和sessionStorage 都是全局对象，但sessionStore它仅仅维护着在页面会话(page session)期间有效的存储空间。同时纵使页面重新载入或者浏览器崩溃之后恢复都能够访问的到，适合用于存储一些临时数据。
API：
它们因为同属于Storage接口，所有都有下列的属性与方法：
Storage.length:保存数据的个数，这是它们唯一的一个属性。Storage.setItem()：用于保存数据使用，可传递两个参数，第一个是键名，第二个是保存的数据。没有返回值。这里要注意，Storage保存的数据是字符串类型的，纵使你传入一个Object进去它也会自动帮你使用Object.prototype.toString()进行转换。Storage.getItem():方法用于读取数据。只有一个参数，就是键名。如果键名不存在，该方法返回null。Storage.removeItem():方法用于清除某个键名对应的键值。它接受键名作为参数，如果键名不存在，该方法不会做任何事情。Storage.clear():用于清除所有保存的数据。该方法的返回值是undefined。Storage.key(): 接受一个整数作为参数（从零开始），返回该位置对应的键值。
storage事件：
这个事件用于监听Storage实例上数据的改变。
window.addEventListener('storage', onStorageChange);
监听函数接受一个event实例对象作为参数。这个实例对象继承了 StorageEvent 接口，它们都是只读属性。
StorageEvent.key：字符串，表示发生变动的键名。如果 storage 事件是由clear()方法引起，该属性返回null。
StorageEvent.newValue：字符串，表示新的键值。如果 storage 事件是由clear()方法或删除该键值对引发的，该属性返回null。
StorageEvent.oldValue：字符串，表示旧的键值。如果该键值对是新增的，该属性返回null。
StorageEvent.storageArea：对象，返回键值对所在的整个对象。也说是说，可以从这个属性上面拿到当前域名储存的所有键值对。
StorageEvent.url：字符串，表示原始触发 storage 事件的那个网页的网址。
注意：
阮老师的那篇教程有提到，如果是使用了Storage事件，在单页面下是不会触发，但是如果在多页面的情况下（也就是同样一个页面打开了多个标签或多个窗口），触发会发生在另外一个页面，这样的机制可以被应用在多页面的相互通信机制下。
谢谢！