Comunicación iframe entre dominios

Question

Tengo un iframe creado en una página, y el dominio de la página se establece explícitamente en 'xyz.com', pero el dominio del iframe está predeterminado en 'dev.xyz.com', que es el dominio real en el que estoy desarrollando.

El problema es que cuando intento acceder a ese iframe a través de iframe.contentWindow.document, falla debido a la diferencia en el dominio.

He tratado de establecer el iframe src de un archivo con document.domain = 'xyz.com', pero eso no parece estar haciendo el truco ...

¿Alguna idea?

Answer 1

Página iframe dentro:

<script> 
document.domain = document.domain; 
</script> 

Parece tonto, pero funciona. Ver "What does document.domain = document.domain do?".

Answer 2

Después de algunas investigaciones, encontré este jQuery plugin que hace que postMessage sea compatible con versiones anteriores con navegadores más antiguos usando varios trucos.

Aquí está un ejemplo rápido que muestra cómo enviar la altura del cuerpo del marco flotante a la ventana padre:

En el host (padre) página:

// executes when a message is received from the iframe, to adjust 
    // the iframe's height 
    $.receiveMessage(
     function(event){ 
      $('my_iframe').css({ 
       height: event.data 
      }); 
    }); 
    // Please note this function could also verify event.origin and other security-related checks. 

En la página iframe :

$(function(){ 

    // Sends a message to the parent window to tell it the height of the 
    // iframe's body   
    var target = parent.postMessage ? parent : (parent.document.postMessage ? parent.document : undefined); 

    $.postMessage(
     $('body').outerHeight(true) + 'px', 
     '*', 
     target 
    ); 

}); 

he probado esto en Chrome 13+, Firefox 3.6+, Internet Explorer 7, 8 y 9 en XP y W7, safari en OSX y W7. ;)

Answer 3

Como complemento de la referencia al complemento Ben Alman pensé que publicaría este ejemplo de trabajo. Informa sobre un iframe que tiene una página de origen que contiene el script de consulta de datos de autenticación de jquery & que luego pasa el resultado a la ventana principal de {other domain} utilizando el complemento de mensajes.

NB mensaje complemento se romperá si se utiliza v9 JQ como JQV9 no utiliza "navegador" se hace referencia en el plugin

1er paso: Agregue el código plugin para ambos documentos de envío y recepción:

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

segundo paso: Añadir este documento a enviar:

$.postMessage(
$(X).html(),  
'http://DOMAIN [PORT]/FOLDER/SUBFOLDER/RECIEVINGDOCNAME.XXX' 
) ;  

Donde X puede ser una var local que contiene una matriz json preformateada u otras cosas, y la URL http aquí es la dirección del documento receptor.

3er paso: Añadir este documento a recibir:

$.receiveMessage(
    function(event){ 
     alert("event.data: "+event.data); 
       $("#testresults").append('<h1>'+event.data+'<h1>'); 

    },   
    'http://DOMAIN.COM OR SOMETHING' 

); 

Cuando la url http es el dominio del documento de envío. Bueno en IE 8, 9, FF16, safari de Windows (windows wait x V9 aún no probado), safari x mac.

El resultado es cualquier elemento que desee de otra página de dominio (a la que tenga acceso ...).