4

ここで何かが間違っていると確信していますが、指を置くことはできません...ここの例は、コンソールに通知やエラーがなくても問題なく動作するため、ブラウザーが html5 によるクロスドメインメッセージングをサポートしていることを意味します (のもちろんそうです、それはChrome 14です..)。

私のコードは多かれ少なかれ次のことを行います: WebsiteA.com にロードされたスクリプトが iframe を作成し、それを WebsiteA.com のドキュメントに追加します。追加されたフレームには WebsiteB.com が含まれており、読み込まれると、その親である WebsiteA.com にメッセージを送信して、WebsiteB.com が JSON を受信する準備ができていることを通知する必要があります。WebsiteA.com がこのメッセージを受け取ると、JSON を返します。

</body>したがって、 WebsiteA.com には次のような行が直前にあり、 の<script scr="http://WebsiteB.com/load-my-iframe.js" type="text/javascript"></script>load-my-iframe.jsに次の行があります。

var child = document.createElement('iframe');
child.src = 'http://WebsiteB.com/child.html';

var body = document.getElementsByTagName('body')[0]
body.appendChild(child);

var SomeJSON = {"something" : "that WebsiteB should have"};

window.onmessage = function (e) {
    if (e.origin === 'http://WebsiteB.com' && e.data === 'ready') {
            e.source.postMessage(SomeJSON, 'http://WebsiteB.com');
    }
}

これで iframe 要素が作成され、それが WebsiteA.com のドキュメントに追加され、準備ができたと通知されるのを待ちます (おそらく...)。srcWebsiteB.com には、WebsiteA.com のドキュメントに読み込まれた iframeのファイル child.html があり、そのファイルには次の内容が含まれています。

<!DOCTYPE html>
<html lang="pt">
    <head>
        <title>WebsiteB.com</title>
        <script type="text/javascript">
            window.onload = function () {
                window.parent.postMessage('ready','*');
            }

            window.addEventListener('message', receiveMessage, false);
            function receiveMessage(event) {
                if (event.data.something === "that WebsiteB should have") {
                    document.write('It worked!');
                }
            }
        </script>
    </head>
    <body>
    </body>
</html>

そして今、奇妙なもの:

悲しいことに、私は WebsiteA.com と WebsiteB.com を所有していませんが、これを 1 つのトップ レベル ドメインとサブドメイン (.no.de で終わる) の間で機能させることができました。それは本当にうまくいきますが、Google Chrome 14 のコンソールではクラシックが表示されます。html5demosの例は、このエラーなしで問題なく動作します。Unsafe JavaScript attempt to access frame with URL http://WebsiteA.com/ from frame with URL http://WebsiteB.com/child.html. Domains, protocols and ports must match.

このエラーが発生する理由と、それを取り除く方法を教えてください。

4

2 に答える 2

1

私はあなたのコードを試しましたが、これはChromeで機能するようです。jsfiddleとjsbinを使用して、親ウィンドウと子ウィンドウの間でメッセージを渡します。

http://jsbin.com/oxesef/4/edit#preview

于 2011-10-04T21:10:51.337 に答える
0

これは答えではありませんが、あなたを助けることができます。

そのような問題を避けるためにhttp://easyxdm.net/wp/を使用しています。

カール

于 2011-10-04T21:06:51.563 に答える