两个Iframe正在通信：SecurityError

Question

我有两个iframe。这些iframe通过postMessage进行通信。

从一个iframe，如果我执行以下操作，则无法正常工作。

// Broadcast to all iframes.
parent.frames.forEach(function (frame) {
  frame.postMessage(data, 'http://localhost:4000');
});

错误：

  

Uncaught SecurityError：阻止了一个包含起源的框架＆＃34; http：//..."从访问带有起源的框架＆＃34; http：//..."。协议，域和端口必须匹配。

但是，如果我执行以下操作，则效果非常好。没有错误消息。为什么？

for (var i = 0 ; i < parent.frames.length ; ++i) {
  parent.frames[i].postMessage(data, 'http://localhost:4000');
}

Answer 1

这里的问题看起来像是

  

为什么parent.frames.forEach在for中迭代它们时会给出 SecurityError ？

这是因为parent.frames 不是数组 ，而是 Window 实例，因此，当您尝试访问{{ 1}}，它正在寻找安全性阻止访问的 Window 上的属性。

来自window.frames的MDN页面（.forEach是窗口）

  

返回窗口本身，这是一个类似数组的对象，列出了当前窗口的直接子帧。

如果您想使用parent，请从（参考）阵列原型中取出

.forEach