Dowiedz się, jak zbudować przepływ uwierzytelniania użytkownika z Expo (React Native) poprzez integrację z SDK Logto.
W tym poradniku pokażemy, jak zbudować przepływ uwierzytelniania użytkownika za pomocą Expo (React Native) integrując Logto SDK. Poradnik używa TypeScript jako języka programowania.
Zanim zaczniesz, upewnij się, że masz następujące:
Aby rozpocząć, utwórz aplikację Logto z typem "Native". Wykonaj następujące kroki, aby utworzyć aplikację Logto:
Następnie powinieneś zobaczyć interaktywny przewodnik, który poprowadzi Cię przez proces integracji Logto SDK z Twoją aplikacją Expo (React Native). Poniższa treść może być odniesieniem na przyszłość.
Zainstaluj SDK Logto i jego zewnętrzne zależności za pomocą ulubionego menedżera pakietów:
Pakiet @logto/rn to SDK dla Logto. Pozostałe pakiety to jego zewnętrzne zależności. Nie mogły być wymienione jako zależności bezpośrednie, ponieważ Expo CLI wymaga, aby wszystkie zależności dla modułów natywnych były zainstalowane bezpośrednio w głównym pliku projektu package.json.
Zaimportuj i użyj LogtoProvider, aby zapewnić kontekst Logto:
Przełącz się na stronę szczegółów aplikacji w Logto Console. Dodaj natywny URI przekierowania (na przykład, io.logto://callback), a następnie kliknij "Zapisz".
Dla iOS, schemat URI przekierowania właściwie nie ma znaczenia, ponieważ klasa ASWebAuthenticationSession będzie nasłuchiwać URI przekierowania niezależnie od tego, czyjest zarejestrowana.
Dla Androida, schemat URI przekierowania musi być wypełniony w pliku app.json Expo, na przykład:
Wracając teraz do swojej aplikacji, możesz użyć hooka useLogto do logowania i wylogowania:
Aby wyświetlić informacje o użytkowniku, możesz użyć metody getIdTokenClaims():
Teraz możesz uruchomić aplikację i spróbować zalogować się/wylogować za pomocą Logto:
Jeśli napotkasz jakiekolwiek problemy podczas integracji, nie wahaj się dołączyć do naszego serwera Discord, aby porozmawiać z społecznością i zespołem Logto!