postmessage는 도메인 간 (프레임 용) 작동하지 않습니다

Question

이 자습서 http://davidwalsh.name/window-postmessage을 따라 갔고 Chrome 및 Firefox에서는 작동하지만 크로스 도메인 메시징 스크립트는 Internet Explorer 10에서는 작동하지 않습니다. IE 8 이상을 수정하는 방법은 무엇입니까? 보낸 사람 크롬에서 완벽하게 작동 스크립트 위

<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> 

- (120.0.0.211 예) 다른 서버에서 수신

<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> 

- : 하나 개의 서버 (192.168.15.223 예)에서

및 파이어 폭스, 창 팝업 및 메시지를받을 수 있지만 IE (8 +)에서 창을 팝하지만 메시지를받지 못했습니다 (또는 보낼 수 없습니다).

내 주요 목적은 간단한 데이터 (텍스트, 단일 사진 등)를 송수신하고 백엔드에 너무 많은 변경 사항을 포함하지 않도록 만드는 것입니다. 따라서 웹 서비스는 고려되지 않습니다.

도움이 될 것입니다!

다음은 문제를 조사하는 데 유용한 링크입니다.

1. 이미 위의 코드에서 한 IE에는 attachEvent를 사용하여이 포스트 suggess : addEventListener in Internet Explorer

2. 이 마이크로 소프트 공식 문서가 IE를 보여줍니다 8 + 지원해야하여 addEventListener : http://msdn.microsoft.com/en-us/library/ie/cc197057(v=vs.85).aspx

3. Jquery bind()를 사용하여 addEventListener를 바꾸는 것이 좋습니다. jQuery equivalent of JavaScript's addEventListener method

Answer 1

IE는 도메인 간 팝업 창 (예 : window.open) 간의 postMessage를 지원하지 않습니다. IE는 삽입 된 프레임 (예 : top.frames)에 대해 postMessage를 지원합니다.

그래서 프레임을 대화 상자에 넣고 팝업 창처럼 가장합니다. 예를 들면 :

With the help of Jquery UI dialog

<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. Cross-Origin Resource Sharing (CORS) using Ajax.

2. 실제 서버 대 서버 교환 인 REST와 같은 Webservice를 사용하면 server-broswer-server 구조체가 아닙니다. 하지만 다른 서버에 메시지를 보낼 수있는 방법입니다. 일부 프레임 워크의 경우 REST를 쉽게 설정할 수 있습니다. 예 : cakephp