Mit der Telefonauthentifizierung können sich Benutzer mit ihrem Telefon als Authentifikator bei Firebase anmelden. Eine SMS-Nachricht wird an den Benutzer gesendet (unter Verwendung der angegebenen Telefonnummer), die einen eindeutigen Code enthält. Sobald der Code autorisiert wurde, kann sich der Benutzer bei Firebase anmelden.
Telefonnummern, die Endnutzer zur Authentifizierung angeben, werden von Google gesendet und gespeichert, um den Spam- und Missbrauchsschutz im gesamten Google-Dienst zu verbessern, einschließlich, aber nicht beschränkt auf Firebase. Entwickler sollten sicherstellen, dass sie über die entsprechende Zustimmung des Endbenutzers verfügen, bevor sie den Firebase Authentication-Telefonnummer-Anmeldedienst verwenden.authentication
Die Firebase-Telefonauthentifizierung wird nicht in allen Ländern unterstützt. Weitere Informationen finden Sie in den FAQs .
Aufstellen
Bevor Sie mit der Telefonauthentifizierung beginnen, vergewissern Sie sich, dass Sie die folgenden Schritte ausgeführt haben:
- Aktivieren Sie Telefon als Anmeldemethode in der Firebase-Konsole .
- Android : Wenn Sie den SHA-1-Hash Ihrer App noch nicht in der Firebase-Konsole festgelegt haben, tun Sie dies jetzt. Informationen zum Auffinden des SHA-1-Hashs Ihrer App finden Sie unter Authentifizieren Ihres Clients .
- iOS : Aktivieren Sie in Xcode Push-Benachrichtigungen für Ihr Projekt und stellen Sie sicher, dass Ihr APNs-Authentifizierungsschlüssel mit Firebase Cloud Messaging (FCM) konfiguriert ist. Außerdem müssen Sie Hintergrundmodi für Remotebenachrichtigungen aktivieren . Eine ausführliche Erläuterung dieses Schritts finden Sie in der Dokumentation Firebase iOS Phone Auth .
- Web : Stellen Sie sicher, dass Sie Ihre Anwendungsdomäne in der Firebase-Konsole unter OAuth-Umleitungsdomänen hinzugefügt haben.
Hinweis ; Die Anmeldung per Telefonnummer ist nur für die Verwendung auf echten Geräten und im Web verfügbar. Informationen zum Testen Ihres Authentifizierungsflusses auf Geräteemulatoren finden Sie unter Testen .
Verwendung
Das Firebase Authentication SDK for Flutter bietet zwei individuelle Möglichkeiten, einen Benutzer mit seiner Telefonnummer anzumelden. Native Plattformen (z. B. Android und iOS) bieten andere Funktionen zur Validierung einer Telefonnummer als das Web, daher gibt es ausschließlich zwei Methoden für jede Plattform:
- Native Plattform :
verifyPhoneNumber. - Webplattform :
signInWithPhoneNumber.
Nativ: verifyPhoneNumber
Auf nativen Plattformen muss die Telefonnummer des Benutzers zuerst verifiziert werden, und dann kann sich der Benutzer entweder anmelden oder sein Konto mit einem PhoneAuthCredential verknüpfen.
Zuerst müssen Sie den Benutzer nach seiner Telefonnummer fragen. Rufen Sie nach der Bereitstellung die Methode verifyPhoneNumber() auf:
await FirebaseAuth.instance.verifyPhoneNumber(
phoneNumber: '+44 7123 123 456',
verificationCompleted: (PhoneAuthCredential credential) {},
verificationFailed: (FirebaseAuthException e) {},
codeSent: (String verificationId, int? resendToken) {},
codeAutoRetrievalTimeout: (String verificationId) {},
);
Es gibt 4 separate Rückrufe, die Sie verarbeiten müssen, und jeder bestimmt, wie Sie die Benutzeroberfläche der Anwendung aktualisieren:
- VerificationCompleted : Automatische Handhabung des SMS-Codes auf Android-Geräten.
- verifikationFailed : Behandeln Sie Fehlerereignisse wie ungültige Telefonnummern oder ob das SMS-Kontingent überschritten wurde.
- codeSent : Handle, wenn ein Code von Firebase an das Gerät gesendet wurde, um Benutzer aufzufordern, den Code einzugeben.
- codeAutoRetrievalTimeout : Behandeln Sie eine Zeitüberschreitung, wenn die automatische SMS-Code-Verarbeitung fehlschlägt.
ÜberprüfungAbgeschlossen
Dieser Handler wird nur auf Android-Geräten aufgerufen, die die automatische SMS-Codeauflösung unterstützen.
Wenn der SMS-Code an das Gerät übermittelt wird, überprüft Android den SMS-Code automatisch, ohne dass der Benutzer den Code manuell eingeben muss. Wenn dieses Ereignis eintritt, wird automatisch ein PhoneAuthCredential bereitgestellt, das zum Anmelden oder Verknüpfen der Telefonnummer des Benutzers verwendet werden kann.
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);
},
);
Verifizierung fehlgeschlagen
Wenn Firebase einen Fehler zurückgibt, beispielsweise für eine falsche Telefonnummer oder wenn das SMS-Kontingent für das Projekt überschritten wurde, wird eine FirebaseAuthException an diesen Handler gesendet. In diesem Fall würden Sie Ihren Benutzer je nach Fehlercode darauf hinweisen, dass etwas schief gelaufen ist.
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
},
);
Code gesendet
Wenn Firebase einen SMS-Code an das Gerät sendet, wird dieser Handler mit einer verificationId und resendToken ausgelöst (ein resendToken wird nur auf Android-Geräten unterstützt, iOS-Geräte geben immer einen null zurück).
Nach dem Auslösen wäre es ein guter Zeitpunkt, die Benutzeroberfläche Ihrer Anwendung zu aktualisieren, um den Benutzer aufzufordern, den erwarteten SMS-Code einzugeben. Nachdem der SMS-Code eingegeben wurde, können Sie die Verifizierungs-ID mit dem SMS-Code kombinieren, um ein neues PhoneAuthCredential zu erstellen:
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);
},
);
Standardmäßig sendet Firebase eine neue SMS-Nachricht nicht erneut, wenn sie kürzlich gesendet wurde. Sie können dieses Verhalten jedoch überschreiben, indem Sie die Methode verifyPhoneNumber mit dem Token für das erneute Senden an das Argument forceResendingToken erneut aufrufen. Bei Erfolg wird die SMS-Nachricht erneut gesendet.
codeAutoRetrievalTimeout
Auf Android-Geräten, die die automatische SMS-Codeauflösung unterstützen, wird dieser Handler aufgerufen, wenn das Gerät eine SMS-Nachricht nicht innerhalb eines bestimmten Zeitraums automatisch aufgelöst hat. Nach Ablauf des Zeitraums versucht das Gerät nicht mehr, eingehende Nachrichten aufzulösen.
Standardmäßig wartet das Gerät 30 Sekunden, dies kann jedoch mit dem timeout Argument angepasst werden:
FirebaseAuth auth = FirebaseAuth.instance;
await auth.verifyPhoneNumber(
phoneNumber: '+44 7123 123 456',
timeout: const Duration(seconds: 60),
codeAutoRetrievalTimeout: (String verificationId) {
// Auto-resolution timed out...
},
);
Web: signInWithPhoneNumber
Auf Webplattformen können sich Benutzer anmelden, indem sie bestätigen, dass sie Zugriff auf ein Telefon haben, indem sie den SMS-Code eingeben, der an die angegebene Telefonnummer gesendet wird. Für zusätzliche Sicherheit und Spam-Prävention werden Benutzer gebeten, zu beweisen, dass sie ein Mensch sind, indem sie ein Google reCAPTCHA -Widget ausfüllen. Nach der Bestätigung wird der SMS-Code gesendet.
Das Firebase Authentication SDK for Flutter verwaltet das reCAPTCHA-Widget standardmäßig, bietet jedoch die Kontrolle darüber, wie es angezeigt und konfiguriert wird, falls erforderlich. Rufen Sie zunächst die signInWithPhoneNumber -Methode mit der Telefonnummer auf.
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');
Das Aufrufen der Methode löst zunächst die Anzeige des reCAPTCHA-Widgets aus. Der Benutzer muss den Test abschließen, bevor ein SMS-Code gesendet wird. Sobald Sie fertig sind, können Sie den Benutzer anmelden, indem Sie den SMS-Code für die Methode confirm in der aufgelösten Antwort ConfirmationResult bereitstellen:
UserCredential userCredential = await confirmationResult.confirm('123456');
Wie bei anderen Anmeldeabläufen löst eine erfolgreiche Anmeldung alle Authentifizierungsstatus-Listener aus, die Sie in Ihrer gesamten Anwendung abonniert haben.
reCAPTCHA-Konfiguration
Das reCAPTCHA-Widget ist ein vollständig verwalteter Ablauf, der Ihrer Webanwendung Sicherheit bietet.
Das zweite Argument von signInWithPhoneNumber akzeptiert eine optionale RecaptchaVerifier Instanz, die zum Verwalten des Widgets verwendet werden kann. Standardmäßig wird das Widget als unsichtbares Widget gerendert, wenn der Anmeldeablauf ausgelöst wird. Ein „unsichtbares“ Widget wird als ganzseitiges Modal oben auf Ihrer Anwendung angezeigt.
Es ist jedoch möglich, ein Inline-Widget anzuzeigen, auf das der Benutzer explizit drücken muss, um sich zu verifizieren.
Geben Sie zum Hinzufügen eines Inline-Widgets eine DOM-Element-ID für das container der RecaptchaVerifier Instanz an. Das Element muss vorhanden und leer sein, sonst wird ein Fehler ausgegeben. Wenn kein container angegeben wird, wird das Widget als „unsichtbar“ gerendert.
ConfirmationResult confirmationResult = await auth.signInWithPhoneNumber('+44 7123 123 456', RecaptchaVerifier(
container: 'recaptcha',
size: RecaptchaVerifierSize.compact,
theme: RecaptchaVerifierTheme.dark,
));
Sie können die Größe und das Design optional ändern, indem Sie die size und theme wie oben gezeigt anpassen.
Es ist auch möglich, auf Ereignisse zu hören, z. B. ob das reCAPTCHA vom Benutzer abgeschlossen wurde, ob das reCAPTCHA abgelaufen ist oder ob ein Fehler geworfen wurde:
RecaptchaVerifier(
onSuccess: () => print('reCAPTCHA Completed!'),
onError: (FirebaseAuthException error) => print(error),
onExpired: () => print('reCAPTCHA Expired!'),
);
Testen
Firebase bietet Unterstützung für das lokale Testen von Telefonnummern:
- Wählen Sie in der Firebase-Konsole den Authentifizierungsanbieter „Telefon“ aus und klicken Sie auf das Dropdown-Menü „Telefonnummern zum Testen“.
- Geben Sie eine neue Telefonnummer (z. B.
+44 7444 555666) und einen Testcode (z. B.123456) ein.
Wenn Sie eine Testtelefonnummer für die Methode verifyPhoneNumber oder signInWithPhoneNumber angeben, wird tatsächlich keine SMS gesendet. Sie können den Testcode stattdessen direkt an den PhoneAuthProvider oder mit dem Bestätigungsergebnis-Handler von signInWithPhoneNumber übermitteln.