Richtlinie und iFrame für denselben Ursprung

Mariko Kosaka

In diesem Codelab erfahren Sie, wie die Same-Origin-Richtlinie beim Zugriff auf Daten in einem iFrame funktioniert.

Einrichten: Seite mit einem iFrame desselben Ursprungs

Auf dieser Seite ist eine iframe namens iframe.html im selben Ursprung eingebettet. Da der Host und der Iframe dieselbe Quelle haben, kann die Hostwebsite auf Daten im Iframe zugreifen und die geheime Nachricht offenlegen.

const iframe = document.getElementById('iframe');
const message = iframe.contentDocument.getElementById('message').innerText;

Zu ursprungsübergreifendem iFrame wechseln

Versuche, die src der 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.