同一生成元ポリシーと iframe

Mariko Kosaka

この Codelab では、iframe 内のデータにアクセスする場合の同一オリジン ポリシーの動作を確認します。

設定: 同一オリジンの iframe を使用するページ

このページには、同じオリジンに iframe.html という iframe が埋め込まれています。 ホストと iframe は同じオリジンを共有しているため、ホストサイトは iframe 内のデータにアクセスし、一気に一気に秘密のメッセージを暴露することができます。

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

クロスオリジンの iframe に変更

iframesrchttps://other-iframe.glitch.me/ に変更してみてください。 ホストページはシークレット メッセージに引き続きアクセスできますか?

ホストと埋め込み iframe の生成元が異なるため、データへのアクセスは制限されます。