2

iframes次のようにネストされたかなり複雑なページを管理する必要があるプラグインを開発しています。

page.html
<body>
 <iframe A>
  <iframe B>
   <div bla></div>
  </iframe>
 </iframe>
 <iframe C>
   <div foo></div>
 </iframe>
</body>

プラグインは複数のインスタンスで実行されます (メイン ページに 1 つ、iFrame ごとに 1 つ)。インスタンスについてrootiFrame に通知するために、次のように iFrame を生成するときに、ルート URL をパラメーターとして渡します。

 ...
 newHTML = document.createElement("iframe");
 newHTML.setAttribute("src", options.src + "?" + priv.encodeURI(rootPath));

したがって、iFrame は次のような URL で読み込まれます。

 http://www.path/to/iFrame.html?base=...encodeURI(window.location.href.of.root)

私の問題は、postMessageネストされた iFrame からルートに移動する必要があり、それを機能させることができないことです。これが私がやっていることです:

// sending a message
var adressArray = window.location.href.split("?");
options.src = options.src || adressArray[0];
window.postMessage(options, options.src);

// receiving
window.addEventListener("message", receiveMessage, false);

function receiveMessage(event) {
  console.log(event.data);
  console.log(event.origin);
  console.log(window);
}

私の問題は、呼び出しとリスナーの両方が同じプラグインにありますが、プラグインの異なるインスタンスでリッスンする必要があることです。したがって、postmessageたとえばのインスタンスによって起動され、インスタンスframe Bのリスナーpage.htmlがメッセージを検出する必要があります。

targetOriginプロパティは、postMessage の送信先を指定するためのものだと思いました。代わりに、投稿 iFrame ( B ) の URL を送信することになります。これは、それをリッスンする page.html インスタンスではなく、親 iFrame ( A ) によって記録されます。

質問:
postMessage を 2 つ (または任意の数) の親に渡って送信することはできますか? iFrame Bのインスタンスがpage.htmlのインスタンスに「こんにちは」と言いたいとしpostMessageます。すべての iFrame で「ルート インスタンス URL」を使用できる場合、 を使用してこれを行うにはどうすればよいでしょうか?

ありがとう!

質問:

4

1 に答える 1

2

window.top一番上のウィンドウ要素を返すので、私の友達のようです。

メッセージを投稿すると:

var top = window.top;
top.postMessage("foo", currentFrameUrl);

それは正しく動作しています。

ただし、クロスドメイン iFrame ではwindow.top確実に機能しないため、引き続き URL を渡します...

于 2013-05-28T17:19:10.653 に答える