Hoe aangepaste aanmeldings-ervaringen in te stellen voor bedrijven met meerdere apps en meerdere tenants.
Het instellen van een aanmeldingsstroom voor je app is vrij gebruikelijk, maar soms kom je een iets complexer scenario tegen,
De eenvoudigste benadering is het behouden van een universele aanmeldings-ervaring voor alle apps en organisaties. Een voorbeeld: HubSpot biedt een breed scala aan producten, maar hun aanmeldings-ervaring is consistent voor al deze producten. Dit helpt om het moedermerk, zoals HubSpot, te benadrukken, in plaats van afzonderlijke producten zoals Marketing Hub.
Sommige bedrijven volgen een multi-productstrategie, maar geven de voorkeur aan een enkele gebruikerspool. Bijvoorbeeld, Atlassian, een bekend SaaS-bedrijf, biedt meerdere softwareproducten zoals Jira en Confluence. Hier is hun aanmeldingsscherm.
De aanmeld-URL bevat de parameter ?bundle=jira-software om aan te geven dat dit de aanmeldinterface voor het Jira-product is.
De aanmeld-URL bevat de parameter ?bundle=confluence om aan te geven dat deze aanmeldinterface voor het Confluence-product is.
Verschillen in de aanmeldings-UI tussen de apps:
Echter, de belangrijkste authenticatiemethoden blijven consistent over alle apps. Dit zorgt ervoor dat gebruikers een verenigd profiel hebben, inclusief hun identificatiemiddelen (e-mail, sociale accounts) en authenticatiefactoren (bijv. wachtwoorden), voor effectievere identiteitsbeheer.
Een ander voorbeeld is Notion, een multi-tenant app die verschillende klanten afzonderlijke werkruimten laat hosten. Bijvoorbeeld, als je invoert
Als "Silverhand" de werkruimte-naam is, zal Notion de organisatie-specifieke aanmeldings-UI tonen. Het enige verschil is het logo; de rest blijft hetzelfde.
Eerst heb je een identiteit- en authenticatieoplossing nodig als basis om op te bouwen. Laten we Logto als voorbeeld nemen om de oplossingen te tonen. Logto biedt verschillende opties om dit te bereiken:
Dit is de snelle en eenvoudigste oplossing als je alleen het logo en de knopkleur wilt aanpassen.
Door "app-niveau aanmeldings-ervaring" in te schakelen, kun je specifieke branding en kleuren voor elke app instellen. Wanneer een aanmelding wordt gestart vanuit een app met ingeschakelde app-niveau branding, zal de aanmeldings-ervaring worden aangepast volgens de app-niveau branding-instellingen; anders zal het standaard de omni aanmeldings-ervaring-instellingen volgen.
Zowel lichte als donkere modus-instellingen zijn beschikbaar voor app-niveau branding. Donkere modus-instellingen zijn alleen van kracht wanneer de donkere modus is ingeschakeld in de omni aanmeldings-ervaring-instellingen.
Vervolgens, bij het starten van een aanmelding, kun je de organisatie-ID doorgeven in de organization_id parameter om Logto te vertellen welk organisatie-logo moet worden weergegeven. Bijvoorbeeld, om het organisatie-logo voor organisatie-ID 123456 te tonen:
organization_id parameter doorgeven in het extraParams object van de signIn methode.organization_id parameter doorgeven bij het aanvragen van het authorization endpoint.Hier is een voorbeeld van hoe je de organization_id parameter kunt doorgeven in de signIn methode met behulp van de Logto browser SDK:
Als het aanpassen van het logo en de kleur niet voldoende is – bijvoorbeeld als je specifieke sociale aanmeldingsopties wilt verbergen of de look en feel volledig wilt veranderen – kun je je eigen UI uploaden naar Logto Cloud.
Om verschillende UI's weer te geven op basis van de app of organisatie, gebruik de organization_id en app_id van de zoekparameters. Schrijf dan een script om de UI te controleren op basis van deze parameters. Voor meer details, raadpleeg de "Breng je eigen UI" tutorial.