Эта страница переведена с помощью Cloud Translation API.

Аутентификация с использованием Microsoft с JavaScript

Вы можете разрешить пользователям аутентифицироваться в Firebase с помощью поставщиков OAuth, таких как Microsoft Azure Active Directory, интегрировав в свое приложение универсальный вход через OAuth с использованием SDK Firebase для реализации сквозного процесса авторизации.

Прежде чем начать

Для авторизации пользователей с использованием учетных записей Microsoft (Azure Active Directory и личных учетных записей Microsoft) необходимо сначала включить Microsoft в качестве поставщика авторизации для вашего проекта Firebase:

Добавьте Firebase в свой JavaScript-проект .
В консоли Firebase перейдите в раздел Безопасность > Аутентификация .
На вкладке «Способ входа» включите поставщик входа Microsoft .
Добавьте идентификатор клиента (Client ID) и секретный ключ клиента (Client Secret) из консоли разработчика соответствующего поставщика в конфигурацию поставщика:
1. Для регистрации клиента Microsoft OAuth следуйте инструкциям в разделе «Быстрый старт: Регистрация приложения в конечной точке Azure Active Directory v2.0» . Обратите внимание, что эта конечная точка поддерживает вход в систему с использованием как личных учетных записей Microsoft, так и учетных записей Azure Active Directory. Подробнее об Azure Active Directory v2.0 можно узнать здесь.
2. При регистрации приложений у этих провайдеров обязательно зарегистрируйте домен *.firebaseapp.com для вашего проекта в качестве домена перенаправления для вашего приложения.
Нажмите « Сохранить ».

Обрабатывайте процесс авторизации с помощью Firebase SDK.

Если вы разрабатываете веб-приложение, самый простой способ аутентифицировать пользователей в Firebase с помощью их учетных записей Microsoft — это обработать весь процесс входа в систему с помощью Firebase JavaScript SDK.

Для обработки процесса авторизации с помощью Firebase JavaScript SDK выполните следующие действия:

Создайте экземпляр OAuthProvider , используя идентификатор поставщика microsoft.com .

Web

import { OAuthProvider } from "firebase/auth";

const provider = new OAuthProvider('microsoft.com');auth_msft_create_provider.js

Web

var provider = new firebase.auth.OAuthProvider('microsoft.com');microsoft-oauth.js

Необязательно : укажите дополнительные пользовательские параметры OAuth, которые вы хотите отправить вместе с запросом OAuth.
Web
```
provider.setCustomParameters({
  // Force re-consent.
  prompt: 'consent',
  // Target specific email with login hint.
  login_hint: 'user@firstadd.onmicrosoft.com'
});auth_msft_provider_params.js
```
Web
```
provider.setCustomParameters({
  // Force re-consent.
  prompt: 'consent',
  // Target specific email with login hint.
  login_hint: 'user@firstadd.onmicrosoft.com'
});microsoft-oauth.js
```
Информацию о параметрах, поддерживаемых Microsoft, см. в документации Microsoft OAuth . Обратите внимание, что вы не можете передавать параметры, необходимые для Firebase, с помощью setCustomParameters() . К таким параметрам относятся client_id , response_type , redirect_uri , state , scope и response_mode .
Чтобы разрешить вход в приложение только пользователям из определенного клиента Azure AD, можно использовать либо понятное доменное имя клиента Azure AD, либо GUID-идентификатор клиента. Это можно сделать, указав поле "tenant" в объекте пользовательских параметров.
Web
```
provider.setCustomParameters({
  // Optional "tenant" parameter in case you are using an Azure AD tenant.
  // eg. '8eaef023-2b34-4da1-9baa-8bc8c9d6a490' or 'contoso.onmicrosoft.com'
  // or "common" for tenant-independent tokens.
  // The default value is "common".
  tenant: 'TENANT_ID'
});auth_msft_provider_params_tenant.js
```
Web
```
provider.setCustomParameters({
  // Optional "tenant" parameter in case you are using an Azure AD tenant.
  // eg. '8eaef023-2b34-4da1-9baa-8bc8c9d6a490' or 'contoso.onmicrosoft.com'
  // or "common" for tenant-independent tokens.
  // The default value is "common".
  tenant: 'TENANT_ID'
});microsoft-oauth.js
```
Необязательно : укажите дополнительные области действия OAuth 2.0, помимо базового профиля, которые вы хотите запросить у поставщика аутентификации.
```
provider.addScope('mail.read');
provider.addScope('calendars.read');
```
Для получения более подробной информации обратитесь к документации Microsoft по разрешениям и согласиям .
Аутентификация в Firebase осуществляется с помощью объекта поставщика OAuth. Вы можете предложить пользователям войти в систему с помощью своих учетных записей Microsoft, открыв всплывающее окно или перенаправив их на страницу входа. На мобильных устройствах предпочтительнее использовать метод перенаправления.
- Для входа в систему через всплывающее окно вызовите функцию signInWithPopup :
Web
```
import { getAuth, signInWithPopup, OAuthProvider } from "firebase/auth";

const auth = getAuth();
signInWithPopup(auth, provider)
  .then((result) => {
    // User is signed in.
    // IdP data available in result.additionalUserInfo.profile.

    // Get the OAuth access token and ID Token
    const credential = OAuthProvider.credentialFromResult(result);
    const accessToken = credential.accessToken;
    const idToken = credential.idToken;
  })
  .catch((error) => {
    // Handle error.
  });auth_msft_signin_popup.js
```
Web
```
firebase.auth().signInWithPopup(provider)
  .then((result) => {
    // IdP data available in result.additionalUserInfo.profile.
    // ...

    /** @type {firebase.auth.OAuthCredential} */
    var credential = result.credential;

    // OAuth access and id tokens can also be retrieved:
    var accessToken = credential.accessToken;
    var idToken = credential.idToken;
  })
  .catch((error) => {
    // Handle error.
  });microsoft-oauth.js
```
- Для входа в систему с перенаправлением на страницу авторизации вызовите signInWithRedirect :
При использовании signInWithRedirect , linkWithRedirect или reauthenticateWithRedirect следует придерживаться лучших практик .
Web
```
import { getAuth, signInWithRedirect } from "firebase/auth";

const auth = getAuth();
signInWithRedirect(auth, provider);auth_msft_signin_redirect.js
```
Web
```
firebase.auth().signInWithRedirect(provider);microsoft-oauth.js
```
После того, как пользователь завершит вход в систему и вернется на страницу, вы можете получить результат входа в систему, вызвав getRedirectResult .
Web
```
import { getAuth, getRedirectResult, OAuthProvider } from "firebase/auth";

const auth = getAuth();
getRedirectResult(auth)
  .then((result) => {
    // User is signed in.
    // IdP data available in result.additionalUserInfo.profile.

    // Get the OAuth access token and ID Token
    const credential = OAuthProvider.credentialFromResult(result);
    const accessToken = credential.accessToken;
    const idToken = credential.idToken;
  })
  .catch((error) => {
    // Handle error.
  });auth_msft_signin_redirect_result.js
```
Web
```
firebase.auth().getRedirectResult()
  .then((result) => {
    // IdP data available in result.additionalUserInfo.profile.
    // ...

    /** @type {firebase.auth.OAuthCredential} */
    var credential = result.credential;

    // OAuth access and id tokens can also be retrieved:
    var accessToken = credential.accessToken;
    var idToken = credential.idToken;
  })
  .catch((error) => {
    // Handle error.
  });microsoft-oauth.js
```
После успешного завершения процесса токен доступа OAuth, связанный с поставщиком услуг, можно получить из возвращаемого объекта firebase.auth.UserCredential .
Используя токен доступа OAuth, вы можете вызвать API Microsoft Graph .
Например, для получения основной информации профиля можно вызвать следующий REST API:
```
curl -i -H "Authorization: Bearer ACCESS_TOKEN" https://graph.microsoft.com/v1.0/me
```
В отличие от других поставщиков, поддерживаемых Firebase Auth, Microsoft не предоставляет URL-адрес фотографии, и вместо этого двоичные данные для фотографии профиля необходимо запрашивать через Microsoft Graph API .
В дополнение к токену доступа OAuth, токен идентификатора OAuth пользователя также можно получить из объекта firebase.auth.UserCredential . sub в токене идентификатора является специфичным для приложения и не будет совпадать с федеративным идентификатором пользователя, используемым Firebase Auth и доступным через user.providerData[0].uid . Вместо него следует использовать поле утверждения oid . При использовании клиента Azure AD для входа в систему утверждение oid будет точно совпадать. Однако в случае, когда клиент не использует клиент, поле oid дополняется. Для федеративного идентификатора 4b2eabcdefghijkl , oid будет иметь форму 00000000-0000-0000-4b2e-abcdefghijkl .

Хотя приведенные выше примеры сосредоточены на процессах входа в систему, у вас также есть возможность связать поставщика услуг Microsoft с существующим пользователем, используя linkWithPopup / linkWithRedirect . Например, вы можете связать несколько поставщиков услуг с одним и тем же пользователем, позволяя ему входить в систему с помощью любого из них.

Web

import { getAuth, linkWithPopup, OAuthProvider } from "firebase/auth";

const provider = new OAuthProvider('microsoft.com');
const auth = getAuth();

linkWithPopup(auth.currentUser, provider)
    .then((result) => {
      // Microsoft credential is linked to the current user.
      // IdP data available in result.additionalUserInfo.profile.

      // Get the OAuth access token and ID Token
      const credential = OAuthProvider.credentialFromResult(result);
      const accessToken = credential.accessToken;
      const idToken = credential.idToken;
    })
    .catch((error) => {
      // Handle error.
    });auth_msft_link_popup.js

Web

var provider = new firebase.auth.OAuthProvider('microsoft.com');
firebase.auth().currentUser.linkWithPopup(provider)
    .then((result) => {
      // Microsoft credential is linked to the current user.
      // IdP data available in result.additionalUserInfo.profile.
      // OAuth access token can also be retrieved:
      // result.credential.accessToken
      // OAuth ID token can also be retrieved:
      // result.credential.idToken
    })
    .catch((error) => {
      // Handle error.
    });microsoft-oauth.js

Аналогичный подход можно использовать с reauthenticateWithPopup / reauthenticateWithRedirect , которые позволяют получить актуальные учетные данные для выполнения конфиденциальных операций, требующих недавнего входа в систему.

Web

import { getAuth, reauthenticateWithPopup, OAuthProvider } from "firebase/auth";

const provider = new OAuthProvider('microsoft.com');
const auth = getAuth();
reauthenticateWithPopup(auth.currentUser, provider)
    .then((result) => {
      // User is re-authenticated with fresh tokens minted and
      // should be able to perform sensitive operations like account
      // deletion and email or password update.
      // IdP data available in result.additionalUserInfo.profile.

      // Get the OAuth access token and ID Token
      const credential = OAuthProvider.credentialFromResult(result);
      const accessToken = credential.accessToken;
      const idToken = credential.idToken;
    })
    .catch((error) => {
      // Handle error.
    });auth_msft_reauth_popup.js

Web

var provider = new firebase.auth.OAuthProvider('microsoft.com');
firebase.auth().currentUser.reauthenticateWithPopup(provider)
    .then((result) => {
      // User is re-authenticated with fresh tokens minted and
      // should be able to perform sensitive operations like account
      // deletion and email or password update.
      // IdP data available in result.additionalUserInfo.profile.
      // OAuth access token can also be retrieved:
      // result.credential.accessToken
      // OAuth ID token can also be retrieved:
      // result.credential.idToken
    })
    .catch((error) => {
      // Handle error.
    });microsoft-oauth.js

Обработка ошибок, связанных с существованием учетной записи с разными учетными данными.

Если в консоли Firebase включена настройка « Одна учетная запись на один адрес электронной почты» , то при попытке входа пользователя в систему у другого поставщика услуг Firebase (например, Microsoft) с использованием адреса электронной почты, уже существующего у другого поставщика услуг Firebase (например, Google), будет выдана ошибка auth/account-exists-with-different-credential вместе с объектом AuthCredential (учетные данные Microsoft). Для завершения входа в систему у нужного поставщика пользователю необходимо сначала войти в существующую учетную запись поставщика (Google), а затем связать ее с прежними учетными данными AuthCredential (учетные данные Microsoft).

При использовании signInWithPopup вы можете обрабатывать ошибки auth/account-exists-with-different-credential с помощью кода, подобного приведенному ниже примеру:

import {
  getAuth,
  linkWithCredential,
  signInWithPopup,
  OAuthProvider,
} from "firebase/auth";

try {
  // Step 1: User tries to sign in using Microsoft.
  let result = await signInWithPopup(getAuth(), new OAuthProvider());
} catch (error) {
  // Step 2: User's email already exists.
  if (error.code === "auth/account-exists-with-different-credential") {
    // The pending Microsoft credential.
    let pendingCred = error.credential;

    // Step 3: Save the pending credential in temporary storage,

    // Step 4: Let the user know that they already have an account
    // but with a different provider, and let them choose another
    // sign-in method.
  }
}

// ...

try {
  // Step 5: Sign the user in using their chosen method.
  let result = await signInWithPopup(getAuth(), userSelectedProvider);

  // Step 6: Link to the Microsoft credential.
  // TODO: implement `retrievePendingCred` for your app.
  let pendingCred = retrievePendingCred();

  if (pendingCred !== null) {
    // As you have access to the pending credential, you can directly call the
    // link method.
    let user = await linkWithCredential(result.user, pendingCred);
  }

  // Step 7: Continue to app.
} catch (error) {
  // ...
}

Режим перенаправления

В режиме перенаправления эта ошибка обрабатывается аналогичным образом, с той разницей, что ожидающие учетные данные должны кэшироваться между перенаправлениями страниц (например, с использованием хранилища сессий).

В отличие от других OAuth-провайдеров, поддерживаемых Firebase, таких как Google, Facebook и Twitter, где вход в систему может осуществляться напрямую с помощью учетных данных на основе токенов доступа OAuth, Firebase Auth не поддерживает аналогичную возможность для таких провайдеров, как Microsoft, из-за невозможности сервера Firebase Auth проверять целевую аудиторию токенов доступа Microsoft OAuth. Это критически важное требование безопасности, которое может сделать приложения и веб-сайты уязвимыми для атак повторного воспроизведения, когда токен доступа Microsoft OAuth, полученный для одного проекта (злоумышленник), может быть использован для входа в другой проект (жертва). Вместо этого Firebase Auth предлагает возможность обрабатывать весь поток OAuth и обмен кодами авторизации, используя идентификатор клиента OAuth и секрет, настроенные в консоли Firebase. Поскольку код авторизации может использоваться только с определенным идентификатором клиента/секретом, код авторизации, полученный для одного проекта, не может быть использован с другим.

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

Аутентификация с помощью Firebase в расширении Chrome

Если вы разрабатываете расширение для Chrome, ознакомьтесь с руководством по работе с документами, отображаемыми вне экрана .

При создании проекта Firebase автоматически создаст для него уникальный поддомен: https://my-app-12345.firebaseapp.com .

Этот домен также будет использоваться в качестве механизма перенаправления для входа через OAuth. Необходимо разрешить использование этого домена для всех поддерживаемых поставщиков OAuth. Однако это означает, что пользователи могут видеть этот домен при входе в Microsoft, прежде чем произойдет перенаправление обратно в приложение: Перейти по ссылке: https://my-app-12345.firebaseapp.com .

Чтобы избежать отображения вашего поддомена, вы можете настроить собственный домен с помощью Firebase Hosting :

Выполните шаги с 1 по 3 в разделе «Настройка домена для Hosting . После подтверждения права собственности на домен, Hosting выдаст SSL-сертификат для вашего пользовательского домена.
Добавьте свой пользовательский домен в список авторизованных доменов в консоли Firebase : auth.custom.domain.com .
В консоли разработчика Microsoft или на странице настройки OAuth добавьте в белый список URL-адрес страницы перенаправления, которая будет доступна на вашем пользовательском домене: https://auth.custom.domain.com/__/auth/handler .

При инициализации библиотеки JavaScript укажите свой пользовательский домен в поле authDomain :

var config = {
  apiKey: '...',
  // Changed from 'PROJECT_ID.firebaseapp.com'.
  authDomain: 'auth.custom.domain.com',
  databaseURL: 'https://PROJECT_ID.firebaseio.com',
  projectId: 'PROJECT_ID',
  storageBucket: 'PROJECT_ID.firebasestorage.app',
  messagingSenderId: 'SENDER_ID'
};
firebase.initializeApp(config);

Следующие шаги

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

В ваших приложениях рекомендуемый способ узнать статус авторизации пользователя — установить наблюдателя для объекта Auth . Затем вы можете получить основную информацию профиля пользователя из объекта User . См. раздел «Управление пользователями» .
В правилах безопасности Firebase Realtime Database и Cloud Storage вы можете получить уникальный идентификатор пользователя, вошедшего в систему, из переменной auth и использовать его для управления доступом пользователя к данным.

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

Для выхода из системы пользователя вызовите signOut :

Web

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

const auth = getAuth();
signOut(auth).then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});auth_sign_out.js

Web

firebase.auth().signOut().then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});index.js

Аутентификация с использованием Microsoft с JavaScript Оптимизируйте свои подборки Сохраняйте и классифицируйте контент в соответствии со своими настройками.