6

このチュートリアルhttp://davidwalsh.name/window-postmessageに従い、Chrome と Firefox では機能するが IE 10 では機能しないクロスドメイン メッセージング スクリプトを作成しました。

1 つのサーバー (例: 192.168.15.223) -- 受信側

<script>
//listener
window.addEventListener('message',function(event) {
    if(event.origin !== 'http://120.0.0.211') return;
    document.getElementById('cc').innerHTML = event.data;
},false);

window.attachEvent('onmessage',function(event) {
    if(event.origin !== 'http://120.0.0.211') return;
    document.getElementById('cc').innerHTML = event.data;
},false);
</script>
<p>At 192.18.15.223 server</p>
<div id='cc'>Nothing received yet</div>

別のサーバー (例: 120.0.0.211) -- 送信者

<script>
//create popup window
var domain = 'http://192.18.15.223';
var myPopup = window.open(domain + '/receiver','myWindow','width=400,height=200');
//message sender
function popup(){
    var message = 'A message sent from 120.0.0.211:';
    myPopup.postMessage(message,domain); //send the message and target URI 
}
</script>
<div id="bb">At 120.0.0.211 server</div>
<button type="button" onclick="popup()">send the message!</button>

上記のスクリプトは Chrome と Firefox で完全に動作し、ウィンドウがポップアップしてメッセージを受信できますが、IE(8+) ではウィンドウをポップするだけでメッセージが受信されません (または送信できない可能性があります)。

私の主な目的は、2 つのドメインで単純なデータ (テキスト、1 枚の写真など) を送受信し、バックエンドにあまり多くの変更を加えないようにすることです。したがって、Web サービスは考慮されません。

どんな助けでも感謝します！

問題の調査に役立つリンクをいくつか示します。

  1. この投稿では、IE で attachEvent を使用することを提案しています。これは、上記のコードで既に行っています。 Internet Explorer での addEventListener

  2. この Microsoft 公式ドキュメントは、IE 8+ が addEventListener をサポートする必要があることを示しています: http://msdn.microsoft.com/en-us/library/ie/cc197057(v=vs.85).aspx

  3. これは、Jquery bind() を使用して addEventListener を置き換えることを推奨しています: JavaScript の addEventListener メソッドに相当する jQuery

4

1 に答える 1

4

IE は、クロスドメイン ポップアップ ウィンドウ (例:window.open) 間の postMessage をサポートしていません。IE は、埋め込みフレーム (例: top.frames) の postMessage をサポートしています。

そのため、フレームをダイアログに入れ、ポップアップ ウィンドウのように見せかけることになります。例えば：

Jquery UI ダイアログの助けを借りて

<script>
$("#dialog").dialog({
    autoOpen: false,
    modal: true,
    height: 300,
weight: 400,
});

function openiframe(){
   $('#dialog').dialog('open');
});
</script>

<p>At 120.0.0.211 server</p>
<button type="button" onclick="openiframe()">send the message!</button>
<div id="dialog">
   <iframe id="iframe" src="http://192.168.15.223/smallframe"></iframe>
</div>

クロスドメイン ウィンドウ間の通信には、他のソリューション/テクノロジが存在する可能性があります。

  1. Ajax を使用した Cross-Origin Resource Sharing (CORS)。

  2. REST のような Web サービスを使用します。これは、実際にはサーバーからサーバーへの交換であり、もはやサーバー - ブラウザー - サーバー構造体ではありません。しかし、これはメッセージを別のサーバーに送信する方法です。一部のフレームワークでは、REST を簡単にセットアップできます。

于 2013-08-14T05:27:34.693 に答える