如何用opener hack方式实现IE6,7完美跨域
分享 2012.03.23 浏览次数:16226次
有时我们做一个项目时,有需要跨域请求和处理一些大数据量得数据,对于服务端提交的数据非常的之大,get的URL长度限制满足不了需求,又由于跨域的影响,一直很头痛数据传输的问题。于是乎,上网搜了搜一些跨域的解决方案,无非了iframe嵌iframe,通过window.name或者hash,做跳板,都受到url长度的限制,不是很理想。我们都知道在HTML5中,提供了一种postMessage的消息机制,可以在不同域的页面上,互相通过window.postMessage(datastring,’limitDomain’)的方式传递消息。在需要触发的页面注册onMessage事件,event的data属性就是传递datastring文本。再配合老道的JSON.parse就可以完美的传递json格式的对象了。可惜的是目前PostMessage只在IE8,FF和Chrome现版本提供了实现。对于老版本的IE6,7没有提供实现。
于是在google搜索的时候,无意中发现某高人的Blog提供了一种称之为IE6,7 opener hack的方式实现跨域,据说是google的工程师率先发现的这个bug,fackbook的登陆页面就是利用了这个bug实现了postMessage的跨域。
可惜,google了半天,详细资料基本找不到,也没有找到一个具体的例子,于是自己捣鼓了一下,写了个例子,放上来。
下面我们来看下,如何利用这个bug的例子
hosts配置
   1: 127.0.0.1    www.a.com
   2: 127.0.0.1    www.b.com
test.htm
1:<html>
2:<body>
3:<iframeid="a"src="http://www.b.com/test1.htm">iframe>
   4:<script>
1:
   2:var i=document.getElementById('a');
   3: i.contentWindow.opener={
   4:     dd:function(str){
   5:var div=document.createElement('div');
   6:         document.body.appendChild(div);
   7:         div.innerHTML=str;
   8:     }
   9: }
  10: setTimeout(function(){
  11:     opener.bb('bbbbbbb');
  12: },300)
  13:
script>
   5:body>
   6:html>
test1.htm
   1:<html>
   2:<body>
   3:
   4:<script>
1:
   2:     window.opener.dd('aaaaaaaaa');
   3:     parent.opener={
   4:         bb:function(str){
   5:var div=document.createElement('div');
   6:             document.body.appendChild(div);
   7:             div.innerHTML=str;
   8:         }
   9:     }
script>
   5:body>
   6:
   7:html>
我们可以看到,在IE6,7下,只要重置了window对象的opener为一个{}对象,在父页面设置了iframe的window.opener为一个{}之后,在iframe里面就可以通过opener调用parent的方法,在iframe重置parent.opener为一个{}对象之后,在parent就可以调用iframe的方法。
*还有一种说法是可以设置opener为function(){},通过new opener()来调用
总结,通过IE6,7的hack,我们可以比较完美的实现postMessage在各大主流浏览器的兼容,以后跨域又多了一项利器。不过比较遗憾的事,重置opener之后,对于window.open打开的窗口,就不能很好的操作了。
杭州网站建设 相关阅读:Chrome浏览器全球份额首次超过IE 但仅保持一天
- PREV:分享一个可以让DIV实现居中齐的方法
- NEXT:我们怎么去看待企业网站推广
- 
                            铸就企业线上高端形象,就选杭州高端网站制作
                            日期:2025-08-11浏览次数:9696次 
- 
                            杭州网站建设是打造企业数字化转型的坚实基石
                            日期:2025-08-11浏览次数:9905次 
- 
                            杭州网站设计:打造卓越品牌与用户体验的关键
                            日期:2025-08-11浏览次数:9625次 
- 
                            杭州网站建设:打造企业数字化转型的坚实基石
                            日期:2025-08-11浏览次数:9394次 
- 
                            杭州网站设计公司解析:企业网站建设的完整流程
                            日期:2025-07-25浏览次数:9613次 
相关新闻
整合同类新闻,相关新闻一手掌握
- 
                            服饰APP开发能给服饰行业带来什么?
                            日期:2021-02-05浏览次数:9256次 
最新新闻
与互联网同行,实时掌握网建行业最新动态
- 
                            消息称谷歌已投资25亿美元收购Groupon
                            日期:2010-11-30浏览次数:15871次 
- 
                            做网站找个人?十大重要缺陷解析
                            日期:2016-11-29浏览次数:12548次 
- 
                            杭州珠宝首饰网站建设流程
                            日期:2018-06-14浏览次数:12624次 
- 
                            传统教育机构如何制定营销推广方案?
                            日期:2019-11-06浏览次数:12497次 
- 
                            杭州高端网站制作,应该怎样优化图像?
                            日期:2020-08-05浏览次数:12237次 
随机新闻
新闻新动态,您需要的新闻管家
洞悉市场趋势演变让传播回归社会
免费获取网站建设与网络推广方案报价
- 
                关于我们杭州帷拓科技有限公司,是一家新型的全案网络开发公司,作为以互联网高端网站建设、APP开发、小程序开发为核心的专业网络技术服务供应商,帷拓科技致力于全面分析市场环境、衡量与预测市场需求、整合区别于行业竞争对手的绝对优势,结合品牌理念深度挖掘项目优势和产品价值,提升客户品牌认知、认可度。 
- 
                我们的客户帷拓科技历经十年沉淀,与国内外上千家客户达成合作关系,其中稳定合作的公司有:浙江华为、浙江移动、浙江5G产业联盟、浙江省社科院、绿城足球俱乐部、娃哈哈双语学校、健康中国杭州峰会、科雷机电等,帷拓科技始终坚持“帷有专业,才能拓展无限”的服务理念,坚持“认真坚持细节”的优质服务理念,不断完善自身,成就企业,最终实现共赢。 
- 
                我们的业务帷拓科技主营业务范围包含互联网高端网站建设、APP开发、小程序开发、商城网站建设、公众号运营以及数字营销等,涵盖了服务、房产、数码、服装、物流贸易等行业,根据品牌现状,为每个客户量身定制项目整体服务方案,以敏锐的市场洞察力、创新的市场策划能力,全面把握市场变化,为客户实现从企业到消费者的价值转换。 
 
             
             
             
             
             
            