跨域？他是浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。所谓同源是指：域名、协议、端口均相同。
解决
方式一：script标签实现跨域（jsonp）
原理：利用标签具有可跨域的特性，可实现跨域访问接口，需要后端的支持。
var messagetow = function(data){
alert(data); //后端返回的json格式的数据
};
var url = "http://192.168.31.137/train/test/jsonpthree?callback=messagetow";
var script = document.createElement('script');
script.setAttribute('src', url);
document.getElementsByTagName('head')[0].appendChild(script);
服务器在收到请求后，解析参数，计算返还数据，输出messagetow（data）字符串。
缺点：只能发送get请求，无法访问服务器的响应文本（单向请求），即只能获取数据不能改数据。
方式二：ajax的jsonp跨域（jsonp）
通过ajax请求不同域的实现，底层不是靠XmlHttpRequest而是script，所以不要被这个方法给迷惑了。
在ajax请求中类型如果是type是get post，其实内部都只会用get，因为其跨域的原理就是用的动态加载script的src，所以我们只能把参数通过url的方式传递
$.ajax({
url:' http://192.168.31.137/train/test/jsonpthree', //不同的域
type: 'GET', //jsonp模式只有GET是合法的
dataType: 'jsonp', //数据类型
jsonp: 'callback', //指定回调函数名，与服务器端接收的一致，并回传回来
jsonpCallback:' messagetow ',
success:function(data){
alert(data.price);
},
error:funciton(){
}
})
其实jquery内部会转化成
http://192.168.31.137/train/test/jsonpthree?callback=messagetow
然后动态加载http://192.168.1.114/yii/demos/test.php?backfunc=jQuery2030038573939353227615_1402643146875&action=aaron">
http://192.168.1.114/yii/demos/test.php?backfunc=jQuery2030038573939353227615_1402643146875&action=aaron"><script type="text/javascript" src="http://192.168.31.137/train/test/jsonpthree?callback=messagetow"></script>
http://192.168.1.114/yii/demos/test.php?backfunc=jQuery2030038573939353227615_1402643146875&action=aaron">
http://192.168.1.114/yii/demos/test.php?backfunc=jQuery2030038573939353227615_1402643146875&action=aaron">
方式三：CORS
Cross-Origin Resource Sharing（CORS）跨域资源共享是一份浏览器技术的规范，提供了 Web 服务从不同域传来沙盒脚本的方法，以避开浏览器的同源策略，确保安全的跨域数据传输。现代浏览器使用CORS在API容器如XMLHttpRequest来减少HTTP请求的风险来源。与 JSONP 不同，CORS 除了 GET 要求方法以外也支持其他的 HTTP 要求。服务器一般需要增加如下响应头的一种或几种：
Access-Control-Allow-Origin:*
Access-Control-Allow-Methods:POST, GET, OPTIONS
Access-Control-Allow-Headers:X-PINGOTHER, Content-Type
Access-Control-Max-Age:86400
跨域请求默认不会携带Cookie信息，如果需要携带，请配置下述参数：
"Access-Control-Allow-Credentials":true//Ajax设置
"withCredentials":true
方式四：window.name+iframe
window.name通过在iframe（一般动态创建i）中加载跨域HTML文件来起作用。然后，HTML文件将传递给请求者的字符串内容赋值给window.name。然后，请求者可以检索window.name值作为响应。
iframe标签的跨域能力；
window.name属性值在文档刷新后依旧存在的能力（且最大允许2M左右）。
每个iframe都有包裹它的window，而这个window是top window的子窗口。contentWindow属性返回<iframe>元素的Window对象。你可以使用这个Window对象来访问iframe的文档及其内部DOM。
方式五：window.postMessage()
HTML5新特性，可以用来向其他所有的 window 对象发送消息。需要注意的是我们必须要保证所有的脚本执行完才发送 MessageEvent，如果在函数执行的过程中调用了它，就会让后面的函数超时无法执行。
方式六：修改document.domain跨子域
前提条件：这两个域名必须属于同一个基础域名!而且所用的协议，端口都要一致，否则无法利用document.domain进行跨域，所以只能跨子域
在根域范围内，允许把domain属性的值设置为它的上一级域。例如，在”aaa.xxx.com”域内，可以把domain设置为 “xxx.com” 但不能设置为 “xxx.org” 或者”com”。
现在存在两个域名aaa.xxx.com和bbb.xxx.com。在aaa下嵌入bbb的页面，由于其document.name不一致，无法在aaa下操作bbb的js。可以在aaa和bbb下通过js将document.name = 'xxx.com';设置一致，来达到互相访问的作用。
方式七：WebSocket
WebSocket protocol 是HTML5一种新的协议。它实现了浏览器与服务器全双工通信，同时允许跨域通讯，是server push技术的一种很棒的实现。相关文章，请查看：WebSocket、WebSocket-SockJS
**需要注意：**WebSocket对象不支持DOM 2级事件侦听器，必须使用DOM 0级语法分别定义各个事件。
方式八：代理
同源策略是针对浏览器端进行的限制，可以通过服务器端来解决该问题,例如nginx
DomainA客户端（浏览器） ==> DomainA服务器 ==> DomainB服务器 ==> DomainA客户端（浏览器）
网友评论