用document.domain+iframe实现Ajax跨子域
Ajax跨域一向是个较量贫困的题目,譬喻:断桥残雪在一个项目中行使了open打开一个跟父窗口差异域名的新页面,功效子窗口就不能传值给父窗口了;再如:喂授www.2fool.cn下不行以获取love.2fool.cn域名下的页面内容。赏识器的跨域限定是为了安详,然则当我们想要在一个域名下哀求其它一个域名的内容的时辰就感受不那么爽了。 我在WordPress气候插件、滚滚API接口处理赏罚上都行使了JSONP的要领来实现的跨域。目前天我要通过行使JS的document.domain和iframe来办理Ajax跨子域的题目。 道理 通过给主页面跟哀求页面配置沟通的document.domain来,诱骗赏识器,到达Ajax跨子域的结果,此要领在IE,chrome,Firefox,Safari,Opera下测试通过。 弱点:无法实现差异主域名之间的通信。而且当在一个页面中还包括有其余的iframe时,会发生安详性非常,拒绝会见。 行使document.domain+iframe跨域实例 起首我们假设主页面地点为:http://www.js8.in/mywork/crossdomain/index.html,我们要加载的内容是位于work.2fool.cn域名下的helloworld.txt。我们必要在主页面中配置document.domain为2fool.cn,然后主页面添加一个iframe,src为域名work.2fool.cn下的一个url,在iframe页面中同样配置document.domain为2fool.cn,同时iframe中必要添加Ajax的函数,譬喻引入jQuery.js。 主页index.html的首要代码如下: Copy to Clipboard引用的内容:[www.veryhuo.com] <button onclick="crossDomain();">开始跨域</button><div id="ajax"></div> <iframe src="http://work.2fool.cn/crossdomain/iframe.html" id="iframe" style="display:none;"> </iframe> <script type="text/javascript"> document.domain = '2fool.cn'; function crossDomain(){ var iframe=document.getElementById('iframe').contentWindow.$; iframe.get("http://work.2fool.cn/crossdomain/helloworld.txt",function(data){ document.getElementById("ajax").innerHTML=data; }); } </script> iframe页面首要代码如下: Copy to Clipboard引用的内容:[www.veryhuo.com] <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript"> document.domain = '2fool.cn'; </script> 演示Demo:点击查察,演示下载 (编辑:河北网) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |