Von iFrames auf Parent-Window zugreifen (cross-domain)

Will man eine Funktion im Elternfenster eines iFrame aufrufen, so ist das normalerweise kein Problem.

1
window.parent.functionname();

und fertig ist die Kiste. Ganz anders sieht es aber aus, wenn der iFrame nicht in der gleichen Domain liegt. Cross-Domain-Zugriff auf Funktionen (und Eigenschaften) ist nämlich verboten.

Hierfür gibt es seit einiger Zeit eine Lösung, die inzwischen viele Browser implementieren: postMessage. Wenn man nicht gerade IE6/7 unterstützen muss, kann man diese Funktion nutzen, um sich das Leben einfacher zu machen.

Im iFrame sendet man dabei eine Nachricht an das Hauptfenster:

1
window.parent.postMessage('close', '*');

und im Hauptfenster empfängt man die Nachricht und wertet sie aus:

1
2
3
4
window.addEventListener("message", function(event) {
    if(event.data === 'close'){
	doSomething();
    }

Unterstützt wird diese praktische Funktion von Firefox 3+, IE 8+, Chrome 4+, Safari 4+, Opera 10+ und allen derzeit gängigen Mobilbrowsern.

caniuse
(Bild von caniuse.com)