Apprends à construire un flux d'authentification utilisateur avec Expo (React Native) en intégrant le SDK Logto.
Dans ce tutoriel, nous allons vous montrer comment créer un flux d'authentification utilisateur avec Expo (React Native) en intégrant le SDK Logto. Le tutoriel utilise TypeScript comme langage de programmation.
Avant de commencer, assurez-vous d'avoir les éléments suivants :
Pour commencer, créez une application Logto avec le type "Native". Suivez ces étapes pour créer une application Logto :
Vous devriez ensuite voir un guide interactif qui vous guide à travers le processus d'intégration du SDK Logto avec votre application Expo (React Native). Le contenu suivant peut être une référence pour une utilisation future.
Installe le SDK Logto et ses dépendances via ton gestionnaire de paquets préféré :
Le package @logto/rn est le SDK pour Logto. Les autres packages sont ses dépendances. Elles ne peuvent pas être listées comme des dépendances directes car l'Expo CLI requiert que toutes les dépendances pour les modules natifs soient installées directement dans le package.json du projet racine.
Importe et utilise LogtoProvider pour fournir un contexte Logto :
Passe à la page de détails de l'application de la Console Logto. Ajoute un URI de redirection native (par exemple, io.logto://callback), puis clique sur "Enregistrer".
Pour iOS, le schéma de l'URI de redirection n'a pas vraiment d'importance puisque la classe ASWebAuthenticationSession écoutera l'URI de redirection qu'il soit enregistré ou non.
Pour Android, le schéma de l'URI de redirection doit être renseigné dans le fichier app.json d'Expo, par exemple :
Reviens maintenant à ton application, tu peux utiliser le hook useLogto pour te connecter et te déconnecter :
Pour afficher les informations de l'utilisateur, tu peux utiliser la méthode getIdTokenClaims() :
Vous pouvez maintenant exécuter l'application et essayer de vous connecter/déconnecter avec Logto :
Si vous rencontrez des problèmes lors de l'intégration, n'hésitez pas à rejoindre notre serveur Discord pour discuter avec la communauté et l'équipe Logto !