通过window.name可以实现跨域数据传输。
要解决的功能: www.a.com/a.html 需要获取到 www.b.com/b.html页面内容的数据
需要3个页面
- www.a.com/a.html 应用程序页面
- www.b.com/b.html 数据页面, a.com/a.html需要从这页面获取数据.
- www.a.com/c.html 代理页面
原理: www.a.com/a.html 中通过javascript创建iframe,并将location指向 www.b.com/b.com,并监听iframe的dom onload,加载完毕后修改location指向www.a.com/c.html
实现步骤
1. www.a.com/a.html 的head元素中一段javascript代码
<script type="text/javascript">
var state = 0;
iframe = document.createElement("iframe");
loadfn = function () {
if (state === 1) {
var data = iframe.contentWindow.name;
alert(data);
//下面还可以加入获取数据后,移除iframe,释放内存的代码
iframe.contentWindow.document.write(''); iframe.contentWindow.close(); document.body.removeChild(iframe);
} else if (state === 0) {
state = 1;
iframe.contentWindow.location = "WebForm2.aspx";
}
};
iframe.src = 'http://b.com/data.html';
if (iframe.attachEvent) {
iframe.attachEvent('onload', loadfn);
} else {
iframe.onload = loadfn;
}
document.body.appendChild(iframe);
</script>
2. www.b.com/b.html 设置数据
<script type=”text/javascript” >
window.name=”xxxxx”;
//xxxxx就是要传输的数据。将数据放到window.name中供不同域的web程序使用; 数据大小限制不同浏览器要求不同 ie ,firefox貌似为32m,其余为2m好像 ,类型可为json,字符串
</script>
3. www.a.com/c.html 不需要有任何代码