หน้านี้ได้รับการแปลโดย Cloud Translation API

รักษาความปลอดภัยให้การโต้ตอบกับป๊อปอัปด้วยพร็อพเพอร์ตี้แบบจำกัด

รับการแยกแหล่งที่มาหลายแหล่งและการปกป้องข้อมูลรั่วไหลข้ามเว็บไซต์ขณะโต้ตอบกับป๊อปอัป

Arthur Hemery

Maud Nalpas

ค่าใหม่สําหรับนโยบายเครื่องมือเปิดแบบข้ามต้นทาง (COOP) พร้อมใช้งานแล้ว: restrict-properties ฟีเจอร์นี้มีประโยชน์ด้านความปลอดภัยและทำให้ใช้การแยกแบบข้ามต้นทางได้ง่ายขึ้น ขณะเดียวกันก็ช่วยให้เว็บไซต์โต้ตอบกับป๊อปอัปของบุคคลที่สามสำหรับการชำระเงิน การตรวจสอบสิทธิ์ หรือกรณีการใช้งานอื่นๆ

หากต้องการเริ่มทดสอบ restrict-properties ให้เข้าร่วมช่วงทดลองใช้จากต้นทางใน Chrome 116

เหตุผลที่ควรใช้ `restrict-properties`

restrict-properties มี 2 กรณีการใช้งานหลักดังนี้

การป้องกันการรั่วไหลข้ามเว็บไซต์โดยไม่ทำให้ประสบการณ์การใช้งานเสีย
การทําให้เว็บไซต์แยกแบบข้ามต้นทาง

ป้องกันการรั่วไหลข้ามเว็บไซต์โดยไม่ทำให้ประสบการณ์การใช้งานเสีย

โดยค่าเริ่มต้น เว็บไซต์ต่างๆ จะเปิดแอปพลิเคชันของคุณในป๊อปอัปและรับการอ้างอิงได้

เว็บไซต์ที่เป็นอันตรายอาจใช้ประโยชน์จากข้อมูลนี้เพื่อทำการโจมตี เช่น การรั่วไหลข้ามเว็บไซต์ คุณสามารถใช้ส่วนหัว Cross-Origin-Opener-Policy (COOP) เพื่อลดความเสี่ยงนี้ได้

ก่อนหน้านี้ ตัวเลือกสำหรับ Cross-Origin-Opener-Policy ของคุณมีจํากัด ดังต่อไปนี้

ตั้งค่า same-origin, ซึ่งบล็อกการโต้ตอบข้ามแหล่งที่มาทั้งหมดกับป๊อปอัป
ตั้งค่าเป็น same-origin-allow-popups ซึ่งจะบล็อกการโต้ตอบข้ามแหล่งที่มาทั้งหมดที่เปิดเว็บไซต์ของคุณในป๊อปอัป
ตั้งค่า unsafe-none ซึ่งอนุญาตการโต้ตอบแบบข้ามต้นทางทั้งหมดกับป๊อปอัป

ซึ่งทำให้เว็บไซต์ที่จำเป็นต้องเปิดในป๊อปอัปและโต้ตอบกับโปรแกรมเปิดเพื่อบังคับใช้ COOP ไม่ได้ กรณีการใช้งานที่สำคัญ เช่น การลงชื่อเข้าใช้ครั้งเดียวและการชําระเงิน จึงไม่มีการป้องกันจากการรั่วไหลข้ามเว็บไซต์

Cross-Origin-Opener-Policy: restrict-properties ช่วยแก้ปัญหานี้ได้

restrict-properties จะทำให้ไม่สามารถใช้พร็อพเพอร์ตี้ที่ใช้สำหรับการนับเฟรมและการโจมตีการรั่วไหลข้ามเว็บไซต์แบบอื่นๆ ได้ แต่อนุญาตให้มีการสื่อสารพื้นฐานระหว่างหน้าต่างผ่าน postMessage และ closed

ซึ่งจะช่วยปรับปรุงความปลอดภัยของเว็บไซต์ไปพร้อมกับรักษากรณีการใช้งานหลัก เช่น

หากคุณให้บริการในป๊อปอัป การตั้งค่า Cross-Origin-Opener-Policy: restrict-properties จะปกป้องคุณจากการโจมตีแบบรั่วไหลข้ามเว็บไซต์ที่หลากหลาย คุณยังสามารถเปิดหน้าเว็บทั้งหมดที่สามารถเปิดไว้ก่อนหน้านี้ได้
หากต้องการเข้าถึงป๊อปอัปข้ามแหล่งที่มา การตั้งค่า Cross-Origin-Opener-Policy: restrict-properties จะปกป้องเว็บไซต์ของคุณจากการนับ iframe ในลักษณะเดียวกัน คุณจะสามารถเปิดป๊อปอัปชุดเดียวกับ ที่คุณเปิดได้ในวันนี้
หากทั้ง Opener และ Openee ตั้งค่าส่วนหัวและหน้าเป็นแบบข้ามต้นทาง หน้าดังกล่าวจะทํางานคล้ายกับหน้าใดหน้าหนึ่งที่มีส่วนหัว หากมีแหล่งที่มาเดียวกัน ระบบจะให้สิทธิ์เข้าถึงแบบเต็ม

ทําให้เว็บไซต์มีการแยกแบบข้ามต้นทาง

เหตุผลที่ต้องใช้การแยกแบบข้ามต้นทาง

Web API บางรายการเพิ่มความเสี่ยงของการโจมตีช่องทางข้าง เช่น Spectre เพื่อลดความเสี่ยงดังกล่าว เบราว์เซอร์จึงมีสภาพแวดล้อมแบบแยกส่วนซึ่งต้องเลือกใช้ที่เรียกว่าการแยกแบบข้ามต้นทาง เมื่ออยู่ในสถานะแยกกันข้ามต้นทาง หน้าเว็บจะใช้ฟีเจอร์ที่มีสิทธิ์ได้ ซึ่งรวมถึง SharedArrayBuffer, performance.measureUserAgentSpecificMemory() และตัวจับเวลาที่มีความแม่นยำสูง โดยมีการแก้ปัญหาที่ดีขึ้น ทั้งยังแยกต้นทางออกจากต้นทางอื่นๆ เว้นแต่ว่าต้นทางเหล่านั้นจะเลือกใช้

ก่อนหน้านี้ หากต้องการใช้ API เหล่านี้ คุณต้องตั้งค่า Cross-Origin-Opener-Policy: same-origin อย่างไรก็ตาม การดำเนินการนี้จะทำลายขั้นตอนการป๊อปอัปข้ามแหล่งที่มาที่คุณอาจต้องใช้ เช่น การลงชื่อเพียงครั้งเดียวและการชำระเงิน

คุณสามารถใช้ Cross-Origin-Opener-Policy: restrict-properties แทน Cross-Origin-Opener-Policy: same-origin เพื่อเปิดใช้การแยกแบบข้ามต้นทางได้แล้ว แทนที่จะตัดความสัมพันธ์ของเงื่อนไขเริ่มต้นออก การดำเนินการนี้จะจํากัดความสัมพันธ์นั้นไว้ที่ชุดย่อยการสื่อสารขั้นต่ำของ window.postMessage() และ window.closed เท่านั้น

คุณจะเปิดใช้การแยกแบบข้ามต้นทางได้ด้วยส่วนหัว 2 รายการต่อไปนี้

Cross-Origin-Opener-Policy: restrict-properties
Cross-Origin-Embedder-Policy: require-corp

หรือ

Cross-Origin-Opener-Policy: restrict-properties
Cross-Origin-Embedder-Policy: credentialless

ดูข้อมูลเพิ่มเติมเกี่ยวกับ credentialless ที่ โหลดทรัพยากรข้ามแหล่งที่มาโดยไม่มีส่วนหัว CORP โดยใช้ COEP: credentialless

สาธิต

ลองใช้ตัวเลือกส่วนหัวต่างๆ ในการสาธิตการแยกแหล่งที่มาหลายแหล่งนี้

ทดสอบช่วงทดลองใช้จากต้นทาง

หากต้องการทดสอบ Cross-Origin-Opener-Policy: restrict-properties ให้เลือกช่วงทดลองใช้ต้นทาง

การสนับสนุนเบราว์เซอร์

ปัจจุบัน Cross-Origin-Opener-Policy: restrict-properties ใช้ได้ใน Chrome เท่านั้น เบราว์เซอร์อื่นจะมีส่วนร่วมในการหารือเรื่องการกำหนดมาตรฐานอยู่เสมอ

คำถามที่พบบ่อย

เว็บไซต์ของฉันต้องสื่อสารกับป๊อปอัปจากต้นทางเดียวกัน ฉันควรใช้ `COOP: restrict-properties` เพื่อเปิดใช้การแยกแบบข้ามต้นทางไหม

การตั้งค่า COOP: restrict-properties ทั้งในป๊อปอัปและหน้าหลักจะไม่ก่อให้เกิดข้อจำกัด การตั้งค่าในป๊อปอัปเท่านั้นหรือในหน้าหลักเท่านั้นจะป้องกันไม่ให้เข้าถึงพร็อพเพอร์ตี้อื่นๆ นอกเหนือจาก postMessage และ closed ในหน้าเปิด แม้ว่าจะเป็นต้นทางเดียวกันก็ตาม

ชุดพร็อพเพอร์ตี้ที่อนุญาตเป็นแบบคงที่หรือไม่

จากความคิดเห็นที่ได้รับจนถึงตอนนี้ เราคาดว่า window.postMessage และ window.closed จะเพียงพอสำหรับเวิร์กโฟลว์ส่วนใหญ่ แต่เรายังคงพิจารณาที่จะเปิดใช้ฟีเจอร์นี้กับที่พักอื่นๆ หากคุณมี Use Case ที่ไม่สามารถแก้ไขได้โดยใช้เพียง postMessage และ closed โปรดแสดงความคิดเห็นในชุดข้อความ "ความตั้งใจที่จะทดสอบ"