Impara come costruire un flusso di autenticazione utente con Expo (React Native) integrando Logto SDK.
In questo tutorial, ti mostreremo come costruire un flusso di autenticazione utente con Expo (React Native) integrando il Logto SDK. Il tutorial utilizza TypeScript come linguaggio di programmazione.
Prima di iniziare, assicurati di avere quanto segue:
Per iniziare, crea un'applicazione Logto con il tipo "Native". Segui questi passaggi per creare un'applicazione Logto:
Dovresti quindi vedere una guida interattiva che ti guida attraverso il processo di integrazione del Logto SDK con la tua applicazione Expo (React Native). Il seguente contenuto può essere un riferimento per usi futuri.
Installa Logto SDK e dipendenze correlate tramite il tuo gestore di pacchetti preferito:
Il pacchetto @logto/rn è l'SDK per Logto. Gli altri pacchetti sono le sue dipendenze correlate. Non possono essere elencati come dipendenze dirette perché l'Expo CLI richiede che tutte le dipendenze per i moduli nativi siano installate direttamente all'interno del package.json del progetto principale.
Importa e usa LogtoProvider per fornire un contesto Logto:
Passa alla pagina dei dettagli dell'applicazione di Logto Console. Aggiungi un URI di reindirizzamento nativo (ad esempio, io.logto://callback), quindi clicca "Salva".
Per iOS, lo schema URI di reindirizzamento non ha molta importanza poiché la classe ASWebAuthenticationSession ascolterà l'URI di reindirizzamento indipendentemente dal fatto che sia registrato o meno.
Per Android, lo schema URI di reindirizzamento deve essere compilato nel file app.json di Expo, ad esempio:
Ora torna alla tua app, puoi usare il hook useLogto per accedere e disconnetterti:
Per visualizzare le informazioni dell'utente, puoi usare il metodo getIdTokenClaims():
Ora puoi eseguire l'applicazione e provare ad accedere/disconnetterti con Logto:
Se incontri problemi durante l'integrazione, non esitare a unirti al nostro server Discord per parlare con la comunità e il team di Logto!