如何使用来自另一个域的脚本向父窗口发送消息？

Question

我正在构建一项服务，您可以使用一行 JavaScript 代码将其植入您的网站 - 就像 Facebook 的按钮一样思考一样。

所以我将代码添加到random.com，并且该代码是从加载的mysite.com/js.js。

如果用户未登录，为了安全起见，我不想让他们通过 iframe 登录 - 我打开一个他们可以登录的窗口。当他们成功登录时，我需要父窗口来获取新的XSRF令牌。所以我需要能够告诉父窗口这样做。

我在 iframe 中进行了其他操作，但是当我在窗口中尝试使用以下代码时：

window.parent.postMessage('message', '*');

什么都没发生。如果我将 更改*为random.com，我会收到此错误：

无法将消息发布到http://random.com。收件人来源为https://mysite.com

我认为这必须是，因为添加监听器的脚本：

$(window).bind('message', myfunction);

它实际上位于 mysite.com 的脚本中。

但奇怪的是，当 iframe 调用完全相同的脚本时，它可以完美地工作！iframe 也将 targetOrigin 设置为random.com（这会导致上面的安全错误）来调用它。

Answer 1

window.parent仅适用于 iframe 并window.opener适用于单独的窗口。

最重要的是，因为我试图向父窗口发送消息，但新窗口是由该窗口中的 iframe 打开的。

所以window.opener到达了 iframe - 然后我必须实际将消息发送给它的父级：

window.opener.parent.postMessage(etc, etc);