localstorage的跨域存储方案

html5标准中一个亮点就是提供了浏览器本地存储的功能。方式有两种：localStorage和 sessionStorage。 相对于cookie，他们具有存储空间大的特点，一般可以存储5M左右，而cookie一般只有4k。

localStorage和 sessionStorage的主要区别是：localStorage的生命周期是永久的，意思就是如果不主动清除，存储的数据将一直被保存。而sessionStorage顾名思义是针对一个session的数据存储，生命周期为当前窗口，一旦窗口关闭，那么存储的数据将被清空。

当然作为孪生兄弟，两者也有很多相同点。比如存取数据的方法就是一样的。

#localStorage和sessionStorage的一些方法：
#添加键值对： setItem(key,value);
#获取键值对： getItem(key);
#删除键值对： removeItem(key);
#清除所有键值对： clear();
#获取属性名称（键名称）： key(index);
#获取键值对的数量： length;

#localStorage 的存取方式
localStorage.age = 88; // 用localStorage属性的方式来添加条目
localStorage.setItem("animal","cat"); // 推荐使用setItem的方式存储一个名为animal，值为cat的数据
var animal = localStorage.getItem("animal"); //读取本地存储中名为animal的数据，并赋值给变量animal
console.log(animal);  
localStorage.removeItem("animal"); //删除单条数据
localStorage.clear(); //清除所有数据

#sessionStorage 的存取方式
sessionStorage.work = "police";
sessionStorage.setItem("person", "Li Lei");
var person = sessionStorage.getItem("person");
console.log(person);

另外，不同浏览器无法共享localStorage和sessionStorage中的信息。同一浏览器的相同域名和端口的不同页面间可以共享相同的 localStorage，但是不同页面间无法共享sessionStorage的信息。这里需要注意的是，页面仅指顶级窗口，如果一个页面包含多个iframe且他们属于同源页面，那么他们之间是可以共享sessionStorage的。在实际开发过程中，遇到的最多的问题就是localStorage的同源策略问题。为了了解这个问题，我们先得清楚什么是同源策略。同源策略（same-origin policy）是浏览器执行的一种安全措施，目的是为了保证用户信息的安全，防止恶意的网站窃取数据。浏览器的同源策略具体如下：

URL 说明 是否允许通信

http://www.a.com/a.js
http://www.a.com/b.js	同一域名下	允许
http://www.a.com/lab/a.js
http://www.a.com/script/b.js	同一域名下不同文件夹	允许
http://www.a.com:8000/a.js
http://www.a.com/b.js	同一域名，不同端口	不允许
http://www.a.com/a.js
https://www.a.com/b.js	同一域名，不同协议	不允许
http://www.a.com/a.js
http://70.32.92.74/b.js	域名和域名对应ip	不允许
http://www.a.com/a.js
http://script.a.com/b.js	主域相同，子域不同	不允许
http://www.a.com/a.js