iframe跨域通信
众所周知,由于前端javascript对跨域访问做了安全限制,javascript只能访问与包含它的文档在同一域下的内容。
用法举例:
需求是在中通过iframe方式嵌入,而在iframe页面中希望通过点击一个按钮,调用top页面的一个js方法。
代码如下:
2. 在中嵌入iframe
代码如下:
3. 建立域下建立一个代理页面用于跨域通信使用
4. 在加入用于代理页面的逻辑
代码如下:
fig = {url:'http://www.demo.org/proxy.html'};
6. 通过kissy加载通信模块
代码如下:
代码
});
7. 在通过TopProxy.call直接访问中的方法,如
rush:js;">
KISSY.use('topproxy',TopProxy){
TopProxy.call('testFun','这是一个真实的故事');
});
其中call方法的第一个参数是外部网页的全局方法名,支持“.”,后面参数无限个,均传到目标方法里去。
注:
1. 调用后可能不会立即执行,会等到iframe加载完毕后才触发,如果想预加载可以提前执行一个没用的方法。 2. 如果不设置TopProxyConfig,那么会认为引用iframe和父iframe同域(大域)并直接调用top对象。 3. 在IE678下可能直接调用top中的系统方法会报错,由于系统方法不支持apply。
原理:
A页面嵌日的iframe页面B,其中B想调用A的方法并传递数据,那么可在B中嵌入A页面同域下的一个iframe页面C,C可以通过window.top访问到A的window。那么在B中可以改变C的href的hash向C传递一些信息,然后C再把这些信息传递给A,从而间接达到B给A传递信息的目的
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。