Uwierzytelnianie przez telefon

Uwierzytelnianie przez telefon umożliwia użytkownikom logowanie się do Firebase za pomocą telefonu jako aplikacji uwierzytelniającej. Wysyłany jest SMS (za pomocą podanego numeru telefonu) z unikalnym kodem. Po autoryzacji kodu użytkownik może się podpisać do Firebase.

Numery telefonów podane przez użytkowników na potrzeby uwierzytelniania będą wysyłane i przechowywane przez Google w celu walki ze spamem i nadużyciami w usłudze Google, w tym w Firebase. Deweloperzy powinni się upewnić, że mają uzyskać odpowiednią zgodę użytkownika przed użyciem usługi logowania numeru telefonu w Uwierzytelnianiu Firebase.

Uwierzytelnianie przez telefon Firebase nie jest obsługiwane we wszystkich krajach. Więcej informacji znajdziesz w odpowiedziach na najczęstsze pytania.

Konfiguracja

Zanim zaczniesz korzystać z uwierzytelniania przez telefon, wykonaj te czynności:

  1. Włącz telefon jako metodę logowania w konsoli Firebase.
  2. Android: jeśli hasz SHA-1 aplikacji nie został jeszcze ustawiony w konsoli Firebase, zrób to. Więcej informacji o znajdowaniu skrótu SHA-1 aplikacji znajdziesz w artykule Uwierzytelnianie klienta.
  3. iOS: w Xcode włącz powiadomienia push dla swojego projektu i upewnij się Twój klucz uwierzytelniania APNs jest skonfigurowany za pomocą Komunikacji w chmurze Firebase (FCM). Dodatkowo musisz: włącz tryby działania w tle na potrzeby zdalnych powiadomień. Szczegółowy opis tego kroku znajdziesz w dokumentacji uwierzytelniania telefonu na urządzeniach z iOS w Firebase.
  4. Internet: upewnij się, że w konsoli Firebase została dodana domena aplikacji w sekcji Domeny przekierowywania OAuth

Uwaga: Logowanie się numerem telefonu jest możliwe tylko na prawdziwych urządzeniach i w przeglądarce. Aby przetestować proces uwierzytelniania w emulatorach urządzeń: zobacz Testowanie.

Wykorzystanie

Pakiet SDK uwierzytelniania Firebase dla Flutter umożliwia logowanie użytkownika za pomocą numeru telefonu na 2 sposoby. Platformy natywne (np. Android i iOS) zapewniają Weryfikowanie numeru telefonu jest inne niż w internecie, dlatego w przypadku każdej platformy istnieją tylko 2 metody:

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

Natywna: verifyPhoneNumber

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

Najpierw musisz poprosić użytkownika o numer 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 określają sposób aktualizacji interfejsu aplikacji:

  1. verificationUkończono: automatyczna obsługa kodu SMS na urządzeniach z Androidem.
  2. verificationNiepowodzenie: obsługuje zdarzenia nieudane, takie jak nieprawidłowe numery telefonów czy przekroczenie limitu SMS-ów.
  3. codeSent: obsługuje przesyłanie na urządzenie z Firebase kodu, który służy do wyświetlania użytkownikom próśb o wpisanie kodu.
  4. codeAutoRetrievalTimeout: określa limit czasu, po przekroczeniu którego automatyczna obsługa kodu SMS nie działa.

weryfikacja zakończona

Ten moduł obsługi będzie wywoływany tylko na urządzeniach z Androidem, które obsługują automatyczne rozpoznawanie kodów SMS.

Gdy kod SMS zostanie dostarczony na urządzenie, Android automatycznie go zweryfikuje bez użycia kodu SMS. wymagają od użytkownika ręcznego wpisania kodu. W takim przypadku automatycznie podawany jest identyfikator PhoneAuthCredential, który można używane do logowania się za pomocą numeru telefonu użytkownika lub do jego połączenia.

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 – np. o nieprawidłowym numerze telefonu lub przekroczeniu limitu SMS-ów w projekcie, Do tego modułu obsługi zostanie wysłana wiadomość FirebaseAuthException. W takim przypadku powiadomimy użytkownika, że w zależności od błędu coś poszło nie tak. w kodzie.

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
  },
);

CodeSent (Wysłany kod)

Gdy Firebase wysyła kod SMS na urządzenie, ten moduł obsługi jest wywoływany za pomocą poleceń verificationId i resendToken (resendToken jest obsługiwana tylko na urządzeniach z Androidem, urządzenia z iOS zawsze zwracają wartość null).

Po uruchomieniu warto zaktualizować interfejs aplikacji, aby poprosić użytkownika o wpisanie oczekiwanego kodu SMS. Po wpisaniu kodu SMS możesz połączyć identyfikator weryfikacyjny z kodem SMS, aby utworzyć nowy numer 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 wysyła ponownie nowych SMS-ów, jeśli zostały one wysłane niedawno. Możesz jednak zmienić to działanie przez wywołanie metody verifyPhoneNumber z ponownym wysyłaniem tokena w argumencie forceResendingToken. Jeśli się uda, SMS zostanie wysłany ponownie.

Czas oczekiwania kodu automatycznego pobierania

Na urządzeniach z Androidem, które obsługują automatyczne rozpoznawanie kodów SMS, ta aplikacja zostanie wywołana, jeśli urządzenie nie zakończył(a) wiadomość SMS w określonym czasie. Po upływie tego czasu urządzenie nie będzie już próbowało rozwiązać problemu wszystkich wiadomości przychodzących.

Domyślnie urządzenie czeka 30 sekund, ale można to zmienić 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ą się logować, potwierdzając dostęp do telefonu, wpisując kod SMS wysłany na podany numer telefonu. Aby zwiększyć bezpieczeństwo i zwalczać spam, użytkownicy muszą potwierdzić, że są człowiekiem, przez wykonanie Google reCAPTCHA. widżet. Po potwierdzeniu kod SMS zostanie wysłany.

Pakiet SDK usługi Uwierzytelnianie Firebase dla Flutter będzie domyślnie zarządzać widżetem reCAPTCHA od razu, ale w razie potrzeby będzie mieć kontrolę nad jego wyświetlaniem i konfiguracją. Aby rozpocząć, zadzwoń do metody signInWithPhoneNumber, używając numeru 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 tej metody najpierw aktywuje wyświetlenie widżetu reCAPTCHA. Użytkownik musi wykonać test przed wysłaniem kodu SMS. Następnie możesz zalogować użytkownika, podając Kod SMS na numer confirm w przypadku odpowiedzi ConfirmationResult:

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

Tak jak w przypadku innych procesów logowania, pomyślne logowanie aktywuje wszystkie detektory stanu uwierzytelniania. subskrybowanych w ramach całej aplikacji.

Konfiguracja reCAPTCHA

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

Drugi argument funkcji signInWithPhoneNumber akceptuje opcjonalne wystąpienie RecaptchaVerifier, którego można użyć aby zarządzać widżetem. Domyślnie widżet będzie wyświetlany jako niewidoczny po uruchomieniu procesu logowania. Element „niewidoczny” widżet będzie widoczny u góry aplikacji jako okno modalne na całej stronie.

Można jednak wyświetlać wbudowany widżet, który użytkownik musi nacisnąć, aby potwierdzić swoją tożsamość.

Aby dodać widżet wbudowany, podaj identyfikator elementu DOM w argumencie container instancji RecaptchaVerifier. Element musi istnieć i być pusty. W przeciwnym razie wystąpi błąd. Jeśli nie zostanie podany żaden argument container, widżet będzie wyświetlany 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 w sposób pokazany powyżej.

Można też nasłuchiwać zdarzeń, takich jak ukończenie zadania reCAPTCHA przez użytkownika, reCAPTCHA wygasła lub wystąpił błąd:

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

Testowanie

Firebase zapewnia pomoc dotyczącą testowania lokalnie numerów telefonów:

  1. W konsoli Firebase wybierz „Telefon” dostawcy uwierzytelniania i kliknij „Numery telefonów do testowania”. .
  2. Wpisz nowy numer telefonu (np. +44 7444 555666) i kod testowy (np. 123456).

W przypadku podania testowego numeru telefonu w metodzie verifyPhoneNumber lub signInWithPhoneNumber, SMS nie zostanie faktycznie wysłany. Ty może zamiast tego przekazać kod testowy bezpośrednio do modułu PhoneAuthProvider lub za pomocą modułu obsługi wyników potwierdzenia signInWithPhoneNumber.