Chrome จะปิดใช้การแก้ไข document.domain เพื่อผ่อนคลายนโยบายต้นทางเดียวกัน

หากเว็บไซต์ใช้การตั้งค่า document.domain คุณจำเป็นต้องดำเนินการ

Eiji Kitamura

อัปเดต

  • 30 พฤษภาคม 2023: เราได้ประกาศว่าการเลิกใช้งานตัวตั้งค่า document.domain จะมีผลใน Chrome 115
  • 7 เมษายน 2023: เราพบปัญหา ก่อนที่จะเปิดตัวการเปลี่ยนแปลงนี้ใน Chrome 112 ขณะนี้การตั้งค่า document.domain ที่จะนําออกโดยค่าเริ่มต้นถูกระงับและยังไม่ได้กําหนดเหตุการณ์สำคัญใหม่ในการจัดส่ง โปรดกลับมาดูบล็อกโพสต์นี้หรือติดตามblink-dev และชุดข้อความนี้
  • 20 มกราคม 2023: ไทม์ไลน์ที่อัปเดตแล้ว - ระบบจะนำตัวตั้งค่า document.domain ออกโดยค่าเริ่มต้นตั้งแต่ Chrome 112 เป็นต้นไป นอกจากนี้ยังเพิ่มการกล่าวถึงนโยบายองค์กรเพื่อควบคุมลักษณะการทำงานของ document.domain ด้วย
  • 25 กรกฎาคม 2022: ไทม์ไลน์ที่อัปเดตแล้ว - ระบบจะนำตัวตั้งค่า document.domain ออกโดยค่าเริ่มต้นตั้งแต่ Chrome 109 เป็นต้นไป
  • 4 กุมภาพันธ์ 2022: อัปเดตไทม์ไลน์ใหม่ เราจะแสดงคำเตือนในแผงปัญหาที่เริ่มจาก Chrome 100 โดยนำตัวตั้งค่า document.domain ออกโดยค่าเริ่มต้นโดยเริ่มจาก Chrome 106

document.domain ออกแบบมาเพื่อรับหรือตั้งค่าชื่อโฮสต์ของต้นทาง

ใน Chrome เว็บไซต์จะตั้งค่า document.domain ไม่ได้ คุณจะต้องใช้แนวทางอื่น เช่น postMessage() หรือ Channel Messaging API เพื่อสื่อสารข้ามแหล่งที่มา เรากำหนดเป้าหมายให้ Chrome 112 จัดส่งการเปลี่ยนแปลงนี้โดยเร็วที่สุด แต่ก็ขึ้นอยู่กับการตอบสนองต่อความตั้งใจที่จะจัดส่ง

หากเว็บไซต์ของคุณอาศัยการผ่อนปรนนโยบายต้นทางเดียวกันผ่าน document.domain เพื่อให้ทํางานได้อย่างถูกต้อง เว็บไซต์จะต้องส่งส่วนหัว Origin-Agent-Cluster: ?0 เช่นเดียวกับเอกสารอื่นๆ ทั้งหมดที่ต้องใช้ลักษณะการทํางานดังกล่าว (โปรดทราบว่า document.domain ไม่มีผลหากมีเพียงเอกสารเดียวที่ตั้งค่าไว้)

เหตุใดจึงทําให้ document.domain เป็นแบบคงที่

เว็บไซต์หลายแห่งตั้งค่า document.domain เพื่ออนุญาตให้สื่อสารระหว่างหน้าในเว็บไซต์เดียวกันแต่ต่างแหล่งที่มา

โดยทำดังนี้

สมมติว่าหน้าเว็บใน https://parent.example.com ฝังหน้า iframe จาก https://video.example.com หน้าเหล่านี้มี eTLD+1 (example.com) เดียวกันแต่มีโดเมนย่อยต่างกัน เมื่อตั้งค่า document.domain ของทั้ง 2 หน้าเป็น 'example.com' แล้วเบราว์เซอร์จะถือว่าต้นทางทั้ง 2 รายการเป็นต้นทางเดียวกัน

ตั้งค่า document.domain สำหรับ https://parent.example.com

// Confirm the current origin of "parent.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

ตั้งค่า document.domain สำหรับ https://video.example.com

// Confirm the current origin of "video.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

ตอนนี้คุณสร้างการจัดการ DOM ข้ามแหล่งที่มาใน https://parent.example.com เทียบกับ https://video.example.com ได้แล้ว

เว็บไซต์ตั้งค่า document.domain เพื่อให้เอกสารในเว็บไซต์เดียวกันสื่อสารกันได้ง่ายขึ้น เนื่องจากการเปลี่ยนแปลงนี้ผ่อนปรนนโยบายต้นทางเดียวกัน หน้าหลักจึงเข้าถึงเอกสารของ iframe และไปยังส่วนต่างๆ ของ DOM ได้ และในทางกลับกัน

นี่เป็นเทคนิคที่สะดวก แต่ก็ก่อให้เกิดความเสี่ยงด้านความปลอดภัย

ข้อกังวลด้านความปลอดภัยเกี่ยวกับ document.domain

ความกังวลด้านความปลอดภัยเกี่ยวกับ document.domain ทำให้มีการปรับเปลี่ยนข้อกำหนดที่เตือนผู้ใช้ให้หลีกเลี่ยงการใช้ การพูดคุยกับผู้ให้บริการเบราว์เซอร์รายอื่นๆ ในปัจจุบันก็มุ่งไปในทิศทางเดียวกัน

ตัวอย่างเช่น เมื่อหน้าเว็บ 2 หน้าตั้งค่า document.domain หน้าเว็บเหล่านั้นจะทําตัวราวกับว่ามาจากแหล่งที่มาเดียวกัน ซึ่งสำคัญอย่างยิ่งเมื่อหน้าเว็บเหล่านี้ใช้บริการโฮสติ้งแบบใช้ร่วมกันซึ่งมีโดเมนย่อยต่างกัน การตั้งค่า document.domain จะเปิดการเข้าถึงเว็บไซต์อื่นๆ ทั้งหมดที่โฮสต์โดยบริการเดียวกัน ซึ่งทำให้ผู้โจมตีเข้าถึงเว็บไซต์ของคุณได้ง่ายขึ้น ซึ่งเป็นไปได้เนื่องจาก document.domain ไม่สนใจส่วนหมายเลขพอร์ตของโดเมน

ดูข้อมูลเพิ่มเติมเกี่ยวกับผลกระทบด้านความปลอดภัยของการตั้งค่า document.domain ได้ที่หน้า "Document.domain" ใน MDN

Chrome วางแผนที่จะทําให้ document.domain เป็นแบบคงที่ใน Chrome 112

ฉันจะทราบได้อย่างไรว่าเว็บไซต์ของฉันได้รับผลกระทบหรือไม่

หากเว็บไซต์ได้รับผลกระทบจากการเปลี่ยนแปลงนี้ Chrome จะแจ้งเตือนในแผงปัญหาเกี่ยวกับเครื่องมือสำหรับนักพัฒนาเว็บ สังเกตธงสีเหลืองที่มุมขวาบน

เมื่อแก้ไข document.domain ระบบจะแสดงคำเตือนในแผง "ปัญหา"
เมื่อแก้ไข document.domain ระบบจะแสดงคำเตือนในแผงปัญหา

หากได้ตั้งค่าปลายทางการรายงานไว้ คุณจะได้รับรายงานการเลิกใช้งานด้วย ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีใช้ Reporting API กับบริการรวบรวมรายงานที่มีอยู่หรือสร้างโซลูชันของคุณเอง

คุณสามารถเรียกใช้เว็บไซต์ผ่านการตรวจสอบ API ที่เลิกใช้งานของ Lighthouse เพื่อค้นหา API ทั้งหมดที่มีกำหนดเวลาให้นําออกจาก Chrome

การสื่อสารทางเลือกข้ามต้นทาง

ปัจจุบันคุณมี 3 ตัวเลือกในการแทนที่ document.domain สำหรับเว็บไซต์

ใช้ postMessage() หรือ Channel Messaging API

ในกรณีการใช้งานส่วนใหญ่ document.domain สามารถใช้แทน postMessage() หรือ Channel Messaging API ได้

ในตัวอย่างต่อไปนี้

  1. https://parent.example.com ส่งคําขอ https://video.example.com ภายใน iframe เพื่อดําเนินการกับ DOM โดยส่งข้อความผ่าน postMessage()
  2. https://video.example.com จะจัดการ DOM ทันทีที่ได้รับข้อความและแจ้งให้สำเร็จกลับไปยังรายการหลัก
  3. https://parent.example.com ยอมรับความสําเร็จ

ในวันที่ https://parent.example.com

// Send a message to https://video.example.com
iframe.postMessage('Request DOM manipulation', 'https://video.example.com');

// Receive messages
iframe.addEventListener('message', (event) => {
  // Reject all messages except ones from https://video.example.com
  if (event.origin !== 'https://video.example.com') return;

  // Filter success messages
  if (event.data === 'succeeded') {
    // DOM manipulation is succeeded
  }
});

ในวันที่ https://video.example.com

// Receive messages
window.addEventListener('message', (event) => {
  // Reject all messages except ones from https://parent.example.com
  if (event.origin !== 'https://parent.example.com') return;

  // Do a DOM manipulation on https://video.example.com.

  // Send a success message to https://parent.example.com
  event.source.postMessage('succeeded', event.origin);
});

ลองใช้ดูเพื่อดูว่าเป็นอย่างไร หากคุณมีข้อกำหนดเฉพาะที่ใช้งานร่วมกับ postMessage() หรือ Channel Messaging API ไม่ได้ โปรดแจ้งให้เราทราบทาง Twitter ผ่าน @ChromiumDev หรือถามใน Stack Overflow ด้วยแท็ก document.domain

ทางเลือกสุดท้ายคือการส่งส่วนหัว Origin-Agent-Cluster: ?0

หากคุณมีเหตุผลที่หนักแน่นในการตั้งค่า document.domain ต่อไป ให้ส่งส่วนหัวการตอบกลับของ Origin-Agent-Cluster: ?0 ไปพร้อมกับเอกสารเป้าหมาย

Origin-Agent-Cluster: ?0

ส่วนหัว Origin-Agent-Cluster จะบอกเบราว์เซอร์ว่าควรจัดการเอกสารโดยคลัสเตอร์ Agent ที่ผูกกับต้นทางหรือไม่ ดูข้อมูลเพิ่มเติมเกี่ยวกับ Origin-Agent-Cluster ได้ที่การขอการแยกประสิทธิภาพด้วยส่วนหัว Origin-Agent-Cluster

เมื่อส่งส่วนหัวนี้ เอกสารจะยังคงตั้งค่า document.domain ได้แม้ว่าจะกลายเป็นค่าที่ไม่เปลี่ยนแปลงโดยค่าเริ่มต้นแล้วก็ตาม

กำหนดค่า OriginAgentClusterDefaultEnabled สำหรับนโยบายองค์กร

ผู้ดูแลระบบสามารถกําหนดค่านโยบาย OriginAgentClusterDefaultEnabled เป็น false เพื่อให้ตั้งค่า document.domain เป็นค่าเริ่มต้นได้ในอินสแตนซ์ Chrome ทั่วทั้งองค์กร อ่านข้อมูลเพิ่มเติมได้ที่รายชื่อนโยบายและการจัดการ Chrome Enterprise | เอกสาร

ความเข้ากันได้กับเบราว์เซอร์

แหล่งข้อมูล

ขอขอบคุณ

รูปภาพโดย Braydon Anderson ใน Unsplash