UX ของปุ่มลงชื่อเข้าใช้ด้วย Google

หน้านี้อธิบายประสบการณ์ของผู้ใช้ (UX) ของปุ่มลงชื่อเข้าใช้ด้วย Google

การแสดงปุ่ม

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

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

• มีเซสชัน Google ที่ใช้งานอยู่อย่างน้อย 1 เซสชัน
• มีบัญชีที่เกี่ยวข้องในเว็บไซต์ของคุณ

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

ระบบจะแสดงปุ่มที่ปรับเปลี่ยนในแบบของคุณในลักษณะต่อไปนี้เพื่อระบุสถานะเซสชัน

• เซสชันเดียว: มีเซสชันเดียวในฝั่งของ Google เซสชันนั้น อนุมัติไคลเอ็นต์ และมีบัญชีที่เกี่ยวข้องในเว็บไซต์ของคุณ

  

• หลายเซสชัน: มีหลายเซสชันในฝั่งของ Google เซสชันเหล่านั้น อนุมัติไคลเอ็นต์ การอนุมัติจะระบุด้วยลูกศรรายการ ข้างบัญชีที่แสดง เซสชันอย่างน้อย 1 รายการมีบัญชีที่เกี่ยวข้องในเว็บไซต์

  

• ไม่มีเซสชัน: ไม่มีเซสชันในฝั่ง Google หรือไม่มีเซสชันใด อนุมัติไคลเอ็นต์

  

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

• แอตทริบิวต์ data-type คือ icon
• ตั้งค่าแอตทริบิวต์ data-size เป็น medium หรือ small
• แอตทริบิวต์ data-width ตั้งค่าเป็นตัวเลขที่น้อยกว่า 200 พิกเซล
• มีการบล็อกคุกกี้ของบุคคลที่สาม และไม่ได้เปิดใช้เวอร์ชัน FedCM ของปุ่ม

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

Federated Credential Manager (FedCM)

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

ด้วยขั้นตอนปุ่ม Federated Credentials Management API (FedCM) ผู้ใช้จะเห็นปุ่มลงชื่อเข้าใช้ด้วย Google ที่ปรับตามโปรไฟล์ของผู้ใช้ในเว็บไซต์ของคุณ FedCM จะปิดใช้โดยค่าเริ่มต้น แต่คุณเปิดใช้ FedCM ได้โดยเปลี่ยนแอตทริบิวต์ 1 รายการ (HTML/JavaScript) ประโยชน์ของปุ่ม FedCM มีดังนี้

• ปรับปรุงประสบการณ์ของผู้ใช้ที่กลับมา: กระบวนการลงชื่อเข้าใช้ของผู้ใช้ที่กลับมาได้รับการปรับปรุงให้มีประสิทธิภาพมากขึ้น เนื่องจากผู้ใช้สามารถจดจำบัญชีที่มีอยู่ได้ การจดจำที่ดียิ่งขึ้นนี้ได้รับการพิสูจน์แล้วว่าช่วยเพิ่มอัตราการคลิกผ่าน (CTR) ได้ นอกจากนี้ ต่างจากโฟลว์ปุ่มที่ไม่ได้เปิดใช้ FedCM โฟลว์ปุ่ม FedCM รองรับฟีเจอร์เลือกอัตโนมัติ - ระบบจะลงชื่อเข้าใช้ผู้ใช้ที่กลับมา ซึ่งมีเซสชัน Google ที่ใช้งานอยู่โดยอัตโนมัติหลังจาก คลิกปุ่ม โดยไม่ต้องแสดงข้อความแจ้งตัวเลือกบัญชี

• การผสานรวมฟีเจอร์ที่ดียิ่งขึ้น: เราได้ผสานรวมฟังก์ชัน One Tap และการลงชื่อเข้าใช้อัตโนมัติ เพื่อให้ฟีเจอร์การลงชื่อเข้าใช้ด้วย Google ทั้งหมดของ Federated Credential Management (FedCM) จาก Relying Party (RP) รายเดียวทํางานร่วมกัน Chrome จะบันทึกและดำเนินการตาม ท่าทางสัมผัสของผู้ใช้ในขั้นตอนปุ่ม FedCM เพื่อดำเนินการยืนยันซ้ำแบบครั้งเดียวสำหรับขั้นตอนการลงชื่อเข้าใช้อัตโนมัติด้วย One Tap ซึ่งจะช่วยให้ได้รับประสบการณ์การใช้งานที่ราบรื่นในทุกฟีเจอร์

เส้นทางของผู้ใช้ที่สำคัญ

เส้นทางของผู้ใช้จะแตกต่างกันไปตามสถานะต่อไปนี้

• สถานะเซสชันในเว็บไซต์ของ Google คำศัพท์ต่อไปนี้ใช้เพื่อระบุ สถานะเซสชัน Google ที่แตกต่างกันเมื่อเส้นทางของผู้ใช้เริ่มต้น

  • Has-Google-session: มีเซสชันที่ใช้งานอยู่อย่างน้อย 1 เซสชันในเว็บไซต์ของ Google
  • ไม่มีเซสชัน Google: ไม่มีเซสชันที่ใช้งานอยู่บนเว็บไซต์ของ Google

• ไม่ว่าบัญชี Google ที่เลือกจะอนุมัติเว็บไซต์ของคุณเมื่อเส้นทางของผู้ใช้เริ่มต้นหรือไม่ คำต่อไปนี้ใช้เพื่อระบุสถานะการอนุมัติที่แตกต่างกัน

  • ผู้ใช้ใหม่: บัญชีที่เลือกยังไม่อนุมัติเว็บไซต์ของคุณ
  • ผู้ใช้ที่กลับมา: บัญชีที่เลือกเคยอนุมัติเว็บไซต์ของคุณแล้ว

เส้นทางของผู้ใช้ใหม่ที่มีเซสชัน Google

เส้นทางของผู้ใช้ที่กลับมาซึ่งมีเซสชัน Google

Has-Google-session ที่มีเส้นทางผู้ใช้ที่กลับมาซึ่งเลือกโดยอัตโนมัติ

เส้นทางของผู้ใช้ใหม่ที่ไม่มีเซสชัน Google

เส้นทางของผู้ใช้ที่กลับมาซึ่งไม่มีเซสชัน Google

เส้นทางการเดินทางของผู้ใช้ที่สำคัญของบัญชี Family Link

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

ข้อมูลเพิ่มเติมเกี่ยวกับโฟลว์ปุ่ม FedCM

• เพิ่มแอตทริบิวต์ allow="identity-credentials-get" ไปยังเฟรมหลักหากเว็บแอปเรียกใช้ Button API จาก iframe ข้ามโดเมน ดูข้อมูลเพิ่มเติมได้ที่ขั้นตอนที่ 7

• ตั้งค่านโยบายรักษาความปลอดภัยเนื้อหา (CSP) ของเว็บไซต์อย่างถูกต้อง ดูข้อมูลเพิ่มเติมได้ที่ขั้นตอนที่ 8

• สถานะระยะเวลาพักและการตั้งค่าการลงชื่อเข้าใช้ของบุคคลที่สามใน Chrome จะไม่มีผลต่อขั้นตอนปุ่ม FedCM สถานะ (ดังที่แสดงในภาพหน้าจอต่อไปนี้) จะมีผลต่อ UX การแตะครั้งเดียวเท่านั้น