ฉันจะปรับแต่งประสบการณ์การลงชื่อเข้าใช้สำหรับแต่ละแอปหรือองค์กรได้อย่างไร?

การตั้งค่าการทำงานของการลงชื่อเข้าใช้สำหรับแอปของคุณค่อนข้างทั่วไป แต่บางครั้งคุณอาจเจอสถานการณ์ที่ซับซ้อนเล็กน้อย

1. คุณดำเนินธุรกิจหลายแอป
2. คุณมีแอปหลายผู้เช่าที่สนับสนุนพื้นที่ทำงานต่างๆ

วิธีที่ง่ายที่สุดคือการรักษาประสบการณ์การลงชื่อเข้าใช้แบบสากลสำหรับทุกแอปและทุกองค์กร ตัวอย่างเช่น HubSpot มีผลิตภัณฑ์หลากหลาย แต่ประสบการณ์การลงชื่อเข้าใช้ของพวกเขาคงที่ในทุกๆ แอป ซึ่งช่วยเน้นแบรนด์หลัก เช่น HubSpot แทนที่จะเป็นผลิตภัณฑ์ที่แยกออกมาต่างหากอย่าง Marketing Hub

การลงชื่อเข้าใช้อันดับแอป#

บางธุรกิจใช้กลยุทธ์หลากหลายผลิตภัณฑ์แต่ชอบการรักษากลุ่มผู้ใช้เดียว ตัวอย่างเช่น Atlassian บริษัท SaaS ที่มีชื่อเสียง มีซอฟต์แวร์หลายผลิตภัณฑ์เช่น Jira และ Confluence นี่คอหน้าเข้าสู่ระบบของพวกเขา

URL การลงชื่อเข้าใช้รวมถึงพารามิเตอร์ ?bundle=jira-software เพื่อระบุว่านี่คืออินเตอร์เฟซการลงชื่อเข้าใช้สำหรับผลิตภัณฑ์ Jira

URL การลงชื่อเข้าใช้รวมถึงพารามิเตอร์ ?bundle=confluence เพื่อระบุว่านี่คืออินเตอร์เฟซการลงชื่อเข้าใช้สำหรับผลิตภัณฑ์ Confluence

ความแตกต่างใน UI การลงชื่อเข้าใช้ระหว่างแอปคือ:

1. พวกเขาใช้โลโก้ที่แตกต่างกันเพื่อระบุผลิตภัณฑ์ที่เฉพาะ
2. ลักษณะภายนอกแตกต่างกัน เช่น ตัวอักษรและปุ่มที่หลากหลาย

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

การลงชื่อเข้าใช้อันดับองค์กร#

ตัวอย่างอีกอย่างคือ Notion แอปหลายผู้เช่าที่อนุญาตให้ลูกค้าต่างๆ โฮสต์พื้นที่ทำงานเฉพาะกันได้ ยกตัวอย่างเช่น ถ้าคุณป้อน

ถ้า "Silverhand" คือชื่อพื้นที่ทำงาน Notion จะแสดง UI การลงชื่อเข้าใช้ที่เฉพาะเจาะจงสำหรับองค์กร ความแตกต่างเดียวคือโลโก้ อื่นๆ ยังคงเหมือนเดิม

ฉันจะปรับแต่งประสบการณ์การลงชื่อเข้าใช้สำหรับแต่ละแอปหรือองค์กรได้อย่างไร?#

ก่อนอื่นคุณต้องการโซลูชันการยืนยันตัวตนเป็นพื้นฐานในการสร้างขึ้น ยกตัวอย่าง Logto เพื่อแสดงโซลูชันที่เป็นไปได้ Logto มีทางเลือกมากมายเพื่อให้สำเร็จดังนี้:

การตั้งค่าโดยตรงใน Logto Cloud#

นี่คือโซลูชันที่เร็วและง่ายที่สุดถ้าคุณต้องการเพียงปรับเปลี่ยนโลโก้และสีของปุ่ม

การตั้งค่าในระดับแอป#

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

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

การตั้งค่าในระดับองค์กร#

จากนั้นเมื่อเกิดการลงชื่อเข้าใช้ คุณสามารถส่งผ่าน ID ขององค์กรในพารามิเตอร์ organization_id เพื่อบอก Logto ว่าจะต้องแสดงโลโก้ขององค์กรไหน ยกตัวอย่างเช่น การแสดงโลโก้ขององค์กรจาก ID 123456:

• หากคุณใช้ Logto SDK คุณสามารถส่งผ่านพารามิเตอร์ organization_id ในวัตถุ extraParams ของเมธอด signIn
• หากคุณใช้คล้าย OIDC คุณสามารถส่งผ่านพารามิเตอร์ organization_id เมื่อกำลังขอจุดเชื่อมต่อ authorization endpoint

นี่คือตัวอย่างของวิธีการส่งผ่านพารามิเตอร์ organization_id ในเมธอด signIn โดยใช้ Logto browser SDK:

นำ UI ที่คุณต้องการเข้ามาหากคุณต้องการการปรับแต่งที่ละเอียดมากขึ้น#

หากการปรับแต่งโลโก้และสีไม่เพียงพอ เช่น ถ้าคุณต้องการซ่อนตัวเลือกการลงชื่อเข้าใช้ทางโซเชียลที่เฉพาะเจาะจงหรือเปลี่ยนลักษณะภายนอกอย่างสมบูรณ์ คุณสามารถอัปโหลด UI ของคุณเองไปยัง Logto Cloud

การแสดง UI ที่แตกต่างกันตามแอปหรือองค์กร ให้ใช้ organization_id และ app_id จากพารามิเตอร์การค้นหา แล้วเขียนสคริปต์เพื่อควบคุม UI ตามพารามิเตอร์เหล่านั้น สำหรับรายละเอียดเพิ่มเติม ดูบทแนะนำ "Bring Your Own UI"