Wie man maßgeschneiderte Anmeldeerlebnisse für Multi-App- und Multi-Tenant-Unternehmen einrichtet.
Eine Anmeldestruktur für deine App einzurichten ist recht üblich, aber manchmal trifft man auf ein etwas komplexeres Szenario,
Der einfachste Ansatz ist, ein universelles Anmeldeerlebnis für alle Apps und Organisationen zu pflegen. Zum Beispiel bietet HubSpot eine breite Palette von Produkten an, aber deren Anmeldeerlebnis ist bei allen konsistent. Dies hilft, die übergeordnete Marke, wie HubSpot, zu betonen, anstatt die einzelnen Produkte wie Marketing Hub.
Einige Unternehmen verfolgen eine Multi-Produkt-Strategie, ziehen es jedoch vor, einen einzelnen Benutzerpool zu behalten. Zum Beispiel bietet das bekannte SaaS-Unternehmen Atlassian mehrere Softwareprodukte wie Jira und Confluence an. Hier ist ihr Anmeldebildschirm.
Die Anmelde-URL enthält den Parameter ?bundle=jira-software, um anzuzeigen, dass dies die Anmeldeoberfläche für das Jira-Produkt ist.
Die Anmelde-URL enthält den Parameter ?bundle=confluence, um zu spezifizieren, dass diese Anmeldeoberfläche für das Confluence-Produkt ist.
Unterschiede in der Anmelde-UI zwischen den Apps:
Die wichtigsten Authentifizierungsmethoden bleiben jedoch über alle Apps hinweg konsistent. Dies gewährleistet, dass Benutzer ein einheitliches Profil haben, einschließlich ihrer Kennungen (E-Mail, soziale Konten) und Authentifizierungsfaktoren (z.B. Passwörter), für ein effektiveres Identitätsmanagement.
Ein weiteres Beispiel ist Notion, eine Multi-Tenant-App, die es verschiedenen Kunden ermöglicht, separate Arbeitsbereiche zu hosten. Beispielsweise, wenn du eingibst
Wenn "Silverhand" der Arbeitsbereichsname ist, zeigt Notion die organisationsspezifische Anmelde-UI an. Der einzige Unterschied ist das Logo; alles andere bleibt gleich.
Zuerst benötigst du eine Identitäts- und Authentifizierungslösung als Basis zum Aufbau. Lass uns Logto als Beispiel nehmen, um die Lösungen zu zeigen. Logto bietet verschiedene Optionen, um dies zu erreichen:
Das ist die schnelle und einfachste Lösung, wenn du nur das Logo und die Knopffarbe anpassen möchtest.
Indem du die "app-spezifische Anmeldeerfahrung" aktivierst, kannst du spezifisches Branding und Farben für jede App festlegen. Wenn eine Anmeldung von einer App mit aktiviertem Branding auf App-Ebene initiiert wird, wird das Anmeldeerlebnis gemäß den Branding-Einstellungen auf App-Ebene angepasst; andernfalls bleibt es bei den Omni-Anmeldeerfahrungseinstellungen.
Sowohl Licht- als auch Dunkelmodus-Einstellungen sind für das Branding auf App-Ebene verfügbar. Die Dunkelmodus-Einstellungen treten nur in Kraft, wenn der Dunkelmodus in den Omni-Anmeldeerfahrungseinstellungen aktiviert ist.
Wenn du eine Anmeldung auslöst, kannst du die Organisation-ID im organization_id Parameter übergeben, um Logto mitzuteilen, welches Organisationslogo angezeigt werden soll. Zum Beispiel, um das Organisationslogo für die Organisations-ID 123456 zu zeigen:
organization_id Parameter im extraParams Objekt der signIn Methode übergeben.organization_id Parameter beim Anfordern des Authorization-Endpunkts übergeben.Hier ist ein Beispiel, wie du den organization_id Parameter in der signIn Methode mit dem Logto Browser SDK übergeben kannst:
Wenn es nicht ausreicht, das Logo und die Farbe anzupassen - zum Beispiel, wenn du bestimmte soziale Anmeldeoptionen ausblenden oder das gesamte Aussehen und Gefühl komplett ändern möchtest, kannst du dein eigenes UI in Logto Cloud hochladen.
Um verschiedene UIs basierend auf der App oder Organisation anzuzeigen, verwende die organization_id und app_id aus den Suchparametern. Schreibe dann ein Skript, um die UI basierend auf diesen Parametern zu steuern. Für mehr Details, schaue dir das Tutorial "Bring Your Own UI" an.