Cookie与Web Storage的区别

共同点：用于数据的存储。

区别：

1、是否需要添加到http请求头？

HTTP Cookie（cookie）：在客户端存储会话信息，要求服务器对任意HTTP请求发送set-cookie HTTP头作为响应的一部分，包含会话信息。例如set-cookie: name=value。然后浏览器会存储这样的会话信息，并在这之后，通过为每个请求添加cookie HTTP头将信息发送回服务器。如cookie:name=value。

Web Storage：无须将数据发回服务器。

2、作用范围

cookie：是绑定在特定域名下的，当设定了一个cookie后，再给创建它的域名发送请求时，都会包含这个cookie。这个限制保证了储存在cookie中的信息只能让批准的接受者访问，而无法被其他域访问。

sessionStorage：sessionStorage对象存储特定于某个会话的数据，可以跨越页面刷新而存在。它绑定于某个服务器会话，所以当文件在本地运行时是不可用的。对多页面应用有限制，因为数据只能由最初给对象存储数据的页面访问到。

localStorage：要访问同一个localStorage对象，页面必须来自同一个域名（子域名无效），使用同一种协议，在同一个端口上。

3、容量

cookie：每个域的cookie总数是有限的，各个浏览器之间各有不同。例如：

IE6以及更低版本限制每个域名最多20个cookie，IE7和之后版本每个域名最多50个；Firefox限制每个域最多50个cookie，Opera限制每个域最多30个cookie；Safari和Chrome对每个域的cookie数量限制没有硬性规定。

浏览器对cookie的尺寸也有限制，最好是4095B，尺寸限制影响到一个域下所有的cookie，而并非每个cookie单独限制。

Web Storage：5MB

4、失效时间

Cookie：设置expires来表示cookie何时应该被删除的时间戳。

sessionStorage：存储特定会话数据，在浏览器关闭后立即删除。

localStorage：数据保留到通过JavaScript删除或是用户清除浏览器缓存。