首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Ajax >

网页插件开发小结(2) - Ajax和Iframe的跨域通信

2012-11-10 
网页插件开发总结(2) - Ajax和Iframe的跨域通信(二)Ajax和Iframe的跨域通信既然是网页插件,还用到了iframe

网页插件开发总结(2) - Ajax和Iframe的跨域通信
(二)Ajax和Iframe的跨域通信

既然是网页插件,还用到了iframe,自然会涉及到跨域的问题。其实跨域的问题有很多种解决方案,比如XDomainRequest,Crossdomain XHR,还有让人期待的HTML5,可惜这些目前很多主流浏览器都不支持。其实Ajax的跨域还是很好解决的,目前最常用的就是JSONP了,即使没有jQuery,用前一篇里的loadModule函数也可以进行简单的JSONP调用。

不过iframe的跨域问题就有点棘手了。因为插件是在第三方页面上的,而我们的iframe是在我们自己的域名下面的,因此如果iframe里的内容有所更新,我们无法直接从iframe内来通知页面以更新页面上的内容或是改变iframe大小。

不过我们从这篇文章里找到解决方法,文章里作者提出了下面这一个定义和四个法则。

parent.window.location.hash = “height=280”;
前者代码里的的srcUrl就是主窗口的URL;后者更方便,但有时在IE下面好像有问题,所以我们还是用的前者。

当然这个方法也有副作用,首先你需要去轮询,必然就会有延迟,而且会改变主窗口的URL(多一个Fragment)。不过对我们来说都还可接受。作者还提到了另外两个方法,都是通过第三个隐藏的iframe作为proxy来避免轮询和改变主窗口URL。一种是每次发送消息时就创建一个proxy iframe,发送完就关掉;另一种是只创建一个proxy iframe,并同过window.resize和监控resize事件来通知proxy iframe有新的消息。可惜这两个方法我们都没法用。因为它们都要求创建一个和主窗口在同一个域名下的iframe,再由此iframe内的JavaScript来传递消息给主窗口,而主窗口是第三方网页,其域名根本不在我们的控制范围内……当然在一定的情况下,这两种方法还是有用的,有兴趣的可以参考原文。

参考:
Cross-Domain Communication with IFrames
http://softwareas.com/cross-domain-communication-with-iframes

热点排行