Catch up on highlights from Firebase at Google I/O 2023. Learn more

Uwierzytelnianie przez telefon

Uwierzytelnianie przez telefon umożliwia użytkownikom logowanie się do Firebase przy użyciu telefonu jako uwierzytelnienia. Do użytkownika (na podany numer telefonu) wysyłana jest wiadomość SMS zawierająca unikalny kod. Po autoryzacji kodu użytkownik może zalogować się do Firebase.

Numery telefonów podane przez użytkowników końcowych w celu uwierzytelnienia będą wysyłane i przechowywane przez Google w celu poprawy zapobiegania spamowi i nadużyciom w usługach Google, w tym między innymi w Firebase. Deweloperzy powinni upewnić się, że mają odpowiednią zgodę użytkownika końcowego przed użyciem usługi logowania za pomocą numeru telefonu Uwierzytelniania Firebase.authentication

Uwierzytelnianie telefonu Firebase nie jest obsługiwane we wszystkich krajach. Więcej informacji można znaleźć w często zadawanych pytaniach .

Organizować coś

Przed rozpoczęciem uwierzytelniania telefonu upewnij się, że wykonałeś następujące kroki:

  1. Włącz telefon jako metodę logowania w konsoli Firebase .
  2. Android : jeśli jeszcze nie ustawiłeś skrótu SHA-1 swojej aplikacji w konsoli Firebase , zrób to. Zobacz Uwierzytelnianie klienta , aby uzyskać informacje o znajdowaniu skrótu SHA-1 aplikacji.
  3. iOS : w Xcode włącz powiadomienia wypychane dla swojego projektu i upewnij się, że klucz uwierzytelniania APNs jest skonfigurowany z Firebase Cloud Messaging (FCM) . Dodatkowo musisz włączyć tryby tła dla zdalnych powiadomień. Aby wyświetlić szczegółowe wyjaśnienie tego kroku, zapoznaj się z dokumentacją Firebase iOS Phone Auth .
  4. Sieć : Upewnij się, że dodałeś swoją domenę aplikacji w konsoli Firebase , w sekcji Domeny przekierowania OAuth .

Uwaga ; Logowanie za pomocą numeru telefonu jest dostępne tylko na rzeczywistych urządzeniach iw internecie. Aby przetestować przepływ uwierzytelniania na emulatorach urządzeń, zobacz Testowanie .

Stosowanie

Pakiet SDK uwierzytelniania Firebase dla Flutter zapewnia dwa różne sposoby logowania użytkownika za pomocą numeru telefonu. Platformy natywne (np. Android i iOS) zapewniają inne funkcje sprawdzania poprawności numeru telefonu niż sieć, dlatego istnieją dwie metody wyłącznie dla każdej platformy:

  • Platforma natywna : verifyPhoneNumber .
  • Platforma internetowa : signInWithPhoneNumber .

Natywny: verifyPhoneNumber

Na platformach natywnych numer telefonu użytkownika musi zostać najpierw zweryfikowany, a następnie użytkownik może zalogować się lub połączyć swoje konto z PhoneAuthCredential .

Najpierw musisz poprosić użytkownika o podanie numeru telefonu. Po podaniu wywołaj metodę verifyPhoneNumber() :

await FirebaseAuth.instance.verifyPhoneNumber(
  phoneNumber: '+44 7123 123 456',
  verificationCompleted: (PhoneAuthCredential credential) {},
  verificationFailed: (FirebaseAuthException e) {},
  codeSent: (String verificationId, int? resendToken) {},
  codeAutoRetrievalTimeout: (String verificationId) {},
);

Istnieją 4 osobne wywołania zwrotne, które musisz obsłużyć, a każde z nich określi, w jaki sposób zaktualizujesz interfejs aplikacji:

  1. weryfikacja zakończona : Automatyczna obsługa kodu SMS na urządzeniach z Androidem.
  2. weryfikacja nie powiodło się : obsługa zdarzeń niepowodzenia, takich jak nieprawidłowe numery telefonów lub przekroczenie limitu wiadomości SMS.
  3. codeSent : Obsługa sytuacji, gdy kod został wysłany do urządzenia z Firebase, używany do monitowania użytkowników o wprowadzenie kodu.
  4. codeAutoRetrievalTimeout : Obsługuje limit czasu w przypadku niepowodzenia automatycznej obsługi kodu SMS.

weryfikacja zakończona

Ten program obsługi będzie wywoływany tylko na urządzeniach z systemem Android, które obsługują automatyczne rozpoznawanie kodu SMS.

Gdy kod SMS zostanie dostarczony do urządzenia, system Android automatycznie zweryfikuje kod SMS bez konieczności ręcznego wprowadzania kodu przez użytkownika. Jeśli to zdarzenie wystąpi, automatycznie zostanie udostępnione PhoneAuthCredential , którego można użyć do zalogowania się przy użyciu numeru telefonu użytkownika lub połączenia z nim.

FirebaseAuth auth = FirebaseAuth.instance;

await auth.verifyPhoneNumber(
  phoneNumber: '+44 7123 123 456',
  verificationCompleted: (PhoneAuthCredential credential) async {
    // ANDROID ONLY!

    // Sign the user in (or link) with the auto-generated credential
    await auth.signInWithCredential(credential);
  },
);

weryfikacja nie powiodła się

Jeśli Firebase zwróci błąd, na przykład z powodu nieprawidłowego numeru telefonu lub przekroczenia limitu SMS-ów dla projektu, do tego modułu obsługi zostanie wysłany wyjątek FirebaseAuthException . W takim przypadku monitowałbyś użytkownika, aby coś poszło nie tak w zależności od kodu błędu.

FirebaseAuth auth = FirebaseAuth.instance;

await auth.verifyPhoneNumber(
  phoneNumber: '+44 7123 123 456',
  verificationFailed: (FirebaseAuthException e) {
    if (e.code == 'invalid-phone-number') {
      print('The provided phone number is not valid.');
    }

    // Handle other errors
  },
);

Kod wysłany

Gdy Firebase wysyła kod SMS do urządzenia, ta procedura obsługi jest uruchamiana z verificationId i resendToken ( resendToken jest obsługiwany tylko na urządzeniach z systemem Android, urządzenia z systemem iOS zawsze zwracają wartość null ).

Po uruchomieniu dobrze byłoby zaktualizować interfejs użytkownika aplikacji, aby monitował użytkownika o wprowadzenie oczekiwanego kodu SMS. Po wprowadzeniu kodu SMS możesz połączyć identyfikator weryfikacyjny z kodem SMS, aby utworzyć nowy PhoneAuthCredential :

FirebaseAuth auth = FirebaseAuth.instance;

await auth.verifyPhoneNumber(
  phoneNumber: '+44 7123 123 456',
  codeSent: (String verificationId, int? resendToken) async {
    // Update the UI - wait for the user to enter the SMS code
    String smsCode = 'xxxx';

    // Create a PhoneAuthCredential with the code
    PhoneAuthCredential credential = PhoneAuthProvider.credential(verificationId: verificationId, smsCode: smsCode);

    // Sign the user in (or link) with the credential
    await auth.signInWithCredential(credential);
  },
);

Domyślnie Firebase nie wyśle ​​ponownie nowej wiadomości SMS, jeśli została niedawno wysłana. Możesz jednak zmienić to zachowanie, ponownie wywołując metodę verifyPhoneNumber z tokenem ponownego wysłania do argumentu forceResendingToken . Jeśli się powiedzie, wiadomość SMS zostanie wysłana ponownie.

codeAutoRetrievalTimeout

Na urządzeniach z systemem Android, które obsługują automatyczne rozpoznawanie kodu SMS, ta procedura obsługi zostanie wywołana, jeśli urządzenie nie rozpozna automatycznie wiadomości SMS w określonym przedziale czasu. Po upływie tego przedziału czasowego urządzenie nie będzie już próbowało rozwiązać żadnych wiadomości przychodzących.

Domyślnie urządzenie czeka 30 sekund, jednak można to dostosować za pomocą argumentu timeout :

FirebaseAuth auth = FirebaseAuth.instance;

await auth.verifyPhoneNumber(
  phoneNumber: '+44 7123 123 456',
  timeout: const Duration(seconds: 60),
  codeAutoRetrievalTimeout: (String verificationId) {
    // Auto-resolution timed out...
  },
);

Sieć: signInWithPhoneNumber

Na platformach internetowych użytkownicy mogą logować się, potwierdzając, że mają dostęp do telefonu, wpisując kod SMS wysłany na podany numer telefonu. W celu zwiększenia bezpieczeństwa i zapobiegania spamowi użytkownicy proszeni są o udowodnienie, że są ludźmi, wypełniając widżet Google reCAPTCHA . Po potwierdzeniu kod SMS zostanie wysłany.

Zestaw SDK uwierzytelniania Firebase dla Flutter domyślnie zarządza widżetem reCAPTCHA od razu po wyjęciu z pudełka, jednak zapewnia kontrolę nad sposobem wyświetlania i konfigurowania w razie potrzeby. Aby rozpocząć, wywołaj metodę signInWithPhoneNumber z numerem telefonu.

FirebaseAuth auth = FirebaseAuth.instance;

// Wait for the user to complete the reCAPTCHA & for an SMS code to be sent.
ConfirmationResult confirmationResult = await auth.signInWithPhoneNumber('+44 7123 123 456');

Wywołanie metody spowoduje najpierw wyświetlenie widżetu reCAPTCHA. Użytkownik musi ukończyć test przed wysłaniem kodu SMS. Po zakończeniu możesz zalogować użytkownika, podając kod SMS w metodzie confirm w rozstrzygniętej odpowiedzi ConfirmationResult :

UserCredential userCredential = await confirmationResult.confirm('123456');

Podobnie jak w przypadku innych przepływów logowania, pomyślne logowanie spowoduje wyzwolenie wszystkich odbiorników stanu uwierzytelniania subskrybowanych w całej aplikacji.

Konfiguracja reCAPTCHA

Widżet reCAPTCHA to w pełni zarządzany przepływ, który zapewnia bezpieczeństwo Twojej aplikacji internetowej.

Drugi argument signInWithPhoneNumber akceptuje opcjonalną instancję RecaptchaVerifier , której można użyć do zarządzania widżetem. Domyślnie widżet będzie renderowany jako niewidoczny widżet po uruchomieniu procesu logowania. „Niewidoczny” widżet pojawi się jako całostronicowy modal na górze Twojej aplikacji.

Możliwe jest jednak wyświetlenie wbudowanego widżetu, który użytkownik musi wyraźnie nacisnąć, aby się zweryfikować.

Aby dodać wbudowany widżet, podaj identyfikator elementu DOM w argumencie container instancji RecaptchaVerifier . Element musi istnieć i być pusty, w przeciwnym razie zostanie zgłoszony błąd. Jeśli nie zostanie podany argument container , widżet będzie renderowany jako „niewidoczny”.

ConfirmationResult confirmationResult = await auth.signInWithPhoneNumber('+44 7123 123 456', RecaptchaVerifier(
  container: 'recaptcha',
  size: RecaptchaVerifierSize.compact,
  theme: RecaptchaVerifierTheme.dark,
));

Opcjonalnie możesz zmienić rozmiar i motyw, dostosowując argumenty size i theme , jak pokazano powyżej.

Możliwe jest również odsłuchiwanie zdarzeń, np. czy reCAPTCHA została zakończona przez użytkownika, czy reCAPTCHA wygasła lub czy wystąpił błąd:

RecaptchaVerifier(
  onSuccess: () => print('reCAPTCHA Completed!'),
  onError: (FirebaseAuthException error) => print(error),
  onExpired: () => print('reCAPTCHA Expired!'),
);

Testowanie

Firebase zapewnia wsparcie dla lokalnego testowania numerów telefonów:

  1. W konsoli Firebase wybierz dostawcę uwierzytelniania „Telefon” i kliknij listę rozwijaną „Numery telefonów do testowania”.
  2. Wprowadź nowy numer telefonu (np +44 7444 555666 ) oraz kod testowy (np. 123456 ).

W przypadku podania testowego numeru telefonu w metodzie verifyPhoneNumber lub signInWithPhoneNumber w rzeczywistości nie zostanie wysłana żadna wiadomość SMS. Zamiast tego możesz podać kod testowy bezpośrednio do PhoneAuthProvider lub za pomocą procedury obsługi wyniku potwierdzenia signInWithPhoneNumber .