Zasada dotycząca tego samego źródła i element iframe

Mariko Kosaka

Z tego ćwiczenia w Codelabs dowiesz się, jak zasada tego samego źródła działa w przypadku uzyskiwania dostępu do danych w elemencie iframe.

Ta strona zawiera element iframe o nazwie iframe.html w tym samym źródle. Ponieważ host i element iframe mają ten sam element docelowy, witryna hosta może uzyskać dostęp do danych w elemencie iframe i ujawnić tajną wiadomość, jak pokazano na ilustracji.

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

Przejście na element iframe z różnych źródeł

Spróbuj zmienić src elementu iframe na https://other-iframe.glitch.me/. Czy strona hosta nadal ma dostęp do tajnej wiadomości?

Ponieważ host i umieszczony w nim element iframe nie mają tego samego źródła, dostęp do danych jest ograniczony.