如何自訂每個應用程式或組織的登入體驗？

為你的應用設置登入流程是相當常見的，但有時你會遇到一些複雜的情況，

1. 你經營一個多應用業務。
2. 你有一個支援不同工作區的多租戶應用。

最簡單的方法是為所有應用和組織維持一個通用的登入體驗。例如，HubSpot 提供多種產品，但它們的登入體驗在所有產品中是一致的。這有助於強調母品牌，比如 HubSpot，而不是像 Marketing Hub 這樣的個別產品。

應用層級登入#

一些企業遵循多產品策略，但希望保持單一用戶池。例如，知名的 SaaS 公司 Atlassian 提供多個軟件產品，如 Jira 和 Confluence。以下是他們的登入畫面。

登入 URL 包含參數 ?bundle=jira-software，表示這是 Jira 產品的登入界面。

登入 URL 包含參數 ?bundle=confluence，指定這是 Confluence 產品的登入界面。

應用之間登入 UI 的差異：

1. 他們使用不同的標誌來表示特定產品。
2. 他們有不同的外觀，如字體和按鈕樣式的變化。

然而，所有應用的關鍵身份驗證方法保持一致。這確保用戶擁有統一的個人資料，包括他們的身份標識（電郵、社交帳戶）和身份驗證因素（如密碼），以便更有效的身份管理。

組織層級登入#

另一個例子是 Notion，一個允許不同客戶託管獨立工作區的多租戶應用。例如，

如果 "Silverhand" 是工作區名稱，Notion 會顯示特定於組織的登入 UI。唯一的差異是標誌，其他一切保持不變。

如何自訂每個應用或組織的登入體驗？#

首先，你需要一個身份和身份驗證解決方案作為基礎進行構建。我們以 Logto 為例，展示解決方案。Logto 提供多種選擇來實現這一點：

在 Logto Cloud 上直接設置#

如果你只想自定義 Logo 和按鈕顏色，這是最快捷和最簡單的解決方案。

在應用層級配置#

通過開啟 "應用層級登入體驗", 你可以為每個應用設置特定的品牌和顏色。當從啟用了應用層級品牌的應用發起登入時，登入體驗將根據應用層級品牌設置進行自訂；否則，它將默認為全域登入體驗設定。

應用層級品牌提供亮模式和暗模式設置。當全域登入體驗設置中啟用了暗模式時，暗模式設置才會生效。

在組織層級配置#

然後，當觸發登入時，你可以在 organization_id 參數中傳遞組織 ID，告訴 Logto 顯示哪個組織的標誌。例如，要顯示組織 ID 123456 的組織標誌：

• 如果你使用的是 Logto SDK，你可以在 signIn 方法的 extraParams 對象中傳遞 organization_id 參數。
• 如果你使用的是 OIDC 客戶端，你可以在請求 authorization endpoint 時傳遞 organization_id 參數。

以下是在使用 Logto 瀏覽器 SDK 中如何在 signIn 方法中傳遞 organization_id 參數的範例：

自定義 UI 如果你需要更詳細的自訂#

如果自定義 Logo 和顏色還不足夠——例如，如果你想隱藏特定的社交登入選項或完全改變外觀和感覺——你可以將自己的 UI 上傳到 Logto Cloud。

要根據應用或組織顯示不同的 UI，請從搜尋參數中使用 organization_id 和 app_id。然後，撰寫腳本根據這些參數控制 UI。欲了解更多詳細信息，請參閱 "Bring Your Own UI" 教程。