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

Аутентификация телефона

Аутентификация по телефону позволяет пользователям входить в Firebase, используя свой телефон в качестве аутентификатора. Пользователю (на указанный номер телефона) отправляется SMS-сообщение, содержащее уникальный код. После авторизации кода пользователь может войти в Firebase.

Номера телефонов, которые конечные пользователи предоставляют для аутентификации, будут отправлены и сохранены Google для улучшения предотвращения спама и злоупотреблений в сервисе Google, в том числе в Firebase, но не ограничиваясь им. Разработчики должны убедиться, что у них есть соответствующее согласие конечного пользователя, прежде чем использовать службу входа в систему по номеру телефона Firebase Authentication.authentication

Аутентификация телефона Firebase поддерживается не во всех странах. Пожалуйста, ознакомьтесь с их часто задаваемыми вопросами для получения дополнительной информации.

Настраивать

Прежде чем начать аутентификацию по телефону, убедитесь, что вы выполнили следующие шаги:

  1. Включите телефон в качестве метода входа в консоль Firebase .
  2. Android : если вы еще не установили хэш SHA-1 своего приложения в консоли Firebase , сделайте это. См. Аутентификация вашего клиента для получения информации о поиске хэша SHA-1 вашего приложения.
  3. iOS : в Xcode включите push-уведомления для вашего проекта и убедитесь, что ваш ключ аутентификации APN настроен с помощью Firebase Cloud Messaging (FCM) . Кроме того, вы должны включить фоновые режимы для удаленных уведомлений. Подробное объяснение этого шага см. в документации Firebase iOS Phone Auth .
  4. Интернет : убедитесь, что вы добавили домен приложений в консоли Firebase в разделе домены перенаправления OAuth .

Примечание ; Вход по номеру телефона доступен только для использования на реальных устройствах и в Интернете. Чтобы протестировать процесс аутентификации на эмуляторах устройств, см. Тестирование .

Применение

Firebase Authentication SDK для Flutter предоставляет два отдельных способа входа пользователя с помощью номера телефона. Собственные (например, Android и iOS) платформы предоставляют различные функции для проверки номера телефона, чем Интернет, поэтому для каждой платформы существует два метода:

  • Собственная платформа : verifyPhoneNumber .
  • Веб-платформа : signInWithPhoneNumber .

Собственный: verifyPhoneNumber

На нативных платформах номер телефона пользователя должен быть сначала подтвержден, а затем пользователь может либо войти в систему, либо связать свою учетную запись с PhoneAuthCredential .

Сначала вы должны запросить у пользователя номер телефона. После предоставления вызовите метод verifyPhoneNumber() :

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

Есть 4 отдельных обратных вызова, которые вы должны обработать, каждый из которых будет определять, как вы будете обновлять пользовательский интерфейс приложения:

  1. VerificationCompleted : автоматическая обработка кода SMS на устройствах Android.
  2. VerificationFailed : обрабатывать события сбоев, такие как недействительные номера телефонов или превышение квоты SMS.
  3. codeSent : обрабатывает, когда код был отправлен на устройство из Firebase, используется для запроса пользователей на ввод кода.
  4. codeAutoRetrievalTimeout : Обработка тайм-аута при сбое автоматической обработки SMS-кода.

проверкаЗавершена

Этот обработчик будет вызываться только на устройствах Android, поддерживающих автоматическое разрешение кода SMS.

Когда код SMS доставляется на устройство, Android автоматически проверяет код SMS, не требуя от пользователя ввода кода вручную. Если это событие происходит, автоматически предоставляется PhoneAuthCredential , который можно использовать для входа или привязки номера телефона пользователя.

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

проверка не удалась

Если Firebase вернет ошибку, например, из-за неверного номера телефона или если превышена квота SMS для проекта, этому обработчику будет отправлено исключение FirebaseAuthException . В этом случае вы подскажете пользователю, что что-то пошло не так, в зависимости от кода ошибки.

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

код отправлен

Когда Firebase отправляет SMS-код на устройство, этот обработчик запускается с verificationId и resendToken ( resendToken поддерживается только на устройствах Android, устройства iOS всегда будут возвращать null значение).

После запуска было бы неплохо обновить пользовательский интерфейс вашего приложения, чтобы предложить пользователю ввести код SMS, который они ожидают. После того, как код SMS был введен, вы можете объединить идентификатор подтверждения с кодом SMS, чтобы создать новый 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);
  },
);

По умолчанию Firebase не будет повторно отправлять новое SMS-сообщение, если оно было отправлено недавно. Однако вы можете переопределить это поведение, повторно вызвав метод verifyPhoneNumber с токеном повторной отправки в аргумент forceResendingToken . В случае успеха SMS-сообщение будет отправлено повторно.

codeAutoRetrievalTimeout

На устройствах Android, поддерживающих автоматическое разрешение кода SMS, этот обработчик будет вызываться, если устройство не разрешило SMS-сообщение автоматически в течение определенного периода времени. По истечении этого периода устройство больше не будет пытаться разрешать входящие сообщения.

По умолчанию устройство ожидает 30 секунд, однако это можно настроить с помощью аргумента 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...
  },
);

Интернет: signInWithPhoneNumber

На веб-платформах пользователи могут войти в систему, подтвердив, что у них есть доступ к телефону, введя код SMS, отправленный на указанный номер телефона. Для дополнительной безопасности и предотвращения спама пользователей просят подтвердить, что они люди, заполнив виджет Google reCAPTCHA . После подтверждения будет отправлен SMS-код.

Firebase Authentication SDK для Flutter будет управлять виджетом reCAPTCHA по умолчанию, но при необходимости обеспечивает контроль над его отображением и настройкой. Для начала вызовите метод signInWithPhoneNumber с номером телефона.

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');

Вызов метода сначала вызовет отображение виджета reCAPTCHA. Пользователь должен пройти тест до отправки SMS-кода. После завершения вы можете войти в систему, предоставив код SMS методу confirm в разрешенном ответе ConfirmationResult :

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

Как и другие потоки входа, успешный вход активирует все прослушиватели состояния проверки подлинности, на которые вы подписались в своем приложении.

Конфигурация reCAPTCHA

Виджет reCAPTCHA — это полностью управляемый поток, обеспечивающий безопасность вашего веб-приложения.

Второй аргумент signInWithPhoneNumber принимает необязательный экземпляр RecaptchaVerifier , который можно использовать для управления виджетом. По умолчанию виджет отображается как невидимый виджет при запуске потока входа. «Невидимый» виджет появится в виде модального окна на всю страницу поверх вашего приложения.

Однако можно отобразить встроенный виджет, который пользователь должен явно нажать, чтобы подтвердить себя.

Чтобы добавить встроенный виджет, укажите идентификатор элемента DOM в аргументе container экземпляра RecaptchaVerifier . Элемент должен существовать и быть пустым, иначе будет выдана ошибка. Если аргумент container не указан, виджет будет отображаться как «невидимый».

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

При желании вы можете изменить размер и тему, настроив аргументы size и theme , как показано выше.

Также можно прослушивать события, например, была ли выполнена пользователем reCAPTCHA, истек ли срок действия reCAPTCHA или возникла ошибка:

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

Тестирование

Firebase поддерживает локальное тестирование телефонных номеров:

  1. В консоли Firebase выберите поставщика аутентификации «Телефон» и щелкните раскрывающийся список «Номера телефонов для тестирования».
  2. Введите новый номер телефона (например +44 7444 555666 ) и тестовый код (например, 123456 ).

Если указать тестовый номер телефона для методов verifyPhoneNumber или signInWithPhoneNumber , на самом деле SMS не будет отправлено. Вместо этого вы можете предоставить тестовый код непосредственно PhoneAuthProvider или с помощью обработчика результатов подтверждения signInWithPhoneNumber s.