ย้ายข้อมูลไปยัง FedCM

คู่มือนี้ช่วยให้คุณเข้าใจการเปลี่ยนแปลงเกี่ยวกับเว็บแอปพลิเคชันที่ดำเนินการโดย Federated Credentials Management API (FedCM)

เมื่อเปิดใช้ FedCM เบราว์เซอร์จะแสดงข้อความแจ้งของผู้ใช้และจะไม่มีการใช้คุกกี้ของบุคคลที่สาม

ภาพรวม

Privacy Sandbox สําหรับเว็บและการนําคุกกี้ของบุคคลที่สามออกจากเว็บของ Chrome จะทำให้เกิดการเปลี่ยนแปลงที่สำคัญในบริการ Google Identity และการลงชื่อเข้าใช้ของผู้ใช้

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

สำหรับเว็บไซต์ส่วนใหญ่ การย้ายข้อมูลจะเกิดขึ้นอย่างราบรื่นผ่านการอัปเดตไลบรารี JavaScript ของบริการ Google Identity ที่เข้ากันได้แบบย้อนหลัง

ก่อนเริ่มต้น

ตรวจสอบว่าเบราว์เซอร์และเวอร์ชันของเบราว์เซอร์รองรับ FedCM API อัปเดตเป็นเวอร์ชันใหม่กว่า หากจำเป็น

ก่อนที่จะทดสอบขั้นตอนการลงชื่อเข้าใช้ด้วยคุกกี้ของบุคคลที่สามที่ถูกบล็อก ให้เปิด chrome://flags แล้วเปิดใช้ฟีเจอร์ FedCmWithoutThirdPartyCookies แบบทดลอง ขั้นตอนนี้จะจำเป็นจนกว่าจะเป็นค่าเริ่มต้นเท่านั้น นอกจากนี้ ยังต้องเปิดใช้การตั้งค่าการลงชื่อเข้าใช้ของบุคคลที่สามใน Chrome ด้วย

ย้ายข้อมูลเว็บแอปของคุณ

ทำตามขั้นตอนต่อไปนี้เพื่อเปิดใช้ FedCM ประเมินผลกระทบที่อาจเกิดขึ้นในการย้ายข้อมูล และหากจำเป็นเพื่อเปลี่ยนแปลงเว็บแอปพลิเคชันที่มีอยู่

1. เพิ่มธงบูลีนเพื่อเปิดใช้ FedCM เมื่อเริ่มต้นโดยใช้:

• HTML ให้ตั้งค่าแอตทริบิวต์ data-use_fedcm_for_prompt เป็น true

• JavaScript โดยตั้งค่า use_fedcm_for_prompt เป็น true ในออบเจ็กต์ IdConfiguration

2. ลบการใช้เมธอด isDisplayMoment(), isDisplayed(), isNotDisplayed() และ getNotDisplayedReason() ในโค้ดของคุณ

เพื่อปรับปรุงความเป็นส่วนตัวของผู้ใช้ โค้ดเรียกกลับของ google.accounts.id.prompt จะไม่แสดงการแจ้งเตือน Display Moment ในออบเจ็กต์ PromptMomentNotication อีกต่อไป นำโค้ดที่ขึ้นอยู่กับวิธีการที่เกี่ยวข้องกับช่วงเวลาที่แสดงออก ซึ่งได้แก่ isDisplayMoment(), isDisplayed(), isNotDisplayed() และ getNotDisplayedReason()

3. ลบการใช้เมธอด getSkippedReason() ในโค้ดของคุณ

ถึงแม้ว่าช่วงเวลาของการข้าม "isSkippedMoment()" จะยังถูกเรียกจากโค้ดเรียกกลับ google.accounts.id.prompt ในออบเจ็กต์ PromptMomentNotication แต่จะไม่ได้ระบุเหตุผลโดยละเอียด นำโค้ดที่ขึ้นอยู่กับเมธอด getSkippedReason() ออกจากโค้ด

โปรดทราบว่าการแจ้งเตือน Moments ที่ปิดไป isDismissedMoment() และวิธีเหตุผลโดยละเอียดที่เกี่ยวข้อง ซึ่งก็คือ getDismissedReason() จะไม่มีการเปลี่ยนแปลงเมื่อเปิดใช้ FedCM

4. นำแอตทริบิวต์รูปแบบ position ออกจาก data-prompt_parent_id และ intermediate_iframes

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

5. อัปเดตเลย์เอาต์ของหน้าหากจำเป็น

เบราว์เซอร์จะควบคุมขนาดและตำแหน่งข้อความแจ้งของผู้ใช้ ระบบไม่รองรับเนื้อหาบางอย่าง เช่น แอตทริบิวต์สไตล์, data-prompt_parent_id, intermediate_iframes, iframe ที่กำหนดเอง และวิธีสร้างสรรค์อื่นๆ ทั้งนี้ขึ้นอยู่กับเลย์เอาต์ของแต่ละหน้า

เปลี่ยนเลย์เอาต์ของหน้าเพื่อปรับปรุงประสบการณ์ของผู้ใช้เมื่อข้อมูลสําคัญถูกบดบัง อย่าสร้าง UX รอบข้อความแจ้งของ One Tap แม้ว่าคุณจะคิดว่าปุ่มจะอยู่ในตำแหน่งเริ่มต้นก็ตาม เนื่องจาก FedCM API ต้องใช้สื่อกลางเบราว์เซอร์ ผู้ให้บริการเบราว์เซอร์ที่แตกต่างกันอาจวางตำแหน่งของข้อความแจ้งแตกต่างกันเล็กน้อย

6. เพิ่มแอตทริบิวต์ allow="identity-credentials-get" ลงในเฟรมหลักหากเว็บแอปเรียกใช้ One Tap API จาก iframe แบบข้ามต้นทาง

ระบบจะถือว่า iframe เป็นแบบข้ามต้นทางหากต้นทางไม่ตรงกับต้นทางระดับบนสุด ตัวอย่างเช่น:

• โดเมนต่างกัน: https://example1.com และ https://example2.com
• โดเมนระดับบนสุดต่างกัน: https://example.uk และ https://example.jp

• โดเมนย่อย: https://example.com และ https://login.example.com

  เมื่อมีการเรียก One Tap API จาก iframe แบบข้ามต้นทาง คุณต้องเพิ่มแอตทริบิวต์ allow="identity-credentials-get" ในแท็ก iframe ของเฟรมระดับบนสุดทั้งหมด เพื่อปรับปรุงความเป็นส่วนตัวของผู้ใช้

  <iframe src="https://your.cross-origin/onetap.page" allow="identity-credentials-get"></iframe>
  

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

  ตัวอย่างเช่น โปรดพิจารณาสถานการณ์สมมติต่อไปนี้

• เอกสารด้านบน (https://www.example.uk) มี iframe ชื่อ "Iframe A" ซึ่งฝังหน้าเว็บ (https://logins.example.com)

• หน้าที่ฝังนี้ (https://logins.example.com) ยังมี iframe ชื่อ "Iframe B" ซึ่งฝังหน้าเว็บ (https://onetap.example2.com) ที่โฮสต์ One Tap เพิ่มเติม

  เพื่อให้แน่ใจว่าการแตะครั้งเดียวจะแสดงได้อย่างถูกต้อง จึงต้องเพิ่มแอตทริบิวต์ลงในทั้งแท็ก Iframe A และ Iframe B

  เตรียมพร้อมสำหรับการตอบคำถามในข้อความแจ้งของ One Tap ที่ไม่ปรากฏ เว็บไซต์อื่นๆ ที่มีต้นทางต่างกันอาจฝังหน้าเว็บที่โฮสต์ One Tap ไว้ใน iframe ของเว็บไซต์นั้นๆ คุณอาจได้รับตั๋วสนับสนุนเพิ่มขึ้นซึ่งเกี่ยวข้องกับ One Tap ที่ไม่ปรากฏจากผู้ใช้ปลายทางหรือเจ้าของเว็บไซต์คนอื่นๆ แม้ว่าเจ้าของเว็บไซต์จะทำได้เพียงเจ้าของเว็บไซต์ในหน้าเว็บของตนเท่านั้น แต่คุณสามารถดำเนินการต่อไปนี้เพื่อลดผลกระทบได้

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

• อัปเดตหน้าคำถามที่พบบ่อยของนักพัฒนาแอป (หากมี)

• แจ้งให้ทีมสนับสนุนของคุณทราบการเปลี่ยนแปลงที่กำลังจะเกิดขึ้นนี้ และเตรียมพร้อมสำหรับการตอบกลับ คำถามล่วงหน้า

• ติดต่อพาร์ทเนอร์ ลูกค้า หรือเจ้าของเว็บไซต์ที่ได้รับผลกระทบในเชิงรุกเพื่อให้การเปลี่ยนแปลงของ FedCM เป็นไปอย่างราบรื่น

7. เพิ่มคำสั่งเหล่านี้ลงในนโยบายรักษาความปลอดภัยเนื้อหา (CSP)

ขั้นตอนนี้เป็นขั้นตอนที่ไม่บังคับเนื่องจากเว็บไซต์บางแห่งอาจเลือกกำหนด CSP ไม่ได้ * คุณไม่จำเป็นต้องทำการเปลี่ยนแปลงหากไม่ได้ใช้ CSP ในเว็บไซต์ * หาก CSP ใช้งานได้สำหรับ One Tap ปัจจุบันและไม่ได้ใช้ connect-src, frame-src, script-src, style-src หรือ default-src ก็ไม่จำเป็นต้องทำการเปลี่ยนแปลง * หรือทำตามคำแนะนำนี้เพื่อตั้งค่า CSP หากไม่มีการตั้งค่า CSP ที่เหมาะสม FedCM One Tap จะไม่แสดงในเว็บไซต์

8. ลบการรองรับ Accelerated Mobile Pages (AMP) สำหรับการลงชื่อเข้าใช้

การรองรับการลงชื่อเข้าใช้ของผู้ใช้สำหรับ AMP เป็นฟีเจอร์เสริมของ GIS ที่เว็บแอปอาจใช้ หากเป็นเช่นนี้

ลบการอ้างอิงไปยังรายการต่อไปนี้

• องค์ประกอบที่กำหนดเอง amp-onetap-google รายการ และ

• <script async custom-element="amp-onetap-google" src="https://cdn.ampproject.org/v0/amp-onetap-google-0.1.js"></script>

  ลองเปลี่ยนเส้นทางคำขอลงชื่อเข้าใช้จาก AMP ไปยังขั้นตอนการลงชื่อเข้าใช้ HTML ของเว็บไซต์ โปรดทราบว่า Intermediate Iframe Support API ที่เกี่ยวข้องจะไม่ได้รับผลกระทบ