W tym samouczku pokażemy, jak zbudować proces uwierzytelniania z Logto w Capacitor. Umożliwi to Ci łatwe tworzenie przepływów logowania i rejestracji na różnych platformach.
W tym samouczku pokażemy, jak zbudować proces uwierzytelniania z Logto w Capacitor. Umożliwi to Ci łatwe tworzenie przepływów logowania i rejestracji na różnych platformach.
Zanim zaczniesz, upewnij się, że masz:
Aby rozpocząć, stwórz aplikację Logto typu „Native”. Aplikacje Logto służą jako aplikacje klienckie w przepływach OAuth 2.0 i OpenID Connect (OIDC). Wykonaj następujące kroki, aby stworzyć aplikację Logto:
Po utworzeniu aplikacji Logto, skonfiguruj przekierowanie URI. URI przekierowania jest używane do przenoszenia użytkownika z powrotem do Twojej aplikacji po zakończeniu procesu uwierzytelniania.
Upewnij się, że URI przekierowuje do aplikacji Capacitor, na przykład com.example.app://callback. Wartość może się różnić w zależności od konfiguracji Twojej aplikacji Capacitor. Więcej informacji znajdziesz w Capacitor Deep Links.
Pamiętaj o kliknięciu Zapisz zmiany po zaktualizowaniu URI przekierowania.
Jeśli nie jesteś pewien co do URI przekierowania, możesz na razie pozostawić je puste i zaktualizować później.
Zakładając, że masz już projekt Capacitor, ten samouczek jest neutralny pod względem frameworku, więc możesz używać dowolnego preferowanego frameworka UI i odpowiednio aktualizować kod.
endpoint to punkt końcowy API Logto. Możesz go znaleźć w przewodniku wbudowanym lub w sekcji Domeny w ustawieniach dzierżawcy.appId to identyfikator aplikacji Logto. Możesz go znaleźć na stronie szczegółów aplikacji.Dodaj poniższy kod do obsługi kliknięcia przycisku logowania:
Zastąp com.example.app://callback odpowiednim URI przekierowania skonfigurowanym w aplikacji Logto.
Uruchom aplikację Capacitor i kliknij przycisk logowania. Otworzy się okno przeglądarki, przekierowując do strony logowania Logto.
Ponieważ Capacitor korzysta z Safari View Controller na iOS oraz Chrome Custom Tabs na Android, stan uwierzytelniania może być przechowywany przez pewien czas. Jednakże czasami użytkownik może chcieć natychmiast wylogować się z aplikacji. W takim przypadku możemy użyć metody signOut, aby wylogować użytkownika:
Metoda signOut ma opcjonalny parametr dla przekierowania URI po wylogowaniu. Jeśli nie zostanie podany, użytkownik zostanie przekierowany na stronę wylogowania Logto:
Użytkownik musi kliknąć "Gotowe", aby zamknąć widok webowy i wrócić do aplikacji Capacitor. Jeśli chcesz automatycznie przekierować użytkownika z powrotem do aplikacji Capacitor, możesz podać URI przekierowania po wylogowaniu:
Upewnij się, że URI przekierowania po wylogowaniu przekierowuje do aplikacji Capacitor i pamiętaj, aby dodać URI przekierowania po wylogowaniu do Logto Console:
Ponownie uruchom aplikację Capacitor i kliknij przycisk logowania. Jeśli wszystko poszło dobrze, po ukończeniu procesu uwierzytelniania aplikacja Capacitor otrzyma wynik logowania i wyświetli oświadczenia użytkownika w konsoli.
Następnie kliknij przycisk wylogowania, a aplikacja Capacitor zostanie przekierowana do strony wylogowania Logto. Automatycznie przekieruje z powrotem do aplikacji Capacitor, jeśli skonfigurowano URI przekierowania po wylogowaniu.
Teraz możesz skonfigurować proces uwierzytelniania w Logto Cloud Console bez pisania skomplikowanego kodu. Konfiguracja będzie miała zastosowanie do wszystkich aplikacji klienckich, zapewniając spójne doświadczenia użytkownika.
Jeśli napotkasz jakiekolwiek problemy podczas integracji, nie wahaj się skontaktować się z nami za pomocą e-maila: [email protected] lub dołącz do naszego serwera Discord!