การควบคุมฟีเจอร์ของเบราว์เซอร์ด้วยนโยบายสิทธิ์

จัดการวิธีที่ iframe ของหน้าเว็บและ iframe ของบุคคลที่สามบนหน้าเว็บของคุณสามารถเข้าถึงคุณลักษณะของเบราว์เซอร์

Kevin K. Lee
Kevin K. Lee

นโยบายสิทธิ์ (เดิมเรียกว่านโยบายฟีเจอร์) ช่วยให้นักพัฒนาซอฟต์แวร์ควบคุมฟีเจอร์ของเบราว์เซอร์ที่พร้อมใช้งานในหน้าเว็บ, iframe และทรัพยากรย่อยได้ โดยประกาศชุดนโยบายที่เบราว์เซอร์จะบังคับใช้ นโยบายเหล่านี้ใช้กับต้นทางที่ระบุไว้ในรายการต้นทางของส่วนหัวการตอบกลับ รายการต้นทางอาจมีต้นทางเดียวกันและ/หรือข้ามต้นทางได้ และจะช่วยให้นักพัฒนาซอฟต์แวร์ควบคุมการเข้าถึงฟีเจอร์ของเบราว์เซอร์ของบุคคลที่หนึ่งและบุคคลที่สามได้

ผู้ใช้จะตัดสินใจขั้นสุดท้ายได้ว่าจะอนุญาตให้เข้าถึงฟีเจอร์ที่มีประสิทธิภาพมากกว่านี้ และจะต้องให้สิทธิ์อย่างชัดแจ้งผ่านข้อความแจ้ง

นโยบายสิทธิ์อนุญาตให้เว็บไซต์ระดับบนสุดกำหนดสิ่งที่ตนและบุคคลที่สามต้องการใช้ และลดภาระของผู้ใช้ในการพิจารณาว่าคำขอการเข้าถึงฟีเจอร์นั้นถูกต้องตามกฎหมายหรือไม่ ตัวอย่างเช่น การบล็อกฟีเจอร์ตำแหน่งทางภูมิศาสตร์สำหรับบุคคลที่สามทั้งหมดผ่านนโยบายสิทธิ์จะทำให้นักพัฒนาซอฟต์แวร์มั่นใจได้ว่าไม่มีบุคคลที่สามรายใดมีสิทธิ์เข้าถึงตำแหน่งทางภูมิศาสตร์ของผู้ใช้

การเปลี่ยนแปลงนโยบายสิทธิ์

โดยนโยบายสิทธิ์เดิมเรียกว่านโยบายฟีเจอร์ แนวคิดหลักยังคงเหมือนเดิม แต่มีการเปลี่ยนแปลงที่สำคัญบางอย่างเกี่ยวกับชื่อ

การใช้งานช่องที่มีโครงสร้าง

ช่องที่มีโครงสร้างจะระบุชุดโครงสร้างข้อมูลทั่วไปเพื่อสร้างมาตรฐานการแยกวิเคราะห์และการทำให้เป็นอนุกรมของค่าช่องส่วนหัว HTTP ดูข้อมูลเพิ่มเติมเกี่ยวกับช่องที่มีโครงสร้างจากบล็อกโพสต์ของ Fastly เรื่อง "การปรับปรุง HTTP ด้วยช่องส่วนหัวที่มีโครงสร้าง"

เก่า
  geolocation 'self' https://example.com; camera 'none'

ก่อนหน้านี้เกี่ยวกับนโยบายฟีเจอร์

ใหม่
  geolocation=(self "https://example.com"), camera=()

ตอนนี้มากับนโยบายสิทธิ์แล้ว

รวมส่วนหัวกับแอตทริบิวต์ iframe allow

นโยบายฟีเจอร์จะช่วยให้คุณเพิ่มฟีเจอร์ลงในเฟรมแบบข้ามต้นทางได้โดยการเพิ่มต้นทางลงในรายการต้นทางของส่วนหัวหรือเพิ่มแอตทริบิวต์ allow ลงในแท็ก iframe เมื่อใช้นโยบายสิทธิ์ หากคุณเพิ่มเฟรมแบบข้ามต้นทางลงในรายการต้นทาง แท็ก iframe สำหรับต้นทางนั้นต้องมีแอตทริบิวต์ allow หากการตอบกลับไม่มีส่วนหัวนโยบายสิทธิ์ ระบบจะถือว่ารายการต้นทางมีค่าเริ่มต้นเป็น * การเพิ่มแอตทริบิวต์ allow ใน iframe จะทำให้สามารถเข้าถึงฟีเจอร์นี้ได้

ดังนั้น เราขอแนะนำให้นักพัฒนาซอฟต์แวร์ตั้งค่าส่วนหัวนโยบายสิทธิ์ไว้ในการตอบกลับอย่างชัดแจ้ง เพื่อบล็อก iframe แบบข้ามต้นทางที่ไม่ได้อยู่ในรายการต้นทางไม่ให้เข้าถึงฟีเจอร์นี้ แม้จะมี allow อยู่ก็ตาม

นโยบายฟีเจอร์ยังคงใช้งานได้หลังจาก Chrome 88 แต่จะทำหน้าที่เป็นชื่อแทนของนโยบายสิทธิ์ นอกเหนือจากไวยากรณ์แล้ว ก็ไม่มีความแตกต่างในตรรกะ หากมีการใช้ทั้งนโยบายสิทธิ์และส่วนหัวของนโยบายฟีเจอร์ร่วมกัน ส่วนหัว Permissions-Policy จะมีลำดับความสำคัญสูงกว่าและจะแทนที่ค่าที่ระบุโดยส่วนหัว Feature-Policy

ฉันจะใช้นโยบายสิทธิ์ได้อย่างไร

ภาพรวมสั้นๆ

ก่อนที่จะเจาะลึก มาดูสถานการณ์ทั่วไปที่คุณเป็นเจ้าของเว็บไซต์และต้องการควบคุมวิธีที่เว็บไซต์และโค้ดของบุคคลที่สามใช้ฟีเจอร์ของเบราว์เซอร์กัน

  • เว็บไซต์ของคุณคือ https://your-site.example
  • เว็บไซต์ของคุณฝัง iframe จากต้นทางเดียวกัน (https://your-site.example)
  • เว็บไซต์ฝัง iframe จาก https://trusted-site.example ที่คุณเชื่อถือ
  • เว็บไซต์ของคุณยังแสดงโฆษณาที่แสดงโดย https://ad.example ด้วย
  • คุณต้องอนุญาตให้ใช้ตำแหน่งทางภูมิศาสตร์สำหรับเว็บไซต์และเว็บไซต์ที่เชื่อถือได้เท่านั้น ไม่ใช่สำหรับโฆษณา

ในกรณีนี้ ให้ใช้ส่วนหัวต่อไปนี้

Permissions-Policy: geolocation=(self "https://trusted-site.example")

และตั้งค่าแอตทริบิวต์ allow เป็นแท็ก iframe สำหรับเว็บไซต์ที่เชื่อถือได้อย่างชัดเจน ดังนี้

<iframe src="https://trusted-site.example" allow="geolocation">

แผนภาพภาพรวมของการใช้นโยบายสิทธิ์แบบคร่าวๆ

ในตัวอย่างนี้ รายการต้นทางส่วนหัวอนุญาตให้เฉพาะเว็บไซต์ (self) และ trusted-site.example ใช้ฟีเจอร์ตำแหน่งทางภูมิศาสตร์ได้ ad.example ไม่ได้รับอนุญาตให้ใช้ตำแหน่งทางภูมิศาสตร์

  1. เว็บไซต์ your-site.example ของคุณได้รับอนุญาตให้ใช้ฟีเจอร์ตำแหน่งทางภูมิศาสตร์โดยต้องได้รับความยินยอมจากผู้ใช้
  2. iframe ต้นทางเดียวกัน (your-site.example) ได้รับอนุญาตให้ใช้ฟีเจอร์นี้โดยไม่ต้องใช้แอตทริบิวต์ allow
  3. iframe ที่ให้บริการจากโดเมนย่อยอื่น (subdomain.your-site-example) ที่ไม่ได้เพิ่มลงในรายการต้นทางและมีการตั้งค่าแอตทริบิวต์อนุญาตในแท็ก iframe ถูกบล็อกไม่ให้ใช้ฟีเจอร์นี้ โดยโดเมนย่อยที่ต่างกันจะถือเป็นเว็บไซต์เดียวกันแต่เป็นแบบข้ามต้นทาง
  4. iframe แบบข้ามต้นทาง (trusted-site.example) ที่เพิ่มลงในรายการต้นทางและมีการตั้งค่าแอตทริบิวต์ allow ในแท็ก iframe ได้รับอนุญาตให้ใช้ฟีเจอร์นี้
  5. iframe แบบข้ามต้นทาง (trusted-site.example) ที่เพิ่มลงในรายการต้นทางโดยไม่มีแอตทริบิวต์ allow ถูกบล็อกไม่ให้ใช้ฟีเจอร์นี้
  6. iframe แบบข้ามต้นทาง (ad.example) ซึ่งไม่ได้เพิ่มลงในรายการต้นทางถูกบล็อกไม่ให้ใช้ฟีเจอร์นี้ แม้ว่าแอตทริบิวต์ allow จะรวมอยู่ในแท็ก iframe ก็ตาม

ส่วนหัวการตอบกลับ HTTP Permissions-Policy

ผู้ใช้ส่งคำขอ เซิร์ฟเวอร์จะตอบกลับด้วยส่วนหัวนโยบายสิทธิ์ จากนั้นเบราว์เซอร์จะให้สิทธิ์การเข้าถึงตามส่วนหัวนั้น

Permissions-Policy: &lt;feature&gt;=(&lt;token&gt;|&lt;origin(s)&gt;)

ใช้ส่วนหัว Permissions-Policy ในการตอบกลับจากเซิร์ฟเวอร์เพื่อตั้งค่าต้นทางที่อนุญาตสำหรับฟีเจอร์ ค่าของส่วนหัวอาจใช้โทเค็นและสตริงต้นทางร่วมกัน โทเค็นที่ใช้ได้คือ * สําหรับต้นทางทั้งหมดและ self สําหรับต้นทางเดียวกัน

หากส่วนหัวมีไว้สำหรับหลายฟีเจอร์ ให้คั่นแต่ละฟีเจอร์ด้วยคอมมา หากแสดงต้นทางหลายรายการ ให้คั่นแต่ละต้นทางในรายการต้นทางด้วยการเว้นวรรค สำหรับส่วนหัวที่แสดงต้นทางที่เป็นคำขอข้ามต้นทาง แท็ก iframe ต้องมีแอตทริบิวต์ allow

ต่อไปนี้เป็นตัวอย่างคู่คีย์-ค่า

  • ไวยากรณ์: [FEATURE]=*
    • ใช้นโยบายกับต้นทางทั้งหมด
    • เช่น geolocation=*
  • ไวยากรณ์: [FEATURE]=(self)
    • ใช้นโยบายกับต้นทางเดียวกันแล้ว
    • เช่น geolocation=(self)
  • ไวยากรณ์: [FEATURE]=(self [ORIGIN(s)])
    • ใช้นโยบายกับต้นทางเดียวกันและต้นทางที่ระบุ
    • เช่น geolocation=(self "https://a.example" "https://b.example")
    • self เป็นชื่อย่อสำหรับ https://your-site.example
  • ไวยากรณ์: [FEATURE]=([ORIGIN(s)])
    • ใช้นโยบายกับต้นทางเดียวกันและต้นทางที่ระบุ
    • เช่น geolocation=("https://your-site.example" "https://a.example" "https://b.example")
    • เมื่อใช้ไวยากรณ์นี้ หนึ่งในต้นทางควรเป็นต้นทางของเครื่องมือฝัง หากหน้าตัวฝังเองไม่ได้รับสิทธิ์ iframe ที่ฝังอยู่ในหน้าเว็บนั้นจะถูกบล็อกด้วยแม้ว่าจะมีการเพิ่มเข้าในรายการต้นทางเนื่องจากนโยบายสิทธิ์จะมอบสิทธิ์ให้ หรือจะใช้โทเค็น self ก็ได้เช่นกัน
  • ไวยากรณ์: [FEATURE]=()
    • ฟีเจอร์ถูกบล็อกสำหรับทุกต้นทาง
    • เช่น geolocation=()

โดเมนย่อยและเส้นทางที่แตกต่างกัน

โดเมนย่อยที่ต่างกัน เช่น https://your-site.example และ https://subdomain.your-site.example จะถือว่าเป็นเว็บไซต์เดียวกันแต่ข้ามต้นทาง ดังนั้น การเพิ่มโดเมนย่อยในรายการต้นทางจะไม่อนุญาตให้เข้าถึงโดเมนย่อยอื่นของเว็บไซต์เดียวกัน คุณต้องเพิ่มโดเมนย่อยที่ฝังทั้งหมดที่ต้องการใช้ฟีเจอร์นี้แยกต่างหากลงในรายการต้นทาง เช่น หากอนุญาตให้เข้าถึงหัวข้อการท่องเว็บของผู้ใช้จากต้นทางเดียวกันโดยมีส่วนหัว Permissions-Policy: browsing-topics=(self) เท่านั้น iframe จากโดเมนย่อยอื่นของเว็บไซต์เดียวกัน https://subdomain.your-site.example จะไม่มีสิทธิ์เข้าถึงหัวข้อดังกล่าว

เส้นทางที่แตกต่างกัน เช่น https://your-site.example และ https://your-site.example/embed ถือเป็นต้นทางเดียวกัน และไม่จำเป็นต้องระบุเส้นทางที่แตกต่างกันในรายการต้นทาง

แอตทริบิวต์ของ iframe allow

การตั้งค่า iframe

สำหรับการใช้งานแบบข้ามต้นทาง iframe ต้องใช้แอตทริบิวต์ allow ในแท็กเพื่อรับสิทธิ์เข้าถึงฟีเจอร์

ไวยากรณ์: <iframe src="[ORIGIN]" allow="[FEATURE] <'src' | [ORIGIN(s)]"></iframe>

เช่น

<iframe src="https://trusted-site.example" allow="geolocation">

การจัดการการไปยังส่วนต่างๆ ของ iframe

ตั้งค่าการนำทางแบบ iframe

โดยค่าเริ่มต้น หาก iframe นำทางไปยังต้นทางอื่น นโยบายจะไม่มีผลกับต้นทางที่ iframe นั้นไป การระบุต้นทางที่ iframe นำทางไปในแอตทริบิวต์ allow นโยบายสิทธิ์ที่ใช้กับ iframe เดิมจะมีผลกับต้นทางที่ iframe เข้าไป

<iframe src="https://trusted-site.example" allow="geolocation https://trusted-site.example https://trusted-navigated-site.example">

คุณจะดูการทำงานจริงได้โดยไปที่การสาธิตการนำทางใน iframe

ตัวอย่างการตั้งค่านโยบายสิทธิ์

ดูตัวอย่างการตั้งค่าต่อไปนี้ได้ในการสาธิต

ฟีเจอร์ใช้ได้กับต้นทางทั้งหมด

สถาปัตยกรรมของต้นทางทั้งหมดที่ได้รับอนุญาตให้เข้าถึงฟีเจอร์นี้

Permissions-Policy: geolocation=*
<iframe src="https://trusted-site.example" allow="geolocation">
<iframe src="https://ad.example" allow="geolocation">

เมื่อตั้งค่ารายการต้นทางเป็นโทเค็น * ระบบจะอนุญาตฟีเจอร์นี้สำหรับต้นทางทั้งหมดที่แสดงในหน้า รวมถึงต้นทางและ iframe ทั้งหมดด้วย ในตัวอย่างนี้ โค้ดทั้งหมดที่แสดงจาก https://your-site.example และโค้ดที่แสดงจาก https://trusted-site.example iframe และ https://ad.example มีสิทธิ์เข้าถึงฟีเจอร์ตำแหน่งทางภูมิศาสตร์ในเบราว์เซอร์ของผู้ใช้ โปรดทราบว่าแอตทริบิวต์ Allow จะต้องได้รับการตั้งค่าบน iframe เอง พร้อมกับการเพิ่มต้นทางลงในรายการต้นทางของส่วนหัว

คุณสามารถดูการตั้งค่านี้ได้ในการสาธิต

ฟีเจอร์ใช้ได้เฉพาะในต้นทางเดียวกันเท่านั้น

สถาปัตยกรรมของต้นทางเดียวกันเท่านั้นที่ได้รับสิทธิ์ให้เข้าถึงฟีเจอร์

Permissions-Policy: geolocation=(self)

การใช้โทเค็น self อนุญาตให้ใช้ตำแหน่งทางภูมิศาสตร์กับต้นทางเดียวกันเท่านั้น แบบข้ามต้นทางจะไม่มีสิทธิ์เข้าถึงฟีเจอร์นี้ ในตัวอย่างนี้ มีเพียง https://trusted-site.example (self) เท่านั้นที่มีสิทธิ์เข้าถึงตำแหน่งทางภูมิศาสตร์ ใช้ไวยากรณ์นี้หากต้องการฟีเจอร์เฉพาะสำหรับหน้าเว็บของคุณ และไม่ต้องการให้ใครอื่นเลย

คุณสามารถดูการตั้งค่านี้ได้ในการสาธิต

ฟีเจอร์ได้รับอนุญาตในต้นทางเดียวกันและข้ามต้นทางที่เจาะจง

สถาปัตยกรรมของต้นทางที่ระบุซึ่งได้รับอนุญาตให้เข้าถึงฟีเจอร์

Permissions-Policy: geolocation=(self "https://trusted-site.example")

ไวยากรณ์นี้จะทำให้สามารถใช้ตำแหน่งทางภูมิศาสตร์กับทั้งตนเอง (https://your-site.example) และ https://trusted-site.example อย่าลืมเพิ่มแอตทริบิวต์ Allow ลงในแท็ก iframe อย่างชัดแจ้ง หากมี iframe อื่นที่มี <iframe src="https://ad.example" allow="geolocation"> https://ad.example จะไม่มีสิทธิ์เข้าถึงฟีเจอร์ตำแหน่งทางภูมิศาสตร์ เฉพาะหน้าเดิมและ https://trusted-site.example ที่แสดงในรายการต้นทางพร้อมแอตทริบิวต์อนุญาตในแท็ก iframe เท่านั้นที่จะมีสิทธิ์เข้าถึงฟีเจอร์ของผู้ใช้

คุณสามารถดูการตั้งค่านี้ได้ในการสาธิต

ฟีเจอร์ถูกบล็อกในต้นทางทั้งหมด

สถาปัตยกรรมของต้นทางทั้งหมดถูกบล็อกไม่ให้เข้าถึงฟีเจอร์

Permissions-Policy: geolocation=()

หากรายการต้นทางว่างเปล่า ระบบจะบล็อกฟีเจอร์สำหรับทุกต้นทาง คุณสามารถดูการตั้งค่านี้ได้ในการสาธิต

ใช้ JavaScript API

พบ JavaScript API ที่มีอยู่ของนโยบายฟีเจอร์เป็นออบเจ็กต์ในเอกสารหรือองค์ประกอบ (document.featurePolicy or element.featurePolicy) ยังไม่มีการใช้นโยบาย JavaScript API สำหรับสิทธิ์

คุณสามารถใช้ Feature Policy API สำหรับนโยบายที่กำหนดโดยนโยบายสิทธิ์ได้โดยมีข้อจำกัดบางประการ ทั้งนี้ คุณยังมีคำถามเหลืออยู่เกี่ยวกับการติดตั้งใช้งาน JavaScript API และมีข้อเสนอให้ย้ายตรรกะไปยัง Permissions API ด้วย เข้าร่วมการสนทนาหากคุณมีความคิดเห็นใดๆ

featurePolicy.allowsFeature(feature)

  • แสดงผล true หากฟีเจอร์ได้รับอนุญาตสำหรับการใช้ต้นทางเริ่มต้น
  • ลักษณะการทำงานจะเหมือนกันสำหรับทั้งนโยบายที่กำหนดโดยนโยบายสิทธิ์และนโยบายฟีเจอร์ก่อนหน้านี้
  • เมื่อมีการเรียกใช้ allowsFeature() ในองค์ประกอบ iframe (iframeEl.featurePolicy.allowsFeature('geolocation')) ค่าที่ส่งกลับจะแสดงให้เห็นหากมีการตั้งค่าแอตทริบิวต์อนุญาตใน iframe

featurePolicy.allowsFeature(feature, ต้นทาง)

  • แสดงผล true หากฟีเจอร์นั้นได้รับอนุญาตสำหรับต้นทางที่ระบุ
  • หากมีการเรียกเมธอดใน document เมธอดนี้จะไม่บอกอีกต่อไปว่าฟีเจอร์นั้นได้รับอนุญาตสำหรับต้นทางที่ระบุเหมือนกับที่นโยบายฟีเจอร์ใช้หรือไม่ ในตอนนี้ วิธีนี้จะช่วยให้ทราบว่าฟีเจอร์จะอนุญาตให้ใช้ในต้นทางนั้นได้ คุณต้องทำการตรวจสอบเพิ่มเติมว่า iframe มีการตั้งค่าแอตทริบิวต์ allow ไว้หรือไม่ นักพัฒนาซอฟต์แวร์ต้องทำการตรวจสอบแอตทริบิวต์ allow ในองค์ประกอบ iframe เพิ่มเติมเพื่อดูว่าฟีเจอร์ดังกล่าวได้รับอนุญาตสำหรับต้นทางของบุคคลที่สามหรือไม่

ตรวจหาฟีเจอร์ใน iframe ด้วยออบเจ็กต์ element

คุณสามารถใช้ element.allowsFeature(feature) ที่พิจารณาแอตทริบิวต์อนุญาต ซึ่งต่างจาก document.allowsFeature(feature, origin) ที่ไม่ได้พิจารณา

const someIframeEl = document.getElementById('some-iframe')
const isCameraFeatureAllowed = someIframeEl.featurePolicy.allowsFeature('camera')

featurePolicy.allowedFeatures()

  • แสดงรายการฟีเจอร์ที่อนุญาตสำหรับการใช้งานต้นทางเริ่มต้น
  • ลักษณะการทำงานจะเหมือนกันสำหรับทั้งนโยบายที่กำหนดโดยนโยบายสิทธิ์และนโยบายฟีเจอร์
  • เมื่อโหนดที่เกี่ยวข้องเป็น iframe ระบบจะพิจารณาแอตทริบิวต์อนุญาต

featurePolicy.features()

  • แสดงรายการฟีเจอร์ที่มีในเบราว์เซอร์
  • ลักษณะการทำงานจะเหมือนกันสำหรับทั้งนโยบายที่กำหนดโดยนโยบายสิทธิ์และนโยบายฟีเจอร์

การผสานรวมกับเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome

การผสานรวม Chrome DevTools กับนโยบายสิทธิ์

ดูวิธีการทำงานของนโยบายสิทธิ์ได้ในเครื่องมือสำหรับนักพัฒนาเว็บ

  1. เปิดเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome
  2. เปิดแผงแอปพลิเคชันเพื่อตรวจสอบฟีเจอร์ที่อนุญาตและฟีเจอร์ที่ไม่อนุญาตของแต่ละเฟรม
  3. ในแถบด้านข้าง ให้เลือกเฟรมที่ต้องการตรวจสอบ คุณจะเห็นรายการฟีเจอร์ที่เฟรมที่เลือกใช้ได้และรายการฟีเจอร์ที่ถูกบล็อกในเฟรมนั้น

การย้ายข้อมูลจากนโยบายฟีเจอร์

หากคุณกำลังใช้ส่วนหัว Feature-Policy โปรดทำตามขั้นตอนต่อไปนี้เพื่อย้ายข้อมูลไปยังนโยบายสิทธิ์

แทนที่ส่วนหัวนโยบายฟีเจอร์ด้วยส่วนหัวนโยบายสิทธิ์

เนื่องจากส่วนหัวนโยบายฟีเจอร์รองรับเฉพาะในเบราว์เซอร์แบบ Chromium และรองรับส่วนหัวนโยบายสิทธิ์ตั้งแต่ Chrome 88 ดังนั้นการอัปเดตส่วนหัวที่มีอยู่ด้วยนโยบายสิทธิ์จึงปลอดภัย

เก่า
Feature-Policy:
  autoplay *;
  geolocation 'self';
  camera 'self' 'https://trusted-site.example';
  fullscreen 'none';

ก่อนหน้านี้เกี่ยวกับนโยบายฟีเจอร์

ใหม่
Permissions-Policy:
  autoplay=*,
  geolocation=(self),
  camera=(self "https://trusted-site.example"),
  fullscreen=()

ตอนนี้มากับนโยบายสิทธิ์แล้ว

อัปเดตการใช้งาน document.allowsFeature(feature, origin)

หากคุณใช้เมธอด document.allowsFeature(feature, origin) เพื่อตรวจสอบฟีเจอร์ที่อนุญาตสำหรับ iframe ให้ใช้เมธอด allowsFeature(feature) ที่แนบมากับองค์ประกอบ iframe ไม่ใช่ document ที่มี เมธอด element.allowsFeature(feature) พิจารณาแอตทริบิวต์อนุญาต แต่ document.allowsFeature(feature, origin) ไม่ครอบคลุม

กำลังตรวจสอบการเข้าถึงฟีเจอร์กับ document

หากต้องการใช้ document เป็นโหนดพื้นฐานต่อไป คุณต้องตรวจสอบแอตทริบิวต์ allow เพิ่มเติมในแท็ก iframe

<iframe id="some-iframe" src="https://example.com" allow="camera"></iframe>
Permissions-Policy: camera=(self "https://example.com")
const isCameraPolicySet = document.featurePolicy.allowsFeature('camera', 'https://example.com')

const someIframeEl = document.getElementById('some-iframe')
const hasCameraAttributeValue = someIframeEl.hasAttribute('allow')
&& someIframeEl.getAttribute('allow').includes('camera')

const isCameraFeatureAllowed = isCameraPolicySet && hasCameraAttributeValue

แทนที่จะอัปเดตโค้ดที่มีอยู่โดยใช้ document ขอแนะนำให้เรียกใช้ allowsFeature() ในออบเจ็กต์ element เหมือนตัวอย่างก่อนหน้านี้

Reporting API

API การรายงานมีกลไกการรายงานสำหรับเว็บแอปพลิเคชันที่สอดคล้องกัน และ Reporting API สำหรับการละเมิดนโยบายสิทธิ์พร้อมให้บริการเป็นฟีเจอร์ทดลอง

หากคุณต้องการทดสอบฟีเจอร์ทดลอง ให้ทำตามคำแนะนำแบบทีละขั้นและเปิดใช้การแจ้งเตือนใน chrome://flags/#enable-experimental-web-platform-features เมื่อเปิดใช้แฟล็กแล้ว คุณสามารถดูการละเมิดนโยบายสิทธิ์ได้ในเครื่องมือสำหรับนักพัฒนาเว็บในแท็บแอปพลิเคชัน ดังนี้

ตัวอย่างต่อไปนี้แสดงวิธีการสร้างส่วนหัว Reporting API

Reporting-Endpoints: main-endpoint="https://reports.example/main", default="https://reports.example/default"

Content-Security-Policy: script-src 'self'; object-src 'none'; report-to main-endpoint;
Document-Policy: document-write=?0; report-to=main-endpoint;

ในการใช้งานปัจจุบัน คุณจะได้รับรายงานการละเมิดนโยบายจากการละเมิดที่เกิดขึ้นภายในเฟรมนั้นด้วยการกำหนดค่าปลายทางที่มีชื่อว่า "ค่าเริ่มต้น" ดังตัวอย่างข้างต้น เฟรมย่อยจะต้องมีการกำหนดค่าการรายงานของตนเอง

ดูข้อมูลเพิ่มเติม

โปรดดูแหล่งข้อมูลต่อไปนี้เพื่อทำความเข้าใจนโยบายสิทธิ์ให้ดียิ่งขึ้น