javascript - 如何将消息发布到同级 iFrame

Question

我正在寻找一种在父页面中没有任何 javascript 的情况下将消息发布到同级 iFrame 的方法。我遇到的困难是试图从第一个 iFrame 获取另一个 iFrame 的窗口对象

页面布局如下:

html body (http://host.com/)
  iFrame#a (http://me.com/a)
  iFrame#b (http://me.com/b)

从 iFrame#a 我正在尝试做:

(iFrame#b window).postMessage(...)

问题是我不知道如何从 iFrame#a 中获取 iFrame#b 的窗口对象。 parent.getElementById()等函数受XSS限制。在上面的示例中，我只想向父页面上来 self 的域 http://me.com/ 的所有其他 iFrame 发送一个 postMessage。

Answer 1

虽然确实不可能与另一个域上的另一个窗口/iframe 交互，但是可以获取对此类窗口/iframe 和所有嵌入的子 iframe 的引用进入该窗口/iframe。实现的方法是使用window.top.frames(访问顶部窗口对象)或window.parent.frames(访问直接父窗口对象，而可能还有其他更高级别的祖先)。无需使用 getElementById 或其他与 DOM 相关的函数。有关更多信息，请参见:https://developer.mozilla.org/en-US/docs/DOM/window.frames

window.frames 属性返回一个类似数组的对象，然后您可以对其进行迭代并在每个 iframe 上执行 postMessage。这不会触发同源限制，因为除了在它们上使用 postMessage 之外，您不会以任何方式与任何窗口进行交互。由于您想在特定域的每个 iframe 上执行 postMessage，您可以这样做:

var frames = window.parent.frames;
for (var i = 0; i < frames.length; i++) { 
  frames[i].postMessage("hello", targetDomain);
}