从跨网域的iframe与窗口进行通信

Question

假设我有一个域名为a.example.com的网页，而该iframe的域名为b.example.com （不满足相同的原始政策）。

现在，我从具有相同域（即b.example.com）的iframe中使用window.open打开一个新窗口。

我的任务是将邮件发送回iframe。

window.opener对于打开的窗口是空的。

我读到可以使用postMessage进行通信，但是应该将数据发布到哪个元素。 如何获取父窗口（即iframe）的引用。

Answer 1

谁说iframe是您的？ 在这方面，浏览器无法信任您，因为有人可能会弄乱您的页面并加载其他内容，因此现代浏览器将iframe通讯完全锁定。 即使使用访问控制，也不会实现双向通信。

但是，如果可以使iframe和所属文档“说相同的语言”，则可以使用postMessage通信：postMessage基本上将字符串（并且仅字符串，因此所有JS对象都需要JSON.stringified）发布为“可见”给所有人”一堆字符串。 任何文档上下文都可以发布消息，并且每个上下文都可以决定侦听是否发布了新消息。 如果是这样，则可以使iframe发送拥有窗口可以解析的消息，反之亦然。

Answer 2

为了使他们的网站（其中包含您控制内容的iframe能够从通过单击内容中打开的窗口打开的窗口中获取信息，他们必须允许访问自己网站上的内容。 如果您只想从通过单击您控制的页面上的某个东西打开的窗口中获取数据，例如：

var newWindow = open('yourURL.php');
var someElement = newWindow.document.getElementById('someId');
console.log(someElement.value); // assuming it's an input

如果您希望从打开新页面的页面获取信息而不是新打开的窗口，则如下所示：

var openerElement = opener.document.getElementById('openerWindowId');
console.log(openerElement.innerHTML); // assuming it's not an input