นโยบายต้นทางเดียวกัน & iframe

มาริโกะ โคซากะ

ใน Codelab นี้ ลองดูวิธีการทำงานของนโยบายต้นทางเดียวกันเมื่อเข้าถึงข้อมูลภายใน iframe

ตั้งค่า: หน้าเว็บที่มี iframe ต้นทางเดียวกัน

หน้านี้ฝัง iframe ที่เรียกว่า iframe.html ในต้นทางเดียวกัน เนื่องจากโฮสต์และ iframe ใช้ต้นทางเดียวกัน เว็บไซต์ที่โฮสต์จะสามารถเข้าถึงข้อมูลภายใน iframe และแสดงข้อความลับได้ เช่น "เป่า"

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

เปลี่ยนเป็น iframe แบบข้ามต้นทาง

ลองเปลี่ยน src ของ iframe เป็น https://other-iframe.glitch.me/ หน้าโฮสต์ยังเข้าถึงข้อความลับได้ไหม

เนื่องจากโฮสต์และ iframe ที่ฝังไม่มีต้นทางเดียวกัน การเข้าถึงจึงถูกจำกัด