Multi-Faktor-Authentifizierung für Ihre Web-App hinzufügen

In diesem Artikel erfahren Sie, wie Sie einer Webanwendung die SMS-Multi-Faktor-Authentifizierung hinzufügen.

Die Multi-Faktor-Authentifizierung erhöht die Sicherheit Ihrer Anwendung. Während Angreifer häufig Passwörter und Konten bei sozialen Netzwerken missbrauchen, ist das Abfangen einer SMS schwieriger.

Hinweis

  1. Aktivieren Sie mindestens einen Anbieter, der die Multi-Faktor-Authentifizierung unterstützt. Alle Anbieter unterstützen die MFA, außer die Telefonauthentifizierung, die anonyme Authentifizierung und das Apple Game Center.

  2. Aktivieren Sie die Regionen, in denen Sie die SMS-Authentifizierung verwenden möchten. Identity Platform verwendet eine vollständig blockierende Richtlinie für SMS-Regionen, hilft Ihnen, Ihre Projekte standardmäßig sicherer zu erstellen.

  3. Achten Sie darauf, dass die Anwendung die E-Mail-Adressen der Nutzer überprüft. Die Multi-Faktor-Authentifizierung erfordert eine E-Mail-Bestätigung. So wird verhindert, dass sich böswillige Akteure bei einem Dienst mit einer E-Mail-Adresse registrieren, die ihnen nicht gehört, und dann den echten Inhaber sperren, indem sie einen zweiten Faktor hinzufügen.

Mehrmandantenfähigkeit verwenden

Wenn Sie die Multi-Faktor-Authentifizierung für die Verwendung in einer Multi-Mandanten-Umgebung aktivieren, führen Sie die folgenden Schritte zusätzlich zum Rest der Anleitung in diesem Dokument aus:

  1. Wählen Sie in der Google Cloud Console den Mandanten aus, mit dem Sie arbeiten möchten.

  2. Setzen Sie in Ihrem Code das Feld tenantId in der Auth-Instanz auf die ID Ihres Mandanten. Beispiel:

    Webversion 9 

    import { getAuth } from "firebase/auth";

const auth = getAuth(app);
auth.tenantId = "myTenantId1";

    Web version 8 

    firebase.auth().tenantId = 'myTenantId1';

Multi-Faktor-Authentifizierung aktivieren

  1. Rufen Sie in der Google Cloud Console die Seite Identity Platform MFA auf.
    Zur MFA-Seite

  2. Klicken Sie im Feld SMS-basierte Multi-Faktor-Authentifizierung auf Aktivieren.

  3. Geben Sie die Telefonnummern ein, mit denen Sie Ihre Anwendung testen möchten. Die Registrierung von Testnummern ist war optional, wird aber dringend empfohlen, um eine Drosselung während der Entwicklung zu vermeiden.

  4. Falls Sie die Domain Ihrer Anwendung noch nicht autorisiert haben, fügen Sie sie der Liste der zulässigen Anwendungen hinzu, indem Sie rechts auf Domain hinzufügen klicken.

  5. Klicken Sie auf Speichern.

Registrierungsmuster auswählen

Sie können auswählen, ob Ihre Anwendung eine Multi-Faktor-Authentifizierung erfordert, und wie und wann Ihre Nutzer registriert werden sollen. Hier einige gängige Muster:

  • Bieten Sie den zweiten Faktor des Nutzers als Teil der Registrierung an. Verwenden Sie diese Methode, wenn Ihre Anwendung eine Multi-Faktor-Authentifizierung für alle Nutzer erfordert.

  • Bieten Sie bei der Registrierung eine überspringbare Option an, mit der ein zweiter Faktor registriert werden kann. Anwendungen, die zwar zur Multi-Faktor-Authentifizierung ermutigen möchten, diese aber nicht erfordern, bevorzugen möglicherweise diesen Ansatz.

  • Ermöglichen Sie, dass ein zweiter Faktor über die Konto- oder Profilverwaltungsseite des Nutzers hinzufügbar ist anstelle über den Anmeldebildschirm. Dadurch wird der Registrierungsprozess vereinfacht und gleichzeitig die Multi-Faktor-Authentifizierung für sicherheitsorientierte Nutzer verfügbar gemacht.

  • Das Hinzufügen eines zweiten Faktors ist erforderlich, wenn der Nutzer auf Features mit höheren Sicherheitsanforderungen zugreifen möchte.

reCAPTCHA-Verifizierung einrichten

Bevor Sie SMS-Codes senden können, müssen Sie einen reCAPTCHA-Verifizierer konfigurieren. Identity Platform verwendet reCAPTCHA, um Missbrauch zu verhindern, indem sichergestellt wird, dass Anfragen zur Bestätigung der Telefonnummer von einer der zulässigen Domains Ihrer Anwendung stammen.

Sie müssen reCAPTCHA-Client nicht manuell einrichten. der Client-SDKs RecaptchaVerifier-Objekt erstellt und initialisiert alle erforderlichen Clientschlüsseln und Secrets.

Unsichtbares reCAPTCHA verwenden

Das RecaptchaVerifier-Objekt unterstützt unsichtbares reCAPTCHA, das den Nutzer häufig ohne Interaktion überprüfen kann. Wenn Sie ein nicht sichtbares reCAPTCHA verwenden möchten, erstellen Sie einen RecaptchaVerifier mit dem Parameter size auf invisible und geben Sie die ID des UI-Elements an, mit dem die Multi-Faktor-Registrierung gestartet wird:

Webversion 9 

import { RecaptchaVerifier } from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier("sign-in-button", {
    "size": "invisible",
    "callback": function(response) {
        // reCAPTCHA solved, you can proceed with
        // phoneAuthProvider.verifyPhoneNumber(...).
        onSolvedRecaptcha();
    }
}, auth);

Webversion 8 

var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sign-in-button', {
'size': 'invisible',
'callback': function(response) {
  // reCAPTCHA solved, you can proceed with phoneAuthProvider.verifyPhoneNumber(...).
  onSolvedRecaptcha();
}
});

reCAPTCHA-Widget verwenden

Wenn Sie ein sichtbares reCAPTCHA-Widget verwenden möchten, erstellen Sie ein HTML-Element, das das Widget enthält, und erstellen Sie dann ein RecaptchaVerifier-Objekt mit der ID des UI-Containers. Sie können optional auch Callbacks einrichten, die aufgerufen werden, wenn das reCAPTCHA aufgelöst wird oder abläuft:

Web version 9 

import { RecaptchaVerifier } from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier(
    "recaptcha-container",

    // Optional reCAPTCHA parameters.
    {
      "size": "normal",
      "callback": function(response) {
        // reCAPTCHA solved, you can proceed with
        // phoneAuthProvider.verifyPhoneNumber(...).
        onSolvedRecaptcha();
      },
      "expired-callback": function() {
        // Response expired. Ask user to solve reCAPTCHA again.
        // ...
      }
    }, auth
);

Webversion 8 

var recaptchaVerifier = new firebase.auth.RecaptchaVerifier(
  'recaptcha-container',
  // Optional reCAPTCHA parameters.
  {
    'size': 'normal',
    'callback': function(response) {
      // reCAPTCHA solved, you can proceed with phoneAuthProvider.verifyPhoneNumber(...).
      // ...
      onSolvedRecaptcha();
    },
    'expired-callback': function() {
      // Response expired. Ask user to solve reCAPTCHA again.
      // ...
    }
  });

reCAPTCHA vorab rendern

Optional können Sie das reCAPTCHA vorab rendern, bevor Sie die Zwei-Faktor-Registrierung starten:

Web version 9 

recaptchaVerifier.render()
    .then(function (widgetId) {
        window.recaptchaWidgetId = widgetId;
    });

Webversion 8 

recaptchaVerifier.render()
  .then(function(widgetId) {
    window.recaptchaWidgetId = widgetId;
  });

Nachdem render() aufgelöst wurde, erhalten Sie die Widget-ID des reCAPTCHAs, mit der Sie die reCAPTCHA API aufrufen können:

var recaptchaResponse = grecaptcha.getResponse(window.recaptchaWidgetId);

RecaptchaVerifier abstrahiert diese Logik mit der Methode verify, sodass Sie die Variable grecaptcha nicht direkt verarbeiten müssen.

Zweiten Faktor registrieren

So registrieren Sie einen neuen zweiten Faktor für einen Nutzer:

  1. Authentifizieren Sie den Nutzer noch einmal.

  2. Fordern Sie den Nutzer zur Eingabe seiner Telefonnummer auf.

  3. Initialisieren Sie die reCAPTCHA-Verifizierung wie im vorherigen Abschnitt beschrieben. Überspringen Sie diesen Schritt, wenn bereits eine RecaptchaVerifier-Instanz konfiguriert wurde:

    Web version 9 

    import { RecaptchaVerifier } from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier('recaptcha-container-id', undefined, auth);

    Webversion 8 

    var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container-id');

  4. Starten Sie eine Multi-Faktor-Sitzung für den Nutzer:

    Webversion 9 

    import { multiFactor } from "firebase/auth";

multiFactor(user).getSession().then(function (multiFactorSession) {
    // ...
});

    Webversion 8 

    user.multiFactor.getSession().then(function(multiFactorSession) {
  // ...
})

  5. Initialisieren Sie ein PhoneInfoOptions-Objekt mit der Telefonnummer des Nutzers und der Multi-Faktor-Sitzung:

    Web version 9 

    // Specify the phone number and pass the MFA session.
const phoneInfoOptions = {
  phoneNumber: phoneNumber,
  session: multiFactorSession
};

    Web version 8 

    // Specify the phone number and pass the MFA session.
var phoneInfoOptions = {
  phoneNumber: phoneNumber,
  session: multiFactorSession
};

  6. Senden Sie eine Bestätigungsnachricht an das Mobiltelefon des Nutzers:

    Web version 9 

    import { PhoneAuthProvider } from "firebase/auth";

const phoneAuthProvider = new PhoneAuthProvider(auth);
phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
    .then(function (verificationId) {
        // verificationId will be needed to complete enrollment.
    });

    Web version 8 

    var phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
// Send SMS verification code.
return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
  .then(function(verificationId) {
    // verificationId will be needed for enrollment completion.
  })

    Als Best Practice wird empfohlen, die Nutzer vorab darüber zu informieren, dass sie eine SMS erhalten und dabei die üblichen Gebühren anfallen.

  7. Wenn die Anfrage fehlschlägt, setzen Sie das reCAPTCHA zurück und wiederholen Sie den vorherigen Schritt, damit der Nutzer es noch einmal versuchen kann. Beachten Sie, dass verifyPhoneNumber() das reCAPTCHA automatisch zurückgesetzt, wenn ein Fehler auftritt, da reCAPTCHA-Tokens nur einmalig verwendet werden.

    Webversion 9 

    recaptchaVerifier.clear();

    Web version 8 

    recaptchaVerifier.clear();

  8. Nachdem der SMS-Code gesendet wurde, bitten Sie den Nutzer, den Code zu bestätigen:

    Web version 9 

    // Ask user for the verification code. Then:
const cred = PhoneAuthProvider.credential(verificationId, verificationCode);

    Webversion 8 

    // Ask user for the verification code. Then:
var cred = firebase.auth.PhoneAuthProvider.credential(verificationId, verificationCode);

  9. Initialisieren Sie ein MultiFactorAssertion-Objekt mit PhoneAuthCredential:

    Web version 9 

    import { PhoneMultiFactorGenerator } from "firebase/auth";

const multiFactorAssertion = PhoneMultiFactorGenerator.assertion(cred);

    Webversion 8 

    var multiFactorAssertion = firebase.auth.PhoneMultiFactorGenerator.assertion(cred);

  10. Schließen Sie die Anmeldung ab. Optional können Sie einen Anzeigenamen für den zweiten Faktor angeben. Dies ist für Nutzer mit mehreren zweiten Faktoren hilfreich, da die Telefonnummer während des Authentifizierungsvorgangs maskiert wird (z. B. +1******1234).

    Web version 9 

    // Complete enrollment. This will update the underlying tokens
// and trigger ID token change listener.
multiFactor(user).enroll(multiFactorAssertion, "My personal phone number");

    Webversion 8 

    // Complete enrollment. This will update the underlying tokens
// and trigger ID token change listener.
user.multiFactor.enroll(multiFactorAssertion, 'My personal phone number');

Der folgende Code zeigt ein vollständiges Beispiel für die Registrierung eines zweiten Faktors:

Web version 9 

import {
    multiFactor, PhoneAuthProvider, PhoneMultiFactorGenerator,
    RecaptchaVerifier
} from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier('recaptcha-container-id', undefined, auth);
multiFactor(user).getSession()
    .then(function (multiFactorSession) {
        // Specify the phone number and pass the MFA session.
        const phoneInfoOptions = {
            phoneNumber: phoneNumber,
            session: multiFactorSession
        };

        const phoneAuthProvider = new PhoneAuthProvider(auth);

        // Send SMS verification code.
        return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier);
    }).then(function (verificationId) {
        // Ask user for the verification code. Then:
        const cred = PhoneAuthProvider.credential(verificationId, verificationCode);
        const multiFactorAssertion = PhoneMultiFactorGenerator.assertion(cred);

        // Complete enrollment.
        return multiFactor(user).enroll(multiFactorAssertion, mfaDisplayName);
    });

Web version 8 

var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container-id');
user.multiFactor.getSession().then(function(multiFactorSession) {
  // Specify the phone number and pass the MFA session.
  var phoneInfoOptions = {
    phoneNumber: phoneNumber,
    session: multiFactorSession
  };
  var phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
  // Send SMS verification code.
  return phoneAuthProvider.verifyPhoneNumber(
      phoneInfoOptions, recaptchaVerifier);
})
.then(function(verificationId) {
  // Ask user for the verification code.
  var cred = firebase.auth.PhoneAuthProvider.credential(verificationId, verificationCode);
  var multiFactorAssertion = firebase.auth.PhoneMultiFactorGenerator.assertion(cred);
  // Complete enrollment.
  return user.multiFactor.enroll(multiFactorAssertion, mfaDisplayName);
});

Glückwunsch! Sie haben erfolgreich einen zweiten Authentifizierungsfaktor für einen Nutzer registriert.

Nutzer mit einem zweiten Faktor anmelden

So melden Sie einen Nutzer mit der SMS-Bestätigung in zwei Schritten an:

  1. Melden Sie den Nutzer mit dessen ersten Faktor an. Dann rufen Sie den Fehler auth/multi-factor-auth-required ab. Dieser Fehler enthält einen Resolver, enthält Hinweise zu den registrierten zweiten Faktoren und einer zugrunde liegenden Sitzung, die bestätigt, dass der Nutzer mit dem ersten Faktor authentifiziert wurde.

    Wenn der erste Faktor des Nutzers beispielsweise eine E-Mail und ein Passwort war, tun Sie Folgendes:

    Webversion 9 

    import { getAuth, getMultiFactorResolver} from "firebase/auth";

const auth = getAuth();
signInWithEmailAndPassword(auth, email, password)
    .then(function (userCredential) {
        // User successfully signed in and is not enrolled with a second factor.
    })
    .catch(function (error) {
        if (error.code == 'auth/multi-factor-auth-required') {
            // The user is a multi-factor user. Second factor challenge is required.
            resolver = getMultiFactorResolver(auth, error);
            // ...
        } else if (error.code == 'auth/wrong-password') {
            // Handle other errors such as wrong password.
        }
});

    Webversion 8 

    firebase.auth().signInWithEmailAndPassword(email, password)
  .then(function(userCredential) {
    // User successfully signed in and is not enrolled with a second factor.
  })
  .catch(function(error) {
    if (error.code == 'auth/multi-factor-auth-required') {
      // The user is a multi-factor user. Second factor challenge is required.
      resolver = error.resolver;
      // ...
    } else if (error.code == 'auth/wrong-password') {
      // Handle other errors such as wrong password.
    } ...
  });

    Wenn der erste Faktor des Nutzers ein föderierter Anbieter wie OAuth, SAML oder OIDC ist, wird der Fehler nach dem Aufruf von signInWithPopup() oder signInWithRedirect() abgefangen.

  2. Wenn der Nutzer mehrere sekundäre Faktoren registriert hat, fragen Sie ihn, welchen er verwenden möchte:

    Web version 9 

    // Ask user which second factor to use.
// You can get the masked phone number via resolver.hints[selectedIndex].phoneNumber
// You can get the display name via resolver.hints[selectedIndex].displayName

if (resolver.hints[selectedIndex].factorId ===
    PhoneMultiFactorGenerator.FACTOR_ID) {
    // User selected a phone second factor.
    // ...
} else if (resolver.hints[selectedIndex].factorId ===
           TotpMultiFactorGenerator.FACTOR_ID) {
    // User selected a TOTP second factor.
    // ...
} else {
    // Unsupported second factor.
}

    Webversion 8 

    // Ask user which second factor to use.
// You can get the masked phone number via resolver.hints[selectedIndex].phoneNumber
// You can get the display name via resolver.hints[selectedIndex].displayName
if (resolver.hints[selectedIndex].factorId === firebase.auth.PhoneMultiFactorGenerator.FACTOR_ID) {
  // User selected a phone second factor.
  // ...
} else if (resolver.hints[selectedIndex].factorId === firebase.auth.TotpMultiFactorGenerator.FACTOR_ID) {
  // User selected a TOTP second factor.
  // ...
} else {
  // Unsupported second factor.
}

  3. Initialisieren Sie die reCAPTCHA-Verifizierung wie im vorherigen Abschnitt beschrieben. Überspringen Sie diesen Schritt, wenn bereits eine RecaptchaVerifier-Instanz konfiguriert wurde:

    Web version 9 

    import { RecaptchaVerifier } from "firebase/auth";

recaptchaVerifier = new RecaptchaVerifier('recaptcha-container-id', undefined, auth);

    Web version 8 

    var recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container-id');

  4. Initialisieren Sie ein PhoneInfoOptions-Objekt mit der Telefonnummer des Nutzers und der Multi-Faktor-Sitzung. Diese Werte sind im Objekt resolver enthalten, das an den Fehler auth/multi-factor-auth-required übergeben wird:

    Web version 9 

    const phoneInfoOptions = {
    multiFactorHint: resolver.hints[selectedIndex],
    session: resolver.session
};

    Web version 8 

    var phoneInfoOptions = {
  multiFactorHint: resolver.hints[selectedIndex],
  session: resolver.session
};

  5. Senden Sie eine Bestätigungsnachricht an das Mobiltelefon des Nutzers:

    Web version 9 

    // Send SMS verification code.
const phoneAuthProvider = new PhoneAuthProvider(auth);
phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
    .then(function (verificationId) {
        // verificationId will be needed for sign-in completion.
    });

    Web version 8 

    var phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
// Send SMS verification code.
return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
  .then(function(verificationId) {
    // verificationId will be needed for sign-in completion.
  })

  6. Wenn die Anfrage fehlschlägt, setzen Sie das reCAPTCHA zurück und wiederholen Sie den vorherigen Schritt, damit der Nutzer es noch einmal versuchen kann:

    Web version 9 

    recaptchaVerifier.clear();

    Web version 8 

    recaptchaVerifier.clear();

  7. Nachdem der SMS-Code gesendet wurde, bitten Sie den Nutzer, den Code zu bestätigen:

    Web version 9 

    const cred = PhoneAuthProvider.credential(verificationId, verificationCode);

    Webversion 8 

    // Ask user for the verification code. Then:
var cred = firebase.auth.PhoneAuthProvider.credential(verificationId, verificationCode);

  8. Initialisieren Sie ein MultiFactorAssertion-Objekt mit PhoneAuthCredential:

    Web version 9 

    const multiFactorAssertion = PhoneMultiFactorGenerator.assertion(cred);

    Web version 8 

    var multiFactorAssertion = firebase.auth.PhoneMultiFactorGenerator.assertion(cred);

  9. Rufen Sie resolver.resolveSignIn() auf, um die sekundäre Authentifizierung abzuschließen. Sie können dann auf das ursprüngliche Anmeldeergebnis zugreifen, das die anbieterspezifischen Daten und Anmeldedaten zur Authentifizierung enthält:

    Webversion 9 

    // Complete sign-in. This will also trigger the Auth state listeners.
resolver.resolveSignIn(multiFactorAssertion)
    .then(function (userCredential) {
        // userCredential will also contain the user, additionalUserInfo, optional
        // credential (null for email/password) associated with the first factor sign-in.

        // For example, if the user signed in with Google as a first factor,
        // userCredential.additionalUserInfo will contain data related to Google
        // provider that the user signed in with.
        // - user.credential contains the Google OAuth credential.
        // - user.credential.accessToken contains the Google OAuth access token.
        // - user.credential.idToken contains the Google OAuth ID token.
    });

    Web version 8 

    // Complete sign-in. This will also trigger the Auth state listeners.
resolver.resolveSignIn(multiFactorAssertion)
  .then(function(userCredential) {
    // userCredential will also contain the user, additionalUserInfo, optional
    // credential (null for email/password) associated with the first factor sign-in.
    // For example, if the user signed in with Google as a first factor,
    // userCredential.additionalUserInfo will contain data related to Google provider that
    // the user signed in with.
    // user.credential contains the Google OAuth credential.
    // user.credential.accessToken contains the Google OAuth access token.
    // user.credential.idToken contains the Google OAuth ID token.
  });

Der folgende Code zeigt ein vollständiges Beispiel für die Anmeldung eines Multi-Faktor-Nutzers:

Webversion 9 

import {
    getAuth,
    getMultiFactorResolver,
    PhoneAuthProvider,
    PhoneMultiFactorGenerator,
    RecaptchaVerifier,
    signInWithEmailAndPassword
} from "firebase/auth";

const recaptchaVerifier = new RecaptchaVerifier('recaptcha-container-id', undefined, auth);

const auth = getAuth();
signInWithEmailAndPassword(auth, email, password)
    .then(function (userCredential) {
        // User is not enrolled with a second factor and is successfully
        // signed in.
        // ...
    })
    .catch(function (error) {
        if (error.code == 'auth/multi-factor-auth-required') {
            const resolver = getMultiFactorResolver(auth, error);
            // Ask user which second factor to use.
            if (resolver.hints[selectedIndex].factorId ===
                PhoneMultiFactorGenerator.FACTOR_ID) {
                const phoneInfoOptions = {
                    multiFactorHint: resolver.hints[selectedIndex],
                    session: resolver.session
                };
                const phoneAuthProvider = new PhoneAuthProvider(auth);
                // Send SMS verification code
                return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
                    .then(function (verificationId) {
                        // Ask user for the SMS verification code. Then:
                        const cred = PhoneAuthProvider.credential(
                            verificationId, verificationCode);
                        const multiFactorAssertion =
                            PhoneMultiFactorGenerator.assertion(cred);
                        // Complete sign-in.
                        return resolver.resolveSignIn(multiFactorAssertion)
                    })
                    .then(function (userCredential) {
                        // User successfully signed in with the second factor phone number.
                    });
            } else if (resolver.hints[selectedIndex].factorId ===
                       TotpMultiFactorGenerator.FACTOR_ID) {
                // Handle TOTP MFA.
                // ...
            } else {
                // Unsupported second factor.
            }
        } else if (error.code == 'auth/wrong-password') {
            // Handle other errors such as wrong password.
        }
    });

Web version 8 

var resolver;
firebase.auth().signInWithEmailAndPassword(email, password)
  .then(function(userCredential) {
    // User is not enrolled with a second factor and is successfully signed in.
    // ...
  })
  .catch(function(error) {
    if (error.code == 'auth/multi-factor-auth-required') {
      resolver = error.resolver;
      // Ask user which second factor to use.
      if (resolver.hints[selectedIndex].factorId ===
          firebase.auth.PhoneMultiFactorGenerator.FACTOR_ID) {
        var phoneInfoOptions = {
          multiFactorHint: resolver.hints[selectedIndex],
          session: resolver.session
        };
        var phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
        // Send SMS verification code
        return phoneAuthProvider.verifyPhoneNumber(phoneInfoOptions, recaptchaVerifier)
          .then(function(verificationId) {
            // Ask user for the SMS verification code.
            var cred = firebase.auth.PhoneAuthProvider.credential(
                verificationId, verificationCode);
            var multiFactorAssertion =
                firebase.auth.PhoneMultiFactorGenerator.assertion(cred);
            // Complete sign-in.
            return resolver.resolveSignIn(multiFactorAssertion)
          })
          .then(function(userCredential) {
            // User successfully signed in with the second factor phone number.
          });
      } else if (resolver.hints[selectedIndex].factorId ===
        firebase.auth.TotpMultiFactorGenerator.FACTOR_ID) {
        // Handle TOTP MFA.
        // ...
      } else {
        // Unsupported second factor.
      }
    } else if (error.code == 'auth/wrong-password') {
      // Handle other errors such as wrong password.
    } ...
  });

Glückwunsch! Sie haben sich erfolgreich mit einer Multi-Faktor-Authentifizierung für einen Nutzer angemeldet.

Nächste Schritte