Аутентификация по телефону позволяет пользователям входить в Firebase, используя свой телефон в качестве аутентификатора. На указанный номер телефона пользователю отправляется SMS-сообщение с уникальным кодом. После авторизации кода пользователь может войти в Firebase.
Номера телефонов, предоставляемые конечными пользователями для аутентификации, будут отправляться и храниться Google для улучшения защиты от спама и злоупотреблений в сервисах Google, включая, помимо прочего, Firebase. Разработчикам следует убедиться в наличии соответствующего согласия конечного пользователя перед использованием сервиса входа по номеру телефона для аутентификации в Firebase.
Аутентификация по телефону через Firebase поддерживается не во всех странах. Подробнее см. в разделе часто задаваемых вопросов .
Настраивать
Прежде чем начать аутентификацию по телефону, убедитесь, что вы выполнили следующие шаги:
- Включите телефон как способ входа в систему в консоли Firebase .
- Android : Если вы ещё не установили хэш SHA-1 вашего приложения в консоли Firebase , сделайте это. Подробнее о поиске хэша SHA-1 вашего приложения см. в разделе «Аутентификация клиента» .
- iOS : В Xcode включите push-уведомления для своего проекта и убедитесь, что ключ аутентификации APN настроен на Firebase Cloud Messaging (FCM) . Кроме того, необходимо включить фоновые режимы для удалённых уведомлений. Подробное описание этого шага см. в документации Firebase iOS Phone Auth .
- Веб : Убедитесь, что вы добавили домен своего приложения в консоль 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 отдельных обратных вызова, каждый из которых определяет способ обновления пользовательского интерфейса приложения:
- ПроверкаЗавершено : Автоматическая обработка SMS-кода на устройствах Android.
- verifyFailed : обработка событий сбоя, таких как недействительные номера телефонов или превышение квоты SMS.
- codeSent : обрабатывает отправку кода на устройство из Firebase, используется для приглашения пользователей ввести код.
- codeAutoRetrievalTimeout : Обработка тайм-аута в случае сбоя автоматической обработки SMS-кода.
проверказавершена
Этот обработчик будет вызываться только на устройствах Android, которые поддерживают автоматическое разрешение кодов SMS.
Когда SMS-код приходит на устройство, Android автоматически проверяет его, не требуя от пользователя ручного ввода. В этом случае автоматически предоставляется 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
},
);
codeSent
Когда 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 обеспечивает поддержку локального тестирования телефонных номеров:
- В консоли Firebase выберите поставщика аутентификации «Телефон» и нажмите на раскрывающийся список «Номера телефонов для тестирования».
- Введите новый номер телефона (например,
+44 7444 555666) и тестовый код (например,123456).
Если вы укажете тестовый номер телефона в методах verifyPhoneNumber или signInWithPhoneNumber , SMS-сообщение фактически не будет отправлено. Вместо этого вы можете передать тестовый код непосредственно PhoneAuthProvider или с помощью обработчика результатов подтверждения signInWithPhoneNumber .