随着移动网络的发展与演化，我们手机上现在除了有原生App，还能跑“WebApp”——它即开即用，用完即走。一个优秀的WebApp甚至可以拥有和原生App媲美的功能和体验。WebApp优异的性能表现，有一部分原因要归功于浏览器存储技术的提升。cookie存储数据的功能已经很难满足开发所需，逐渐被WebStorage、IndexedDB所取代，本文将介绍这几种存储方式的差异和优缺点。
一、cookie1.cookie的来源cookie的本职工作并非本地存储，而是“维持状态”。因为HTTP协议是无状态的，HTTP协议自身不对请求和响应之间的通信状态进行保存，通俗来说，服务器不知道用户上一次做了什么，这严重阻碍了交互式Web应用程序的实现。在典型的网上购物场景中，用户浏览了几个页面，买了一盒饼干和两瓶饮料。最后结帐时，由于HTTP的无状态性，不通过额外的手段，服务器并不知道用户到底买了什么，于是就诞生了cookie。它就是用来绕开HTTP的无状态性的“额外手段”之一。服务器可以设置或读取cookie中包含信息，借此维护用户跟服务器会话中的状态。
在刚才的购物场景中，当用户选购了第一项商品，服务器在向用户发送网页的同时，还发送了一段cookie，记录着那项商品的信息。当用户访问另一个页面，浏览器会把cookie发送给服务器，于是服务器知道他之前选购了什么。用户继续选购饮料，服务器就在原来那段Cookie里追加新的商品信息。结帐时，服务器读取发送来的cookie就行了。
2.什么是cookiecookie指某些网站为了辨别用户身份而储存在用户本地终端上的数据(通常经过加密)。cookie是服务端生成，客户端进行维护和存储，存储在内存或者磁盘中。通过cookie,可以让服务器知道请求是来源哪个客户端，就可以进行客户端状态的维护，比如登陆后刷新，请求头就会携带登陆时responseheader中的Set-Cookie,Web服务器接到请求时也能读出cookie的值，根据cookie值的内容就可以判断和恢复一些用户的信息状态。
简而言之，cookie使基于无状态的HTTP协议记录稳定的状态信息成为了可能。
cookie主要用于以下三个方面：
会话状态管理（如用户登录状态、购物车、游戏分数或其它需要记录的信息）个性化设置（如用户自定义设置、主题等）浏览器行为跟踪（如跟踪分析用户行为等）3.cookie的原理及其构成简单的HTTP请求过程第一次访问网站的时候，浏览器发出请求，服务器端生成cookie在响应中通过Set-Cookie头部告知客户端(允许多个Set-Cookie头部传递多个值)，客户端得到cookie后,后续请求都会自动将cookie头部携带至请求中发送给服务器（见下面例子），另外，cookie的过期时间、域、路径、有效期、适用站点都可以根据需要来指定。
//一个HTTP响应：HTTP/1.OKContent-type:text/htmlSet-Cookie:name=valueOther-header:other-header-value
这个HTTP响应会设置一个名为"name"，值为"value"的cookie。名和值在发送时都会经过URL编码。浏览器会存储这些会话信息，并在之后的每个请求中都会通过HTTP头部cookie再将它们发回服务器，比如：
GET/index.jslHTTP/1.1Cookie:name=valueOther-header:other-header-value
cookie在浏览器中是由以下参数构成的：
name：唯一标识cookie的名称。cookie名不区分大小写，因此myCookie和MyCookie是同一个名称。不过，实践中最好将cookie名当成区分大小写来对待，因为一些服务器软件可能这样对待它们。cookie名必须经过URL编码。value：存储在cookie里的字符串值。这个值必须经过URL编码。Domain：cookie有效的域。发送到这个域的所有请求都会包含对应的cookie。如果不指定，默认为文档来源（由协议、域名和端口共同定义），不包含子域名。如果指定了Domain，则一般包含子域名。因此，指定Domain比省略它的限制要少。但是，当子域需要共享有关用户的信息时，这可能会有所帮助。例如，如果设置Domain=mozilla.org，则Cookie也包含在子域名中（如developer.mozilla.org）。Path：请求URL中包含这个路径才会把cookie发送到服务器。//例如，设置Path=/docs，则以下地址都会匹配：/docs/docs/Web//docs/Web/HTTPExpires/Max-Age：设置cookie过期时间（Expires）或有效期（Max-Age）（即什么时间之后就不发送到服务器了）。简单名/值对形式的cookie只在当前会话期间存在，用户关闭浏览器就会丢失。如果想让cookie的生命周期超过单个浏览对话，那就指定Expires/Max-Age，max-age优先级高于expires。Secure：设置之后，只在使用SSL安全连接的情况下才会把cookie发送到服务器。例如，请求