web-dev-qa-db-ja.com

ドメイン間でwindow.postMessageをどのように使用しますか？

window.postMessage のポイントは、異なるドメインでホストされているウィンドウ/フレーム間の安全な通信を許可することのようですが、実際にはallowChromeで。

シナリオは次のとおりです。

  1. <iframe>を埋め込む（ドメインBにsrc付き）*）ドメインAのページ
  2. <iframe>は、ほとんどが<script>タグであり、最後に実行されます...
  3. Window.postMessage（some_data、page_on_A）を呼び出します

<iframe>はドメインBのコンテキストに最も確実にあり、その<iframe>に埋め込まれたjavascriptが適切に実行され、postMessageを正しい値で呼び出すことを確認しました。

Chromeで次のエラーメッセージが表示されます。

Aにメッセージを投稿できません。受信者のオリジンB。

Aのページにメッセージイベントリスナーを登録するコードは次のとおりです。

window.addEventListener(
  "message",
  function (event) {
    // Do something
  },
  false);

window.postMessage(some_data, '*')の呼び出しも試みましたが、それはエラーを抑制することだけです。

私はここでポイントを逃していますか、window.postMessage（...）はこれを意図していませんか？それとも私はそれを恐ろしく間違っているだけですか？

* MIMEタイプのtext/html。これはそのままにしておく必要があります。

javascripthtml5google-chromexss
80
Kevin Montrose

Chrome 5.0.375.125で機能する例を次に示します。

ページB（iframeコンテンツ）：

<html>
    <head></head>
    <body>
        <script>
            top.postMessage('hello', 'A');
        </script>
    </body>
</html>

ここでtop.postMessageではなくparent.postMessageまたはwindow.postMessageの使用に注意してください

ページA：

<html>
<head></head>
<body>
    <iframe src="B"></iframe>
    <script>
        window.addEventListener( "message",
          function (e) {
                if(e.Origin !== 'B'){ return; } 
                alert(e.data);
          },
          false);
    </script>
</body>
</html>

AとBはhttp://domain.comのようなものでなければなりません

編集：

別の質問 から、postMessageが正しく機能するには、ドメイン（ここではAとB）に/が必要であるように見えます。

75
Mic

ロード後、フレームから親にメッセージを投稿する必要があります。

フレームスクリプト：

$(document).ready(function() {
    window.parent.postMessage("I'm loaded", "*");
});

そして、親でそれを聞いてください：

function listenMessage(msg) {
    alert(msg);
}

if (window.addEventListener) {
    window.addEventListener("message", listenMessage, false);
} else {
    window.attachEvent("onmessage", listenMessage);
}

詳細については、このリンクを使用してください： http://en.wikipedia.org/wiki/Web_Messaging

21
Golyo

おそらく、mydomain.comからwww.mydomain.comにデータを送信するか、逆に送信しようとします。「www」を見逃していることに注意してください。 http://mydomain.com および http://www.mydomain.com は、javascriptとは異なるドメインです。

2
Getoriks