跨域问题的解决策略

跨域:同源策略的限制
 
我知道有三种方式:
第一种: jsonp(json+padding):实现原理是利用script标签的src属性可以跨域加载别的域中的文件来实现的
假设有一个a.com和b.com,现在a.com想访问b.com,在a.com中的一个网页中加入下面的代码:
<script>
function aaa(data){
//对data进行相应的操作
}
</script>
<script src="http://www.b.com/test.php?name=lisi&callback=aaa"></script>
 
在b.com中的test.php中可以接收传递过来的参数name还有callback,然后执行:
b.com中执行
echo 'callback(要回传给a.com的数据)'
 
第二种: iframe
在a.com中创建一个a.html,在b.com中创建一个b.html,再在a.com中创建c.html,a.html调用b.html,再在b.thml中调用c.html,最后在c.khtml中top.function
 
第三种: 服务器代理:因为服务器端程序是不存在跨域问题
 
还有,我听说过window.name, 还有cros跨资源共享,不过这个不太了解了。
 
 
跨域:
 
浏览器对于javascript的同源策略的限制,例如a.cn下面的js不能调用b.cn中的js,对象或数据(因为a.cn和b.cn是不同域),所以跨域就出现了.
 
 
同源策略:
 
请求的url地址,必须与浏览器上的url地址处于同域上,也就是域名,端口,协议相同.
 
比如:我在本地上的域名是study.cn,请求另外一个域名一段数据
 
jsonp:
 
    jsonp 全称是JSON with Padding,是为了解决跨域请求资源而产生的解决方案,是一种依靠开发人员创造出的一种非官方跨域数据交互协议。
 
    一个是描述信息的格式,一个是信息传递双方约定的方法。
 
    jsonp的产生:
 
    1.AJAX直接请求普通文件存在跨域无权限访问的问题,不管是静态页面也好.
 
    2.不过我们在调用js文件的时候又不受跨域影响,比如引入jquery框架的,或者是调用相片的时候
 
    3.凡是拥有scr这个属性的标签都可以跨域例如<script><img><iframe>
 
    4.如果想通过纯web端跨域访问数据只有一种可能,那就是把远程服务器上的数据装进js格式的文件里.
 
    5.而json又是一个轻量级的数据格式,还被js原生支持
 
    6.为了便于客户端使用数据,逐渐形成了一种非正式传输协议,人们把它称作JSONP,该协议的一个要点就是允许用户传递一个callback 参数给服务端,
 
 
iframe跨域
 
    
    基于iframe实现的跨域要求两个域具有aa.xx.com,bb.xx.com 这种特点,
 
    也就是两个页面必须属于一个基础域(例如都是xxx.com),使用同一协议和同一端口,这样在两个页面中同时添加document.domain,就可以实现父页面调用子页面的函数
 
    要点就是 :通过修改document.domain来跨子域
 
 
服务器端跨域
 
    因为服务器端程序是不存在跨域问题
 
    也是利用src加载跨域的文件
 
 
使用HTML5中window.postMessage方法
 
    window.postMessage(message,targetOrigin) 方法是html5新引进的特性,可以使用它来向其它的window对象发送消息,无论这个window对象是属于同源或不同源,目前IE8+、FireFox、Chrome、Opera等浏览器都已经支持window.postMessage方法。
 
    调用postMessage方法的window对象是指要接收消息的那一个window对象,该方法的第一个参数message为要发送的消息,类型只能为字符串;第二个参数targetOrigin用来限定接收消息的那个window对象所在的域,如果不想限定域,可以使用通配符 * 。
 
    需要接收消息的window对象,可是通过监听自身的message事件来获取传过来的消息,消息内容储存在该事件对象的data属性中。
 
    上面所说的向其他window对象发送消息,其实就是指一个页面有几个框架的那种情况,因为每一个框架都有一个window对象。在讨论第二种方法的时候,我们说过,不同域的框架间是可以获取到对方的window对象的,而且也可以使用window.postMessage这个方法。
 
 
使用window.name来进行跨域
 
    window对象有个name属性,该属性有个特征:即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的,每个页面对window.name都有读写的权限,window.name是持久存在一个窗口载入过的所有页面中的,并不会因新页面的载入而进行重置。
 
 
cros跨域资源共享
 
http头加 Access-Control-Allow-Origin字段
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

原文地址:https://www.cnblogs.com/limengyao/p/8604386.html