cookie、sessionStorage和localStorage的区别

１.本地存储

两个storage其他属性方法都一样

特性	Cookie	localStorage	sessionStorage
数据的生命期	一般由服务器生成，可设置失效时间。如果在浏览器端生成Cookie，默认是关闭浏览器后失效	持久化数据，浏览器关闭后数据不会丢失，除非主动删除	数据在当前浏览器关闭后被清除
存放数据大小	4K左右	一般为5MB	-
与服务器端通信	每次都会携带在HTTP头中，如果使用cookie保存过多数据会带来性能问题	仅在客户端（即浏览器）中保存，不参与和服务器的通信	-
易用性	需要程序员自己封装，源生的Cookie接口不友好	源生接口可以接受，亦可再次封装来对Object和Array有更好的支持	-

2.应用场景

有了对上面这些差别的直观理解，我们就可以讨论三者的应用场景了。

• 因为考虑到每个 HTTP 请求都会带着 Cookie 的信息，所以 Cookie 当然是能精简就精简啦，比较常用的一个应用场景就是判断用户是否登录。针对登录过的用户，服务器端会在他登录时往 Cookie 中插入一段加密过的唯一辨识单一用户的辨识码，下次只要读取这个值就可以判断当前用户是否登录啦。曾经还使用 Cookie 来保存用户在电商网站的购物车信息，如今有了 localStorage，似乎在这个方面也可以给 Cookie 放个假了~

• 另一方面，localStorage接替了 Cookie 管理购物车的工作，同时也能胜任其他一些工作。比如HTML5游戏通常会产生一些本地数据，localStorage 也是非常适用的。

• 如果遇到一些内容特别多的表单，为了优化用户体验，我们可能要把表单页面拆分成多个子页面，然后按步骤引导用户填写。这时候sessionStorage 的作用就发挥出来了（关闭浏览器就失效）。

3. 使用CORS还会带cookie么

JavaScript出于安全方面的考虑，不允许跨域调用其他页面的对象,当然无法读取cookie了。
使用CORS是可以的：跨域资源共享 CORS 详解

Access-Control-Allow-Credentials
该字段可选。它的值是一个布尔值，表示是否允许发送Cookie。默认情况下，Cookie不包括在CORS请求之中。设为true，即表示服务器明确许可，Cookie可以包含在请求中，一起发给服务器。这个值也只能设为true

4. localstorage扩容

W3C组织在2010年11月18日废弃了webSql。转而使用一个叫做indexedDBA的key/value的数据库。据说Chrome浏览器的indexedDb的底层是基于levelDBA的，后者是谷歌开源的nosql数据库，非常之高效。
The Web Applications Working Group continues work on two other storage-related specifications: Web Storage and Indexed Database API.

Web SQL
Web SQL应用

对于 HTML5，也许很有用的就是它新推出的“Web Storage”（Web 存储）API，它包括 localStorage 和 sessionStorage，对简单的键值对（比如应用程序设置）或简单对象（如应用程序状态）进行存储，使用本地和会话存储能够很好地完成，对于存储少量的数据非常有用，但是对大量的结构化数据进行处理时，它就力所不及了，而这正是 HTML5 的“Web SQL Database” API 接口的应用所在。
Web SQL Database API 实际上并不包含在 HTML5 规范之中。它是一个独立的规范，它引入了一套使用 SQL 操作客户端数据库的 API。最新版本的 Chrome，Safari 和 Opera 浏览器都支持 Web SQL Database。

IndexedDB

IndexedDB 是一个为了能够在客户端存储可观数量的结构化数据，并且在这些数据上使用索引进行高性能检索的 API。虽然 [DOM 存储]:(https://developer.mozilla.org/en-US/docs/DOM/Storage) 对于存储少量数据是非常有用的，但是它对大量结构化数据的存储就显得力不从心了。IndexedDB 则提供了这样的一个解决方案。

5.http-only补充

HTTP cookies 详解
微软的 IE6 SP1 在 cookie 中引入了一个新的选项：HTTP-only，HTTP-Only背后的意思是告之浏览器该 cookie 绝不能通过 JavaScript 的 document.cookie属性访问。设计该特征意在提供一个安全措施来帮助阻止通过 JavaScript 发起的跨站脚本攻击 (XSS) 窃取 cookie 的行为