In diesem Codelab erfahren Sie, wie die Same-Origin-Richtlinie beim Zugriff auf Daten in einem iFrame funktioniert.
Einrichtung: Seite mit einem iFrame mit demselben Ursprung
Auf dieser Seite ist ein iframe mit dem Namen iframe.html im selben Ursprung eingebettet.
Da der Host und der iFrame denselben Ursprung haben, kann die Hostwebsite auf Daten im iFrame zugreifen und die geheime Nachricht wie unten dargestellt offenlegen.
const iframe = document.getElementById('iframe');
const message = iframe.contentDocument.getElementById('message').innerText;
Änderung zu ursprungsübergreifendem iFrame
Versuche, den Wert für src des Elements iframe in https://other-iframe.glitch.me/ zu ändern.
Kann die Hostseite weiterhin auf die geheime Nachricht zugreifen?
Da der Host und die eingebettete iframe nicht denselben Ursprung haben, ist der Zugriff auf die Daten eingeschränkt.