注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

技术行者

时代的车轮在按照摩尔定律滚动。

 
 
 

日志

 
 

跨域访问的解决方式  

2012-09-18 11:17:00|  分类: javascript |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

即域名、协议、端口,三者中若有一个不相同,则会出现跨域问题。

--------------------------------------------------------------------------------

解决方法:

1、设置document.domain属性(适合同一主域下不同子域间的通信)

对于主域相同而子域不同的情况(上述表格6),可以通过修改document的domain属性来解决。由于同源策略认为域和子域隶属于不同的域,那么我们

无法在a.com/a.js中访问kpm.a.com/b.js。可以在a.js中设置document.domain=a.com,此时浏览器就会认为它们处于同一个域下,这样两个文件之

间就可以正常通信了。

2、window.name方式(适合单向的数据请求)

window.name属性是一个很特别的属性,当该window的location变化,然后重新加载,name属性可以依然保持不变。所以我们可以在页面 a.html中

用iframe加载b.html,在b.html中用JavaScript把需要传递的数据赋值给window.name,iframe加载完成之后,在a.html修改iframe的地址,将其变成

代理文件proxy.html(proxy.html与a.html在同一个域名下,可以通信),然后就可以读出window.name的值了。
function crossDomain() {
    var data = '';   

    var iframe = document.createElement('iframe');
    iframe.style.display = 'none';    

    document.body.appendChild(iframe);

    var _load = function() {
           try{
                   data = iframe.contentWindow.name;
            }catch(e) {
                    iframe.contentWindow.location= 'http://www.a.com/proxy.html';
            }
           if(iframe.attachEvent) { 

                    iframe.attachEvent('onload', _load);
            } else {
                    iframe.onload = _load;
            }
            iframe.src = 'http://www.b.com/b.html';

        //为不让其他域的js访问name,最后销毁iframe

            iframe.contentWindow.document.write('');
            iframe.contentWindow.close();
            document.body.removeChild(iframe);

        return data;

};

3、动态创建js(只能加载js文件)

script标签本身就可以访问其它域的资源,不受浏览器同源策略的限制,可以通过在页面动态创建script标签,代码如下: 

        var script = document.createElement('script');  
        script.src = "XXX";  
        document.body.appendChild(script);  

这样通过动态创建script标签就可以加载其它域的js文件,然后通过本页面就可以调用加载后js文件的函数。缺陷是不能加

载其它域的文档,只能是js文件。

4、使用HTML5的window.postMessage(很酷的新技术)

window.postMessage是HTML5定义的一个很新的方法,使用它可以很方便地进行跨文档消息传输Cross Document Messaging。

语法:

otherWindow.postMessage(message, targetOrigin);
· message:作为postMessage()第一个参数传入的字符串数据。
· targetOrigin:发送消息的文档所在的域,例如"http://www.a.com"

发送消息方:iframe.contentWindow.postMessage('Hello lynnelv');

消息接收方:

window.addEventListener("message", function(event) {  

        if (event.origin == "http://www.a.com"){     //确保发送消息的域是已知的域
                processMessage(event.data);    //处理接收到的数据

        }

});


  评论这张
 
阅读(376)| 评论(1)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017