メッセージを送信するウィンドウ オブジェクトであるMessageEvent
hasプロパティを知っています。source
この情報をどのようにして、メイン ドキュメント (そしてもちろんメッセージ到着時のメイン ドキュメント内) のどの iframe がその特定のメッセージのソースであったかを確認しますか? location.href
ウィンドウオブジェクトをチェックしてevent.source
から、すべてのiframeをループしてどれが一致しているかをチェックする唯一のオプションはありますか? メイン ドキュメントに同じソース URL を持つ iframe がある場合はどうなりますか?
3 に答える
ページ上のすべての iframe を繰り返し処理し、それらのwindow
オブジェクトの ID 比較を行います。
window.addEventListener('message', function(e) {
if(e.origin === 'https://www.example.com') {
var iframes = document.getElementsByTagName('iframe');
for(var i = 0; i < iframes.length; i++) {
if(e.source === iframes[i].contentWindow) {
// Do stuff with iframes[i]
}
}
}
}
これは最新のすべてのブラウザーで機能すると思います。誰かがそれに問題を抱えているかどうか聞いてみたいです。
クロスドメイン iframe/windowのプロパティを読み込もうとlocation.href
すると、同一生成元ポリシーに違反するため、例外がスローされます。そのプロパティに書き込むことはできますが、読み取ることはできません。そして、それが機能したとしても、ご想像のとおり、同じ URL の問題を持つ複数の iframe で問題が発生します。
とにかく、あなたができることは - ある種のメッセージ送信確認のためのプロトコルを確立することです。つまり、メッセージ X を受信する iframe では、親ドキュメント内のすべての iframe を反復処理し、各 iframe に「メッセージ X を送ってくれましたか?」というメッセージを送信します。そして、そのような質問に応答するようにすべての iframe をプログラムします。もちろん、どの iframe がどのメッセージを送信したかを確認できるように、すべてのメッセージに一意の ID を添付する必要があります。
メッセージの受信者が送信者が誰であるかを知る必要がある理由と、その送信者への参照だけを知るだけでは不十分な理由を考える必要があると思います ( event.source
)? 送信者が知っている情報がある場合、送信者は最初にこの情報をメッセージで送信できます。
より効率的な方法は、開始時にそれぞれの iframe に一意の ID を渡し、親フレームにポストバックするときにその ID を使用するようにすることです。