跨域的几种方法

同源策略

浏览器出于安全方面的考虑，为了保证用户信息的安全，防止恶意的网站窃取数据。只允许与本域下的接口交互。不同源的客户端脚本在没有明确授权的情况下，不能读写对方的资源 。
而同源指的是：
同协议：如都是http或者https
同域名：如都是http://jirengu.com/a 和http://jirengu.com/b
同端口：如都是80端口
所以只要协议、域名、端口有任何一个不同，都被当作是不同的域。

跨域的方法

1 JSONP

JSONP的全称：JSON with Padding，它是资料格式 JSON 的一种“使用模式”，可以让网页从别的网域要资料。
JSONP由两部分组成：回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数，而数据就是传入回调函数中的JSON数据。

在HTML中通过添加一个 //foo是回调函数 还可以通过DOM来创建

//b.html

document.domain的设置是有限制的，我们只能把document.domain设置成自身或更高一级的父域，且主域必须相同。修改document.domain的方法只适用于不同子域的框架间的交互。

4 postMessage

HTML5为了解决跨域窗口的通信问题，引入了一个全新的API：跨文档通信 API（Cross-document messaging）。

otherWindow.postMessage(message, targetOrigin, [transfer]);  //postMessage方法的第一个参数是具体的信息内容，第二个参数是接收消息的窗口的源（origin），即"协议 + 域名 + 端口"。也可以设为*，表示不限制域名，向所有窗口发送。

//父元素a.html


window.frames[0].postMessage('Hello World!', 'http://b.jrg.com:8080/b.html');   //向b.html发送'Hello World!'

window.addEventListener('message', function(e) {
  console.log(e.data);   //监听到并打印出'Nice to see you'
},false);

//子元素b.html
window.parent.postMessage('Nice to see you', 'http://a.jrg.com:8080/a.html'); //向a.html发送'Nice to see you'

window.addEventListener('message', function(e) {
  console.log(e.data);   //监听到并打印出'Hello World!'
},false);