Hur kan jag anpassa inloggningsupplevelsen för varje app eller organisation?
Hur man ställer in anpassade inloggningsupplevelser för företag med flera appar och flera hyresgäster.
Hur man ställer in anpassade inloggningsupplevelser för företag med flera appar och flera hyresgäster.
Att ställa in ett inloggningsflöde för din app är ganska vanligt, men ibland stöter du på ett lite mer komplext scenario,
Det enklaste tillvägagångssättet är att upprätthålla en universell inloggningsupplevelse för alla appar och organisationer. Till exempel erbjuder HubSpot ett brett utbud av produkter, men deras inloggningsupplevelse är konsekvent över alla. Detta hjälper till att betona moderbolaget, som HubSpot, snarare än individuella produkter som Marketing Hub.


Vissa företag följer en flerproduktstrategi men föredrar att behålla en enda användarpool. Till exempel, Atlassian, ett välkänt SaaS-företag, erbjuder flera mjukvaruprodukter som Jira och Confluence. Här är deras inloggningsskärm.

Inloggnings-URL:en inkluderar parametern ?bundle=jira-software för att indikera att detta är inloggningsgränssnittet för Jira-produkten.

Inloggnings-URL:en inkluderar parametern ?bundle=confluence för att specificera att detta inloggningsgränssnitt är för Confluence-produkten.
Skillnader i inloggnings-UI mellan apparna:
Dock förblir de viktigaste autentiseringsmetoderna konsekventa över alla appar. Detta garanterar att användarna har en enhetlig profil, inklusive sina identifikatorer (mail, sociala konton) och autentiseringsfaktorer (t.ex. lösenord), för mer effektiv identitetshantering.

Ett annat exempel är Notion, en app för flera hyresgäster som tillåter olika klienter att ha separata arbetsytor. Till exempel, om du anger
Om "Silverhand" är arbetsytans namn, kommer Notion att visa organisationsspecifikt inloggnings-UI. Den enda skillnaden är logotypen; allt annat förblir detsamma.
Först behöver du en identitets- och autentiseringslösning som grund att bygga på. Låt oss ta Logto som ett exempel för att visa lösningarna. Logto erbjuder olika alternativ för att uppnå detta:
Detta är den snabbaste och enklaste lösningen om du bara vill anpassa Logo och knappfärg.

Genom att slå på "app-nivå inloggningsupplevelse" kan du ställa in specifik branding och färger för varje app. När en inloggning initieras från en app med app-nivå branding aktiverad, kommer inloggningsupplevelsen att anpassas enligt app-nivå brandingsinställningar; annars kommer den att standardisera till omni inloggningsupplevelseinställningarna.
Både ljus- och mörklägesinställningar är tillgängliga för app-nivå branding. Inställningar för mörkt läge kommer endast att träda i kraft när mörkt läge är aktiverat i omni inloggningsupplevelseinställningar.

Därefter, när du triggar en inloggning, kan du passa organisations-ID i organization_id-parametern för att berätta för Logto vilken organisations logotyp som ska visas. Till exempel, för att visa organisationslogotypen för organisations-ID 123456:
organization_id-parametern i extraParams-objektet för signIn-metoden.organization_id-parametern när du begär auktoriseringsändpunkt.Här är ett exempel på hur man passerar organization_id-parametern i signIn-metoden med Logto browser SDK:
Om anpassning av logotyp och färg inte räcker — till exempel om du vill dölja specifika sociala inloggningsalternativ eller helt ändra utseendet och känslan — kan du ladda upp ditt eget UI till Logto Cloud.
För att visa olika UI:n baserat på appen eller organisationen, använd organization_id och app_id från sökparametrarna. Skriv sedan ett skript för att styra UI:n baserat på dessa parametrar. För mer detaljer, se "Ta med din egen UI"-tutorialen.