Cross Domain-Kommunikation von Child (iframe) zu Parent funktioniert nicht

Question

Ich habe eine Komponente in AEM (Adobe Experience Manager - a cms) auf einer Seite und ich möchte diese Seite auf eine andere Seite (von einer anderen Domäne) mit einem iframe. Also im Code für die Komponente verwende ich window.postMessage() und ich versuche, dieses Ereignis im Elternteil zu hören. Ich habe versucht, den anderen Weg zu kommunizieren, Eltern zu iframe und es hat gut funktioniert, aber ich muss anders kommunizieren. Die Komponente ist also eine Suchkomponente und wenn Sie auf ein Suchergebnis klicken, möchte ich umleiten, aber vom übergeordneten Fenster aus, also versuche ich, die URL an die Umleitung zu senden und dann die Umleitung innerhalb des JS-Codes der Eltern zu handhaben.

Der Code sieht so aus:

(Von den Eltern - html)

<iframe 
    width="1080" 
    height="700" 
    id="theFrame" 
    src="http://localhost:4502/content/zebra1/global/en_us/hey.html#q=print" 
    frameborder="0"> 
</iframe> 

(Von den Eltern - js)

function receiveMessage(e) 
{ 
    var key = e.message ? "message" : "data"; 
    var data = e[key]; 
    var redirect = JSON.parse(data); 
    redirectUrl = (redirect.origin ? redirect.origin : '') + (redirect.url ? 
    redirect.url : ''); 
    if (redirectUrl) { 
     window.location.href = redirectUrl; 
    } 
} 

window.addEventListener("message", receiveMessage, false); 

(Von der iframe/Kind - js)

goToSearchResults : function(event){ 

    var windowOrigin  = location.origin; 

    if(arguments[0].length == 3){ 
     var redirect = { 
      origin: windowOrigin, 
      url: arguments[0][1].url || '' 
     }; 
     if(!$('#supportSearchWrap').data('iframe')) { 
      location.replace(redirect.url); 
     } else { 
      window.postMessage(JSON.stringify(redirect), windowOrigin); 
     } 
    } 
    logger.log(redirect.origin + redirect.url , this.model); 

} 

Es funktioniert nicht für mich. Sieht jemand, was ich falsch mache oder einen besseren Weg, dies zu tun?

Answer 1

window.postMessage - Die window bezieht sich auf die Instanz des Fensterobjekts, an das Sie Ihre Nachricht senden. In Ihrem Fall sollte es das Elternteil des iframe Fensters sein.
Sie können diese Referenz innerhalb des Iframe mit window.parent oder einfach parent erhalten.

Die Eigenschaft targetOrigin sollte auch mit den Zielfenstereigenschaften übereinstimmen. Von MDN docs ist es wie folgt.

targetOrigin Gibt an, was der Ursprung der otherWindow sein muss für das Ereignis ausgelöst werden, entweder als Zeichenkette „*“ (was keine Präferenz) oder als URI. Wenn das Schema, der Hostname oder der Port eines anderen Windows-Dokuments zum Zeitpunkt des geplanten Versands des Ereignisses nicht mit dem in targetOrigin angegebenen übereinstimmt, wird das Ereignis nicht gesendet. Nur wenn alle drei übereinstimmen, wird das Ereignis ausgelöst.