In deze handleiding demonstreren we hoe je de authenticatiestroom kunt bouwen met Logto in Capacitor. Hiermee kun je eenvoudig platformonafhankelijke aanmeld- en registratiestromen creëren.
In deze handleiding demonstreren we hoe je de authenticatiestroom kunt bouwen met Logto in Capacitor. Hiermee kun je eenvoudig platformonafhankelijke aanmeld- en registratiestromen creëren.
Voordat je begint, zorg ervoor dat je het volgende hebt:
Om te beginnen, maak je een Logto-toepassing van het type "Native". Logto-toepassingen dienen als clienttoepassingen in de OAuth 2.0- en OpenID Connect (OIDC)-stromen. Volg deze stappen om een Logto-toepassing te maken:
Na het maken van de Logto-toepassing, configureer je de omleidings-URI. De omleidings-URI wordt gebruikt om de gebruiker na de authenticatiestroom terug te leiden naar je toepassing.
Zorg ervoor dat de URI verwijst naar de Capacitor-app, bijvoorbeeld com.example.app://callback. De waarde kan variëren, afhankelijk van je Capacitor-appconfiguratie. Voor meer details, zie Capacitor Deep Links.
Vergeet niet op Wijzigingen opslaan te klikken na het bijwerken van de omleidings-URI.
Als je niet zeker weet wat de omleidings-URI moet zijn, kun je deze voorlopig leeg laten en later bijwerken.
Ervan uitgaande dat je al een Capacitor-project hebt, is deze handleiding framework-agnostisch, dus je kunt elk UI-framework gebruiken dat je verkiest en de code dienovereenkomstig aanpassen.
endpoint is het Logto API-eindpunt. Je kunt het vinden in de ingebouwde gids of de Domeinen sectie in de tenant-instellingen.appId is de Logto-toepassings-ID. Je kunt het vinden op de toepassingsdetailpagina.Voeg de volgende code toe aan de onClick-handler van de aanmeldknop:
Vervang com.example.app://callback door de omleidings-URI die je configureerde in de Logto-toepassing.
Voer de Capacitor-app uit en klik op de aanmeldknop. Een browservenster wordt geopend en leidt door naar de Logto-aanmeldpagina.
Aangezien Capacitor gebruikmaakt van de Safari View Controller op iOS en Chrome Custom Tabs op Android, kan de authenticatiestatus een tijdje bewaard blijven. Soms wil de gebruiker echter meteen uit de toepassing uitloggen. In dit geval kunnen we de signOut-methode gebruiken om de gebruiker uit te loggen:
De signOut-methode heeft een optionele parameter voor de omleidings-URI na het uitloggen. Als deze niet is opgegeven, wordt de gebruiker naar de Logto-uitlogpagina geleid:
De gebruiker moet op "Gereed" klikken om de webweergave te sluiten en terug te keren naar de Capacitor-app. Als je de gebruiker automatisch terug wilt leiden naar de Capacitor-app, kun je de omleidings-URI na het uitloggen opgeven:
Zorg ervoor dat de omleidings-URI na het uitloggen verwijst naar de Capacitor-app, en vergeet niet de omleidings-URI na het uitloggen toe te voegen aan de Logto-console:
Voer de Capacitor-app opnieuw uit en klik op de aanmeldknop. Als alles goed gaat, ontvangt de Capacitor-app het aanmeldresultaat wanneer de authenticatiestroom is voltooid en print de gebruikersclaims in de console.
Klik dan op de uitlogknop en de Capacitor-app wordt omgeleid naar de Logto-uitlogpagina. Het zal automatisch terugleiden naar de Capacitor-app als de omleidings-URI na het uitloggen is ingesteld.
Nu kun je de authenticatiestroom configureren in de Logto Cloud Console zonder complexe code te schrijven. De configuratie wordt toegepast op alle clienttoepassingen, waardoor een consistente gebruikerservaring wordt verzekerd.
Als je problemen ondervindt tijdens de integratie, aarzel dan niet om contact met ons op te nemen via e-mail op [email protected] of sluit je aan bij onze Discord-server!