• authentication
  • user-experience
  • sign-in
  • sign-up

เคล็ดลับเล็ก ๆ น้อย ๆ เพื่อปรับปรุงประสบการณ์การลงชื่อเข้าใช้งานของลูกค้า

เรียนรู้วิธีการเพิ่มประสบการณ์การลงทะเบียนผู้ใช้ด้วยพารามิเตอร์การรับรองความถูกต้องของ Logto

Simeng
Simeng
Developer

ที่ Logto เราให้ความสำคัญกับการปรับปรุงกระบวนการลงทะเบียนผู้ใช้สำหรับลูกค้าเป็นอย่างมาก เราเข้าใจถึงความสำคัญของการทำให้ประสบการณ์การลงทะเบียนและเข้าสู่ระบบของผู้ใช้งานเป็นไปอย่างราบรื่นและไม่มีสะดุด ในบทความนี้ เราจะแบ่งปันเคล็ดลับเล็ก ๆ น้อย ๆ สองข้อที่คุณควรใช้เพื่อปรับปรุงประสบการณ์การลงทะเบียนของผู้ใช้

หน้าจอแรก

มาลองศึกษากระบวนการรับรองความถูกต้อง OIDC สั้น ๆ กันเถอะ

เมื่อผู้ใช้ส่งคำขอรับรองความถูกต้องจากแอปพลิเคชันไคลเอ็นต์ จะมีการเริ่มต้นเซสชันรับรองความถูกต้อง OIDC ใน Logto ผู้ใช้จะถูกนำไปยังหน้าเข้าสู่ระบบที่ Logto โฮสต์เพื่อป้อนข้อมูลรับรองและตรวจสอบตัวตนของพวกเขา เมื่อผู้ใช้เข้าสู่ระบบสำเร็จ การตอบกลับการรับรองความถูกต้องจะถูกส่งกลับไปยังแอปพลิเคชันไคลเอ็นต์

โดยค่าเริ่มต้น จะมีการนำเสนอหน้าจอลงชื่อเข้าใช้แก่ผู้ใช้

Sign-in screen

หากผู้ใช้ไม่มีบัญชี เขาสามารถคลิกที่ปุ่ม Register เพื่อเปลี่ยนไปยังหน้าจอลงทะเบียน

Sign-up screen

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

สิ่งนี้สามารถทำได้ง่าย ๆ โดยการเพิ่มพารามิเตอร์ first_screen ลงในคำขอรับรองความถูกต้องของคุณ

หรือใน SDK ที่รองรับ:

พารามิเตอร์ first_screen สามารถรับค่าสองค่า: signIn หรือ register

โดยการตั้งพารามิเตอร์ first_screen เป็น register คุณสามารถข้ามหน้าจอลงชื่อเข้าใช้และนำผู้ใช้ไปยังหน้าจอลงทะเบียนโดยตรง

เช่นเดียวกับ หน้าแรก Logto ของเรา

เริ่มต้น

เมื่อผู้ใช้คลิกที่ปุ่ม Get started พวกเขาจะถูกนำไปยังหน้าจอลงทะเบียนโดยตรง

ยินดีต้อนรับ

การลงชื่อเข้าใช้โดยตรง

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

สิ่งนี้มีประโยชน์โดยเฉพาะอย่างยิ่งเมื่อคุณมีจุดเริ่มต้น SSO สังคมและองค์กรของคุณเองและต้องการข้ามหน้าจอลงชื่อเข้าใช้ของ Logto

ตัวอย่างเช่น หากไม่ได้ระบุพารามิเตอร์ direct_sign_in การเดินทางของผู้ใช้ SSO องค์กรจะเป็นแบบนี้:

  1. แสดงหน้าจอลงชื่อเข้าใช้ค่าเริ่มต้น
  2. ป้อนที่อยู่อีเมล
SSO
  1. ตรวจพบการลงชื่อเข้าใช้เดียวและผู้ใช้จะคลิกที่ปุ่ม Single Sign-On เพื่อเริ่มต้นไหล SSO

  2. นอกจากนี้ หากกำหนดค่าให้มีผู้ให้บริการ SSO หลายรายภายใต้โดเมนอีเมลเดียวกัน ผู้ใช้จะได้รับการแจ้งให้เลือกผู้ให้บริการ SSO ที่ต้องการ

SSO list

การไหลนี้สามารถเรียบง่ายขึ้นได้หากคุณทราบผู้ให้บริการ SSO ที่ผู้ใช้ต้องการล่วงหน้า

พารามิเตอร์ direct_sign_in สามารถรับค่าต่อไปนี้:

  • social:<provider-name>: เริ่มต้นการไหลของการรับรองความถูกต้องของสังคมที่สามโดยตรง (เช่น social:google)
  • sso:<connector-id>: เริ่มต้นการไหลของการรับรองความถูกต้องของ SSO องค์กรโดยตรง (เช่น sso:1234567890)

เพิ่มพารามิเตอร์ direct_sign_in ลงในคำขอรับรองความถูกต้องของคุณ:

หรือใน SDK ที่รองรับ:

ด้วยพารามิเตอร์ direct_sign_in ผู้ใช้จะถูกเปลี่ยนเส้นทางไปยังหน้าการรับรองความถูกต้องของผู้ให้บริการให้ตนทได้อย่างโดยตรง ลดจำนวนขั้นตอนที่ต้องการเพื่อทำกระบวนการรับรองความถูกต้องให้สมบูรณ์

สรุป

ที่ Logto เราจริงจังกับประสบการณ์ผู้ใช้มาก การใช้พารามิเตอร์ first_screen และ direct_sign_in ช่วยให้คุณสามารถปรับปรุงกระบวนการลงทะเบียนลูกค้าได้อย่างมาก

หากคุณต้องการสร้างหน้าจอลงทะเบียนที่มีการปรับแต่งและดูดีกว่า อย่าลืมสำรวจฟีเจอร์ custom-css ของเรา

สำหรับข้อมูลเพิ่มเติม โปรดดู พารามิเตอร์การรับรองความถูกต้อง