同源策略

本内容摘自阮一峰-浏览器同源政策及其规避方法

目前，所有浏览器都实行这个政策。最初，它的含义是指，A网页设置的 Cookie，B网页不能打开，除非这两个网页"同源"。

所谓"同源"指的是"三个相同"。

协议相同            （http://）

域名相同            （www.xx.com）

端口相同            （80）

什么是同源策略？

同源策略是浏览器的一个安全功能，不同源的客户端脚本在没有明确授权的情况下，不能读写对方资源。

目的

同源政策的目的，是为了保证用户信息的安全，防止恶意的网站窃取数据。

限制范围

（1） Cookie、LocalStorage 和 IndexDB 无法读取。

（2） DOM 无法获得。

（3） AJAX 请求不能发送。

同源策略及Cookie的作用域

Cookie有两个很重要的属性:domain和path，用来指示此Cookie的作用域：

Cookie 是服务器写入浏览器的一小段信息，只有同源的网页才能共享。但是，两个网页一级域名相同，只是二级域名不同，浏览器允许通过设置 document.domain 共享 Cookie。

例如：A网页是  http://w1.example.com/a.html，B网页是  http://w2.example.com/b.html，那么只要设置相同的  document.domain，两个网页就可以共享  Cookie。
document.domain='example.com';    【设置相同的document.domain】
document.cookie="test1=hello";        【现在，A网页通过脚本设置一个 Cookie。】
var allCookie=document.cookie;       【B网页就可以读到这个 Cookie】

注意，这种方法只适用于 Cookie 和 iframe 窗口，LocalStorage 和 IndexDB 无法通过这种方法，规避同源政策

iframe 与 LocalStorage 

如果两个窗口一级域名相同，只是二级域名不同，那么设置上一节介绍的document.domain属性，就可以规避同源政策，拿到DOM。
1.片段识别符：
父窗口可以把信息，写入子窗口的片段标识符。
varsrc=originURL+'#'+data;
document.getElementById('myIFrame').src=src;
子窗口通过监听hashchange事件得到通知。
parent.location.href=target+"#"+hash;
2.window.name
浏览器窗口有window.name属性。这个属性的最大特点是，无论是否同源，只要在同一个窗口里，前一个网页设置了这个属性，后一个网页可以读取它
window.name = data;
子窗口跳回一个与主窗口同域的网址。
location = 'http://parent.url.com/xxx.html';
主窗口就可以读取子窗口的window.name了。
var data = document.getElementById('myFrame').contentWindow.name;
3.postMessage
window.opener.postMessage('Nice to see you', 'http://aaa.com');
window.addEventListener('message', function(e) {
 console.log(e.data);
},false);
message事件的事件对象event，提供以下三个属性。
event.source：发送消息的窗口
event.origin: 消息发向的网址
event.data: 消息内容

LocalStorage

AJAX

有三种方法规避这个限制。
JSONP
WebSocket
CORS

JSONP
JSONP是服务器与客户端跨源通信的常用方法。最大特点就是简单适用，老式浏览器全部支持，服务器改造非常小。
它的基本思想是，网页通过添加一个<script>元素，向服务器请求JSON数据，这种做法不受同源政策限制；服务器收到请求后，将数据放在一个指定名字的回调函数里传回来。

 WebSocket
现代浏览器允许脚本直连一个WebSocket地址而不管同源策略。然而，使用WebSocket URI的时候，在请求中插入Origin头就可以标识脚本请求的源。为了确保跨站安全，WebSocket服务器必须根据允许接受请求的白名单中的源列表比较头数据。 与JSONP方法不同的是，该响应函数被传入到创建 标签的构造函数中，检测到已经成功接受到收据的状态后再执行函数
document.domain + iframe (只有在主域相同的时候才能使用该方法)

location.hash + iframe

window.name + iframepostMessage（HTML5中的XMLHttpRequest Level 2中的API）