为什么我的跨域postMessage仅在将“*”作为原点参数传递时才起作用？

Question

我正在使用2个localdomains localhost和domain1来测试来自两个域的iFrame的postMessaging系统。

我可以正确识别相应的window元素（在两个域上）以向其发送消息并接收回复。我的问题是，我的postMessage中发送的第二个参数（我发送消息的URL）不会被相应的其他域上的侦听器接受。只有当我声明发件人为"*"时，我的消息才有效。

这不能将消息发送到外部域：

 // targetWindow = window of foreign domain
 targetWindow.postMessage({
    "foo": "bar"
  }, window.location.href);

这有效：

 // targetWindow = window of foreign domain
 targetWindow.postMessage({
    "foo": "bar"
  }, "*");

回复发送域的回复相同（使用window.top）。这不起作用：

 window.top.postMessage({
  "baz": "bam"
}, window.location.href.split("?")[0]);

虽然这样做：

window.top.postMessage({
  "baz": "bam"
}, "*");

问题：
为什么会这样？我以为我必须提供 sending-url 作为第二个参数来启用身份验证。如果是这样，为什么我的事件不会触发？我之所以在localhost / domain1上工作吗？

感谢您的帮助！

Answer 1

第二个婴儿车是targetOrigin，这是一个安全限制，可以阻止您的邮件被截获。它应该设置为发送消息的窗口的域而不是它来自的窗口的域。

以下是使用iframe设置第二个字段的示例，该字段从iFrame中获取 src 值并将其切换为协议+域+端口。设置目标原点需要哪个。

var target = iframe.src.split('/').slice(0,3).join('/');
iframe.contentWindow.postMessage('foo', target);