跨域iframe问题

Question

比方说我有一个名为example.com的网站,iframe嵌入了iframe.net域,现在我想读取iframe的内容并传递一些参数来显示文本消息.喜欢你用户名.

现在问题是这个无法在两者之间建立连接,甚至无法获得我使用的iframe的innerHTML

document.getElementById('myframe').contentWindow.document.body.innerHTML;

它抛出错误"权限被拒绝访问属性"

有谁知道如何在跨域平台上读写

Answer 1

如果您无法控制框架网站,则无法绕过跨域策略.

如果您可以控制两个站点,则可以使用该postMessage方法跨不同域传输数据.一个非常基本的例子:

// framed.htm:
window.onmessage = function(event) {
    event.source.postMessage(document.body.innerHTML, event.origin);
};

// Main page:
window.onmessage = function(event) {
    alert(event.data);
};

// Trigger:
// <iframe id="myframe" src="framed.htm"></iframe>
document.getElementById('myframe').contentWindow.postMessage('','*');

Answer 2

在Internet Explorer 8 中，作为参数传递的事件可能为null，这就是您需要以不同方式访问事件的原因：

在frame.html 中：

window.onmessage = function(event) {
   var evt = event || window.event;
   evt.source.postMessage('Message from iFrame', evt.origin);
};

在main.html 上：

window.onmessage = function(event) {
   var evt = event || window.event;
   alert(evt.data);
};

该事件的触发方式与 Rob W 介绍的相同：

document.getElementById('frameId').contentWindow.postMessage('message','*');