跨域问题6种解决方式

为什么会有跨越问题？
因为所有支持Javascript的浏览器都会使用同源策略这个安全策略。

同源策略，它是由Netscape提出的一个著名的安全策略。现在所有支持JavaScript 的浏览器都会使用这个策略。
所谓同源是指，域名，协议，端口相同。当一个浏览器的两个tab页中分别打开来 百度和谷歌的页面当一个百度浏览器
执行一个脚本的时候会检查这个脚本是属于哪个页面的，即检查是否同源，只有和百度同源的脚本才会被执行。

下面介绍5种解决跨域的方法

1. 通过jsonp跨域

利用页面上可以引入不同域上的js脚本文件。步骤如下：
1. 浏览器端注册callback回调函数。
2. 然后动态生成一个 script 标签，src 为：请求资源的地址＋获取函数的字段名＋回调函数名称。
3. 让服务端拿到回调函数名称，填充数据返回一段js代码给浏览器
4. 浏览器执行
具体代码：

function resolveJosn(result) { //浏览器端代码
    console.log(result.name);
}
var jsonpScript= document.createElement("script");
jsonpScript.type = "text/javascript";
jsonpScript.src = "http://www.qiute.com?    
callbackName=resolveJson";
document.getElementsByTagName("head")[0].appendChild(jsonpScript);

php //服务器端代码
 "alsy", "age" => "20"); // 要请求的数据
    echo $callback."(". json_encode($arr) .");"; // 输出
?>

2. 通过修改document.domain来跨子域（iframe）

特点：这两个域名必须属于同一个基础域名!而且所用的协议，端口都要一致。
使用方法：document.domain 的设置是有限制的，我们只能把 document.domain 设置成自身或更高一级的父域，且主域必须相同。例如：a.b.example.com 中某个文档的 document.domain 可以设成a.b.example.com、b.example.com、example.com中的任意一个，但是不可以设成c.a.b.example.com,因为这是当前域的子域，也不可以设成baidu.com,因为主域已经不相同了。
具体代码：
// 主页面：http://blog.qiutc.me/a.html

4.frame+跨文档消息传递

window.postMessage(message,targetOrigin) 方法是html5新引进的特性，可以使用它来向其它的window对象发送消息，无论这个window对象是属于同源或不同源.
步骤：

1. 调用postMessage方法的window对象是指要接收消息的那一个window对象，该方法的第一个参数message为要发送的消息，类型只能为字符串；第二个参数targetOrigin用来限定接收消息的那个window对象所在的域，如果不想限定域，可以使用通配符 * 。

2. 需要接收消息的window对象，可是通过监听自身的message事件来获取传过来的消息，消息内容储存在该事件对象的data属性中。

   // 主页面 blog.qiutc.com