iframe wiadomości domeny krzyż z pluginem jQuery postMessage

Question

staram się komunikować między iframe dziecka i jego rodzica stosując następujące wtyczki:

http://benalman.com/projects/jquery-postmessage-plugin/

mogę pójść za przykładem i wysyłać wiadomości od dziecka, rodzic, ale nie w inny sposób i naprawdę muszę być w stanie komunikować się w obie strony.

Kod na dominującej jest następujący:

var origin = document.location.protocol + '//' + document.location.host, 
    src = origin + '/Custom/Ui/Baseline/html/iframe-data-cash.htm#' + encodeURIComponent(document.location.href); 

$(function() { 

    var $holder = $('#iframe'), 
     height, 
     $iframe = $('<iframe src="' + src + '" id="data-cash-iframe" width="100%" scrolling="no" allowtransparency="true" seamless="seamless" frameborder="0" marginheight="0" marginwidth="0"></iframe>'); 

    // append iframe to DOM 
    $holder.append($iframe); 

}); 

$(window).load(function() { 
    $.postMessage(
     'hello world', 
     src, 
     parent.document.getElementById('data-cash-iframe').contentWindow 
    ); 
}); 

I kod na dziecko jest w następujący sposób:

$(function() { 

    var parentURL = decodeURIComponent(document.location.hash.replace(/^#/, '')); 

    $.receiveMessage(
     function (e) { 
      alert(e.data); 
     }, 
     parentURL 
    ); 

}); 

Naprawdę nie mogę zrozumieć, dlaczego to nie działa i jestem zdesperowany potrzeba pomocy!

Answer 1

Nigdy nie użyłem tej wtyczki, nie mogę powiedzieć, co jest z nią nie tak, ale na przemian można użyć HTML postMessage.

Ponieważ chcesz wysłać dane do iframe, zarejestrować detektora zdarzeń na nim:

window.addEventListener('message', receiver, false); 

function receiver(e) { 
    if (e.origin == '*') { 
    return; 
    } else { 
    console.log(e.data); 
    } 
} 

Należy sprawdzić pochodzenie przeciwko swojej zaufanej domeny, aby zapobiec uszkodzeniom, zamiast „*”, który będzie akceptował wszystko .

Teraz można zadzwonić

message = "data"; 
iframe = document.getElementById('iframe'); 
iframe.contentWindow.postMessage(message, '*');  

Ponownie, należy zmienić "*" z domeny docelowej.

Answer 2

Miałem podobny wymóg i skończyło się na użyciu postMessage, aby wysłać dane od dziecka do rodzica. Następnie, aby wysłać dane z obiektu nadrzędnego do elementu podrzędnego, przekazałem dane w ciągu zapytania za pośrednictwem atrybutu src elementu iframe. W ten sposób mógłbym następnie przeanalizować ciąg zapytania i pobrać dane z mojej strony podrzędnej.

Answer 3

1.sendPage 
<script type='text/javascript'> 
var sendpost = document.getElementById('wrapper').scrollHeight; 
var target = parent.postMessage ? parent : (parent.document.postMessage ? parent.document : undefined); 
target.postMessage(sendpost,'*'); 
</script> 
2. real iframe load page 
function handling(e){ 
       sendIframeHeight = e.data; 
} 

// <= ie8 
if (!window.addEventListener) { 
       window.attachEvent("onmessage", handling); 
}else{ // > ie8 
       window.addEventListener('message', handling, false); 
}