Добавьте многофакторную аутентификацию TOTP в свое веб-приложение.

Если вы обновили аутентификацию Firebase с помощью Identity Platform, вы можете добавить в свое приложение многофакторную аутентификацию (MFA) с одноразовым паролем на основе времени (TOTP).

Аутентификация Firebase с Identity Platform позволяет использовать TOTP в качестве дополнительного фактора для MFA. Когда вы включите эту функцию, пользователи, пытающиеся войти в ваше приложение, увидят запрос TOTP. Чтобы сгенерировать его, они должны использовать приложение для аутентификации, способное генерировать действительные коды TOTP, например Google Authenticator .

Прежде чем вы начнете

  1. Включите хотя бы одного поставщика, поддерживающего MFA. Обратите внимание, что все поставщики, кроме следующих, поддерживают MFA:

    • Авторизация по телефону
    • Анонимная авторизация
    • Пользовательские токены аутентификации
    • Apple, игровой центр

  2. Убедитесь, что ваше приложение проверяет адреса электронной почты пользователей. MFA требует подтверждения электронной почты. Это не позволяет злоумышленникам зарегистрироваться в службе с адресом электронной почты, которым они не владеют, а затем заблокировать фактического владельца адреса электронной почты путем добавления второго фактора.

  3. Если вы еще этого не сделали, установите Firebase JavaScript SDK .

    TOTP MFA поддерживается только в модульном веб-SDK версий v9.19.1 и выше.

Включить TOTP MFA

Чтобы включить TOTP в качестве второго фактора, используйте Admin SDK или вызовите конечную точку REST конфигурации проекта.

Чтобы использовать Admin SDK, выполните следующие действия:

  1. Если вы еще этого не сделали, установите Firebase Admin Node.js SDK .

    TOTP MFA поддерживается только в Firebase Admin Node.js SDK версии 11.6.0 и выше.

  2. Запустите следующее:

    import { getAuth } from 'firebase-admin/auth';

getAuth().projectConfigManager().updateProjectConfig(
{
      multiFactorConfig: {
          providerConfigs: [{
              state: "ENABLED",
              totpProviderConfig: {
                  adjacentIntervals: {
                      NUM_ADJ_INTERVALS
                  },
              }
          }]
      }
})

    Замените следующее:

    • NUM_ADJ_INTERVALS : количество соседних интервалов временного окна, из которых принимаются TOTP, от нуля до десяти. По умолчанию — пять.

      TOTP работают, гарантируя, что когда две стороны (доказывающая и валидатор) генерируют OTP в течение одного и того же временного окна (обычно продолжительностью 30 секунд), они генерируют один и тот же пароль. Однако, чтобы учесть разницу часов между сторонами и время ответа человека, вы можете настроить службу TOTP так, чтобы она также принимала TOTP из соседних окон.

Чтобы включить TOTP MFA с помощью REST API, выполните следующую команду:

curl -X PATCH "https://identitytoolkit.googleapis.com/admin/v2/projects/PROJECT_ID/config?updateMask=mfa" \
    -H "Authorization: Bearer $(gcloud auth print-access-token)" \
    -H "Content-Type: application/json" \
    -H "X-Goog-User-Project: PROJECT_ID" \
    -d \
    '{
        "mfa": {
          "providerConfigs": [{
            "state": "ENABLED",
            "totpProviderConfig": {
              "adjacentIntervals": "NUM_ADJ_INTERVALS"
            }
          }]
       }
    }'

Замените следующее:

  • PROJECT_ID : идентификатор проекта.

  • NUM_ADJ_INTERVALS : количество интервалов временного окна от нуля до десяти. По умолчанию — пять.

    TOTP работают, гарантируя, что когда две стороны (доказывающая и валидатор) генерируют OTP в течение одного и того же временного окна (обычно продолжительностью 30 секунд), они генерируют один и тот же пароль. Однако, чтобы учесть разницу часов между сторонами и время ответа человека, вы можете настроить службу TOTP так, чтобы она также принимала TOTP из соседних окон.

Выберите схему регистрации

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

  • Зарегистрируйте второй фактор пользователя в рамках регистрации. Используйте этот метод, если ваше приложение требует многофакторной аутентификации для всех пользователей.

  • Предложите возможность пропуска для регистрации второго фактора во время регистрации. Если вы хотите поощрять, но не требовать многофакторную аутентификацию в своем приложении, вы можете использовать этот подход.

  • Предоставьте возможность добавить второй фактор со страницы управления учетной записью или профилем пользователя вместо экрана регистрации. Это сводит к минимуму трудности в процессе регистрации, одновременно делая многофакторную аутентификацию доступной для пользователей, чувствительных к безопасности.

  • Требуйте постепенного добавления второго фактора, когда пользователь хочет получить доступ к функциям с повышенными требованиями безопасности.

Регистрация пользователей в TOTP MFA

После включения TOTP MFA в качестве второго фактора для вашего приложения реализуйте логику на стороне клиента для регистрации пользователей в TOTP MFA:

  1. Импортируйте необходимые классы и функции MFA:

    import {
  multiFactor,
  TotpMultiFactorGenerator,
  TotpSecret,
  getAuth,
} from "firebase/auth";

  2. Повторно авторизуйте пользователя.

  3. Создайте секрет TOTP для аутентифицированного пользователя:

    // Generate a TOTP secret.
const multiFactorSession = await multiFactor(currentUser).getSession();
const totpSecret = await TotpMultiFactorGenerator.generateSecret(
  multiFactorSession
);

  4. Отобразите секрет пользователю и предложите ему ввести его в приложение для проверки подлинности.

    Во многих приложениях для аутентификации пользователи могут быстро добавлять новые секреты TOTP, сканируя QR-код, который представляет собой URI ключа, совместимого с Google Authenticator . Чтобы сгенерировать QR-код для этой цели, сгенерируйте URI с помощью generateQrCodeUrl() , а затем закодируйте его с помощью библиотеки QR-кодов по вашему выбору. Например:

    const totpUri = totpSecret.generateQrCodeUrl(
    currentUser.email,
    "Your App's Name"
);
await QRExampleLib.toCanvas(totpUri, qrElement);

    Независимо от того, отображаете ли вы QR-код, всегда отображайте секретный ключ для поддержки приложений аутентификации, которые не могут считывать QR-коды:

    // Also display this key:
const secret = totpSecret.secretKey;

    После того, как пользователь добавит свой секрет в свое приложение для аутентификации, оно начнет генерировать TOTP.

  5. Предложите пользователю ввести TOTP, отображаемый в его приложении для проверки подлинности, и использовать его для завершения регистрации MFA:

    // Ask the user for a verification code from the authenticator app.
const verificationCode = // Code from user input.

// Finalize the enrollment.
const multiFactorAssertion = TotpMultiFactorGenerator.assertionForEnrollment(
  totpSecret,
  verificationCode
);
await multiFactor(currentUser).enroll(multiFactorAssertion, mfaDisplayName);

Вход пользователей со вторым фактором

Для входа пользователей с помощью TOTP MFA используйте следующий код:

  1. Импортируйте необходимые классы и функции MFA:

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

  2. Вызовите один из методов signInWith - так же, как если бы вы не использовали MFA. (Например, signInWithEmailAndPassword() .) Если метод выдает ошибку auth/multi-factor-auth-required , запустите поток MFA вашего приложения.

    try {
    const userCredential = await signInWithEmailAndPassword(
        getAuth(),
        email,
        password
    );
    // If the user is not enrolled with a second factor and provided valid
    // credentials, sign-in succeeds.

    // (If your app requires MFA, this could be considered an error
    // condition, which you would resolve by forcing the user to enroll a
    // second factor.)

    // ...
} catch (error) {
    switch (error.code) {
        case "auth/multi-factor-auth-required":
            // Initiate your second factor sign-in flow. (See next step.)
            // ...
            break;
        case ...:  // Handle other errors, such as wrong passwords.
            break;
    }
}

  3. Поток MFA вашего приложения должен сначала предложить пользователю выбрать второй фактор, который он хочет использовать. Вы можете получить список поддерживаемых вторых факторов, изучив hints экземпляра MultiFactorResolver :

    const mfaResolver = getMultiFactorResolver(getAuth(), error);
const enrolledFactors = mfaResolver.hints.map(info => info.displayName);

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

    switch (mfaResolver.hints[selectedIndex].factorId) {
    case TotpMultiFactorGenerator.FACTOR_ID:
        const otpFromAuthenticator = // OTP typed by the user.
        const multiFactorAssertion =
            TotpMultiFactorGenerator.assertionForSignIn(
                mfaResolver.hints[selectedIndex].uid,
                otpFromAuthenticator
            );
        try {
            const userCredential = await mfaResolver.resolveSignIn(
                multiFactorAssertion
            );
            // Successfully signed in!
        } catch (error) {
            // Invalid or expired OTP.
        }
        break;
    case PhoneMultiFactorGenerator.FACTOR_ID:
        // Handle SMS second factor.
        break;
    default:
        // Unsupported second factor?
        break;
}

Отписаться от TOTP МИД

В этом разделе описывается, как обрабатывать отмену регистрации пользователя в TOTP MFA.

Если пользователь подписался на несколько вариантов MFA и отменяет регистрацию от последней включенной опции, он получает сообщение auth/user-token-expired и выходит из системы. Пользователь должен снова войти в систему и подтвердить свои существующие учетные данные, например адрес электронной почты и пароль.

Чтобы отменить регистрацию пользователя, обработать ошибку и запустить повторную аутентификацию, используйте следующий код:

import {
    EmailAuthProvider,
    TotpMultiFactorGenerator,
    getAuth,
    multiFactor,
    reauthenticateWithCredential,
} from "firebase/auth";

try {
    // Unenroll from TOTP MFA.
    await multiFactor(currentUser).unenroll(mfaEnrollmentId);
} catch  (error) {
    if (error.code === 'auth/user-token-expired') {
        // If the user was signed out, re-authenticate them.

        // For example, if they signed in with a password, prompt them to
        // provide it again, then call `reauthenticateWithCredential()` as shown
        // below.

        const credential = EmailAuthProvider.credential(email, password);
        await reauthenticateWithCredential(
            currentUser,
            credential
        );
    }
}

Что дальше