Mit der Telefonauthentifizierung können sich Benutzer mit ihrem Telefon als Authentifizierungsgerät bei Firebase anmelden. An den Benutzer wird eine SMS-Nachricht (unter Verwendung der angegebenen Telefonnummer) gesendet, 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 die Spam- und Missbrauchsprävention 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-Anmeldedienst für Telefonnummern 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, stellen Sie sicher, 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. Informationen zum Ermitteln 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. Darüber hinaus müssen Sie Hintergrundmodi für Remote-Benachrichtigungen aktivieren . Eine ausführliche Erläuterung dieses Schritts finden Sie in der Dokumentation zur Firebase iOS Phone Auth .
- Web : Stellen Sie sicher, dass Sie Ihre Anwendungsdomäne in der Firebase-Konsole unter „OAuth-Umleitungsdomänen“ hinzugefügt haben.
Notiz ; Die Anmeldung per Telefonnummer ist nur für die Verwendung auf echten Geräten und im Internet verfügbar. Informationen zum Testen Ihres Authentifizierungsablaufs auf Geräteemulatoren finden Sie unter Testen .
Verwendung
Das Firebase Authentication SDK für 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 Internet. Daher gibt es für jede Plattform ausschließlich zwei Methoden:
- Native Plattform :
verifyPhoneNumber. - Webplattform :
signInWithPhoneNumber.
Native: verifyPhoneNumber
Auf nativen Plattformen muss zunächst die Telefonnummer des Benutzers überprüft werden. Anschließend 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 vier separate Rückrufe, die Sie verarbeiten müssen. Jeder Rückruf bestimmt, wie Sie die Benutzeroberfläche der Anwendung aktualisieren:
- VerifizierungCompleted : Automatische Verarbeitung des SMS-Codes auf Android-Geräten.
- VerificationFailed : Behandeln Sie Fehlerereignisse wie ungültige Telefonnummern oder ob das SMS-Kontingent überschritten wurde.
- codeSent : Behandelt, wenn ein Code von Firebase an das Gerät gesendet wurde, und wird verwendet, um Benutzer zur Eingabe des Codes aufzufordern.
- codeAutoRetrievalTimeout : Behandelt eine Zeitüberschreitung, wenn die automatische SMS-Code-Verarbeitung fehlschlägt.
VerifizierungAbgeschlossen
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, mit dem Sie sich anmelden oder die Telefonnummer des Benutzers verknüpfen können.
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 wegen einer falschen 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 der Auslösung wäre es ein guter Zeitpunkt, die Benutzeroberfläche Ihrer Anwendung zu aktualisieren, um den Benutzer zur Eingabe des erwarteten SMS-Codes aufzufordern. Sobald 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 Resend-Token für das Argument forceResendingToken erneut aufrufen. Bei Erfolg wird die SMS-Nachricht erneut gesendet.
codeAutoRetrievalTimeout
Auf Android-Geräten, die die automatische Auflösung von SMS-Codes unterstützen, wird dieser Handler aufgerufen, wenn das Gerät eine SMS-Nachricht nicht innerhalb eines bestimmten Zeitraums automatisch aufgelöst hat. Sobald der Zeitrahmen abgelaufen ist, 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-Schutz werden Benutzer gebeten, durch Ausfüllen eines Google reCAPTCHA- Widgets zu beweisen, dass sie ein Mensch sind. Nach der Bestätigung wird der SMS-Code gesendet.
Das Firebase Authentication SDK für Flutter verwaltet das reCAPTCHA-Widget standardmäßig, bietet jedoch bei Bedarf Kontrolle darüber, wie es angezeigt und konfiguriert wird. Rufen Sie zunächst die Methode signInWithPhoneNumber 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');
Durch den Aufruf der Methode wird zunächst die Anzeige des reCAPTCHA-Widgets ausgelöst. Der Benutzer muss den Test abschließen, bevor ein SMS-Code gesendet wird. Sobald der Vorgang abgeschlossen ist, können Sie den Benutzer anmelden, indem Sie der confirm in der aufgelösten ConfirmationResult Antwort den SMS-Code 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 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 Anmeldevorgang ausgelöst wird. Ein „unsichtbares“ Widget wird als ganzseitiges Modal über Ihrer Anwendung angezeigt.
Es ist jedoch möglich, ein Inline-Widget anzuzeigen, auf das der Benutzer explizit drücken muss, um sich zu verifizieren.
Um ein Inline-Widget hinzuzufügen, geben Sie eine DOM-Element-ID für das container der RecaptchaVerifier Instanz an. Das Element muss vorhanden und leer sein, andernfalls wird ein Fehler ausgegeben. Wenn kein container angegeben wird, wird das Widget als „unsichtbar“ dargestellt.
ConfirmationResult confirmationResult = await auth.signInWithPhoneNumber('+44 7123 123 456', RecaptchaVerifier(
container: 'recaptcha',
size: RecaptchaVerifierSize.compact,
theme: RecaptchaVerifierTheme.dark,
));
Sie können optional die Größe und das Design ändern, indem Sie die Argumente für size und theme wie oben gezeigt anpassen.
Es ist auch möglich, Ereignisse abzuhören, z. B. ob das reCAPTCHA vom Benutzer abgeschlossen wurde, ob das reCAPTCHA abgelaufen ist oder 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 Methoden verifyPhoneNumber “ oder signInWithPhoneNumber angeben, wird tatsächlich keine SMS gesendet. Stattdessen können Sie den Testcode direkt an den PhoneAuthProvider oder mit dem Bestätigungsergebnishandler von signInWithPhoneNumber übergeben.