iframe de mensajería a través de dominios con jQuery postMessage complemento

Question

Estoy tratando de comunicarse entre un iframe niño y su padre con el siguiente plugin:

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

puedo seguir el ejemplo y enviar un mensaje de que el niño el padre pero no al revés y realmente necesito poder comunicarme de ambas maneras.

El código de la matriz es la siguiente:

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 
    ); 
}); 

Y el código en el niño es la siguiente:

$(function() { 

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

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

}); 

Realmente no puedo ver por qué esto no está funcionando y estoy en desesperada necesidad de ayuda!

Answer 1

Nunca usé ese complemento, realmente no puedo decir lo que está mal con él, pero, alternativamente, puede usar HTML 5 postMessage.

Desde que desea enviar datos al marco flotante, regístrese un detector de eventos en él:

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

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

Asegúrese de verificar el origen en contra de su dominio de confianza para evitar daños, en lugar de "*" que aceptará todas .

Ahora se puede llamar

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

Una vez más, usted debe cambiar "*" con el dominio de destino.

Answer 2

Tuve un requisito similar y terminé usando postMessage para enviar datos desde el niño al padre. Luego, para enviar datos desde el padre al hijo, pasé los datos en una cadena de consulta a través del atributo src del iframe. Al hacerlo, podría analizar la cadena de consulta y recuperar los datos en mi página secundaria.

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); 
}