Краткое руководство: Вход пользователей в образец веб-приложения

Область применения: арендаторы рабочей силы внешние арендаторы (узнать больше)

В этом кратком руководстве вы используете пример веб-приложения, чтобы показать, как войти в учетные записи пользователей и вызвать API Microsoft Graph в подписке вашей организации. Пример приложения использует библиотеку проверки подлинности Майкрософт для обработки проверки подлинности.

Прежде чем начать, воспользуйтесь селектором Выберите тип арендатора в верхней части этой страницы, чтобы выбрать тип арендатора. Идентификатор Microsoft Entra предоставляет две конфигурации арендатора: рабочие и внешние. Конфигурация тенанта рабочей среды предназначена для ваших сотрудников, внутренних приложений и других организационных ресурсов. Внешний клиент предназначен для ваших клиентских приложений.

Необходимые условия

• Учетная запись Azure с активной подпиской. Если у вас еще нет учетной записи, пожалуйста, зарегистрируйтесь бесплатно.
• Эта учетная запись Azure должна иметь разрешения на управление приложениями. Любые из следующих ролей Microsoft Entra включают необходимые разрешения:
  • Администратор приложений
  • Разработчик приложений
• Арендатор рабочей силы. Вы можете использовать каталог по умолчанию или настроить новый клиент.
• Visual Studio Code или другой редактор кода.

узел

• Зарегистрируйте новое приложение в Центре администрирования Microsoft Entra, настроенное только для учетных записей в этом каталоге организации. Дополнительные сведения см. в статье "Регистрация приложения ". Запишите следующие значения на странице обзора приложения для последующего использования:
  • Идентификатор приложения (клиента)
  • Идентификатор каталога (арендатора)
• Добавьте следующие URI перенаправления с помощью конфигурации веб-платформы . Дополнительные сведения см. в статье о добавлении URI перенаправления в приложение .
  • URI перенаправления: http://localhost:3000/auth/redirect
  • URL-адрес выхода фронтального канала: https://localhost:5001/signout-callback-oidc
• Добавьте секрет клиента в регистрацию приложения. Не используйте секреты клиента в рабочих приложениях. Вместо этого используйте сертификаты или федеративные учетные данные. Дополнительные сведения см. в статье о добавлении учетных данных в приложение.
• Node.js

ASP.NET Core

• Зарегистрируйте новое приложение в Центре администрирования Microsoft Entra, настроенное только для учетных записей в этом каталоге организации. Дополнительные сведения см. в статье "Регистрация приложения ". Запишите следующие значения на странице обзора приложения для последующего использования:
  • Идентификатор приложения (клиента)
  • Идентификатор каталога (арендатора)
• Добавьте следующие URI перенаправления с помощью конфигурации веб-платформы . Дополнительные сведения см. в статье о добавлении URI перенаправления в приложение .
  • URI перенаправления: https://localhost:5001/signin-oidc
  • URL-адрес выхода фронтального канала: https://localhost:5001/signout-callback-oidc
• Добавьте самозаверяющий сертификат в регистрацию приложения. Не используйте самозаверяемые сертификаты в рабочих приложениях. Вместо этого используйте сертификат из доверенного центра сертификации или федеративных учетных данных. Дополнительные сведения см. в статье о добавлении учетных данных в приложение. Создайте сертификат с помощью следующей команды:

  dotnet dev-certs https -ep ./certificate.crt --trust
  

• Минимальное требование пакета SDK для .NET 8.0

Python Flask

• Зарегистрируйте новое приложение в Центре администрирования Microsoft Entra, настроенное только для учетных записей в этом каталоге организации. Дополнительные сведения см. в статье "Регистрация приложения ". Запишите следующие значения на странице обзора приложения для последующего использования:
  • Идентификатор приложения (клиента)
  • Идентификатор каталога (арендатора)
• Добавьте следующие URI перенаправления с помощью конфигурации веб-платформы . Дополнительные сведения см. в статье о добавлении URI перенаправления в приложение .
  • URI перенаправления: http://localhost:5000/getAToken
• Python 3 +
• Добавьте секрет клиента в регистрацию приложения. Не используйте секреты клиента в рабочих приложениях. Вместо этого используйте сертификаты или федеративные учетные данные. Дополнительные сведения см. в статье о добавлении учетных данных в приложение.

Клонирование или скачивание примера веб-приложения

Чтобы получить пример приложения, можно клонировать его из GitHub или скачать его в виде файла .zip.

узел

• Скачайте файл .zip, затем распакуйте его в папку с именем, содержащим менее 260 символов, или клонируйте репозиторий:

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

  git clone https://github.com/Azure-Samples/ms-identity-node.git
  

ASP.NET Core

• Скачайте файл .zip, затем распакуйте его в папку с именем, содержащим менее 260 символов, или клонируйте репозиторий:

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

  git clone https://github.com/Azure-Samples/ms-identity-docs-code-dotnet.git
  

Python Flask

• Скачайте пример кода Python затем извлеките его в путь к файлу, где длина имени меньше 260 символов или клонируйте репозиторий:

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

git clone https://github.com/Azure-Samples/ms-identity-docs-code-python/

Настройка примера веб-приложения

Для входа пользователей в демонстрационном приложении, необходимо обновить его, добавив сведения о вашем приложении и арендаторе.

узел

В папке ms-identity-node откройте файл App/.env и замените следующие заполнители:

Переменная	Описание	Примеры
Enter_the_Cloud_Instance_Id_Here	Облачный экземпляр Azure, в котором зарегистрировано приложение	https://login.microsoftonline.com/ (добавьте конечную косую черту)
Enter_the_Tenant_Info_here	Идентификатор клиента или основной домен	contoso.microsoft.com или aaaabbbb-0000-cccc-1111-dddd2222eeee
Enter_the_Application_Id_Here	Идентификатор клиента зарегистрированного приложения	00001111-aaaa-2222-bbbb-3333cccc4444
Enter_the_Client_Secret_Here	Секрет клиента приложения, которое вы зарегистрировали	A1b-C2d_E3f.H4i,J5k?L6m!N7o-P8q_R9s.T0u
Enter_the_Graph_Endpoint_Here	Экземпляр облачной API Microsoft Graph, на который ссылается ваше приложение	https://graph.microsoft.com/ (добавьте конечную косую черту)
Enter_the_Express_Session_Secret_Here	Случайная строка символов, используемая для подписывания файла cookie сеанса Express	A1b-C2d_E3f.H4...

После внесения изменений файл должен выглядеть следующим фрагментом кода:

CLOUD_INSTANCE=https://login.microsoftonline.com/
TENANT_ID=aaaabbbb-0000-cccc-1111-dddd2222eeee
CLIENT_ID=00001111-aaaa-2222-bbbb-3333cccc4444
CLIENT_SECRET=A1b-C2d_E3f.H4...

REDIRECT_URI=http://localhost:3000/auth/redirect
POST_LOGOUT_REDIRECT_URI=http://localhost:3000

GRAPH_API_ENDPOINT=https://graph.microsoft.com/

EXPRESS_SESSION_SECRET=6DP6v09eLiW7f1E65B8k

ASP.NET Core

1. В интегрированной среде разработки откройте папку проекта, ms-identity-docs-code-dotnet\web-app-aspnet, содержащую пример.

2. Откройте appsettings.json и замените содержимое файла следующим фрагментом кода;

   {
   "AzureAd": {
     "Instance": "https://login.microsoftonline.com/",
     "TenantId": "Enter the tenant ID obtained from the Microsoft Entra admin center",
     "ClientId": "Enter the client ID obtained from the Microsoft Entra admin center",
     "ClientCredentials": [
       {
         "SourceType": "StoreWithThumbprint",
         "CertificateStorePath": "CurrentUser/My",
         "CertificateThumbprint": "Enter the certificate thumbprint obtained the Microsoft Entra admin center"
       }   
     ],
     "CallbackPath": "/signin-oidc"
   },
     "DownstreamApis": {
       "MicrosoftGraph" :{
         "BaseUrl": "https://graph.microsoft.com/v1.0/",
         "RelativePath": "me",
         "Scopes": [ 
           "user.read" 
         ]
      }
     },
     "Logging": {
       "LogLevel": {
         "Default": "Information",
         "Microsoft.AspNetCore": "Warning"
       }
     },
     "AllowedHosts": "*"
   }
   

   • TenantId — идентификатор клиента, в котором зарегистрировано приложение. Замените текст в кавычках на Directory (tenant) ID, записанный ранее на странице обзора зарегистрированного приложения.
   • ClientId — идентификатор приложения, который также называется клиентом. Замените текст в кавычках значением Application (client) ID, записанным ранее на странице обзора зарегистрированного приложения.
   • ClientCertificates . Самозаверяющий сертификат используется для проверки подлинности в приложении. Замените текст из CertificateThumbprint отпечатком сертификата, записанного заранее.

Python Flask

1. Откройте приложение, скачаемое в интегрированной среде разработки, и перейдите в корневую папку примера приложения.

   cd flask-web-app
   

2. Создайте файл .env в корневой папке проекта с помощью .env.sample.entra-id в качестве руководства.

   # The following variables are required for the app to run.
   CLIENT_ID=<Enter_your_client_id>
   CLIENT_SECRET=<Enter_your_client_secret>
   AUTHORITY=<Enter_your_authority_url>
   

   • Установите значение CLIENT_ID как идентификатор приложения (клиента) для зарегистрированного приложения, который доступен на странице обзора.
   • Установите значение CLIENT_SECRET в ключ клиента, созданный в разделе Сертификаты и секреты для зарегистрированного приложения.
   • Установите значение AUTHORITY на https://login.microsoftonline.com/<TENANT_GUID>. Идентификатор каталога (клиента) с ID доступен на странице обзора регистрации приложения.

   Переменные среды упоминаются в app_config.pyи хранятся в отдельном .env файле, чтобы они не попадали в систему управления версиями. Предоставленный файл .gitignore предотвращает добавление файла .env в репозиторий.

Запуск и тестирование примера веб-приложения

Вы настроили тестовое приложение. Вы можете запустить это и протестировать.

узел

1. Чтобы запустить сервер, выполните следующие команды из каталога проекта:

   cd App
   npm install
   npm start
   

2. Перейдите к http://localhost:3000/.

3. Выберите войти, чтобы запустить процесс входа.

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

Как работает приложение

В примере размещен веб-сервер на локальном узле, порт 3000. Когда веб-браузер обращается к этому адресу, приложение отображает домашнюю страницу. После того как пользователь выберет Войти, приложение перенаправит браузер на экран входа в Microsoft Entra по URL-адресу, созданному библиотекой MSAL Node. После согласия пользователя браузер перенаправляет пользователя обратно на домашнюю страницу приложения вместе с идентификатором и маркером доступа.

ASP.NET Core

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

   cd ms-identity-docs-code-dotnet/web-app-aspnet
   dotnet run
   

2. Скопируйте URL-адрес https, который отображается в терминале, например https://localhost:5001, и вставьте его в браузер. Рекомендуется использовать частный или инкогнито браузерный сеанс.

3. Выполните действия и введите необходимые сведения для входа с помощью учетной записи Майкрософт. Вам предлагается указать адрес электронной почты, чтобы один раз был отправлен секретный код. Введите код при появлении запроса.

4. Приложение запрашивает разрешение на сохранение доступа к предоставленным данным, а также на вход и чтение вашего профиля. Выберите Принять. Откроется следующий снимок экрана. Он указывает, что вы вошли в приложение и просматриваете сведения о профиле из API Microsoft Graph.

   

Выход из приложения

1. Найдите ссылку "Выйти из системы" в правом верхнем углу страницы и выберите её.
2. Вас просят выбрать учетную запись для выхода. Выберите учетную запись, используемую для входа.
3. Появится сообщение, указывающее, что вы выполнили выход. Теперь вы можете закрыть окно браузера.

Python Flask

1. Создайте виртуальную среду для приложения:

   • Для Windowsвыполните следующие команды:

   py -m venv .venv
   .venv\scripts\activate
   

   • Для macOS/Linuxвыполните следующие команды:

   python3 -m venv .venv
   source .venv/bin/activate
   

2. Установите требования с помощью pip:

   pip install -r requirements.txt
   

3. Запустите приложение из командной строки. Убедитесь, что приложение работает на том же порту, что и URI перенаправления, настроенный ранее.

   flask run --debug --host=localhost --port=5000
   

4. Скопируйте URL-адрес https, отображаемый в терминале, например, https://localhost:5000, и вставьте его в браузер. Рекомендуется использовать частный или инкогнито браузерный сеанс.

5. Выполните действия и введите необходимые сведения для входа с помощью учетной записи Майкрософт. Вам предлагается указать адрес электронной почты и пароль для входа.

6. Приложение запрашивает разрешение на поддержание доступа к данным, к которым вы предоставили доступ, а также разрешение войти в ваш аккаунт и прочитать ваш профиль, как показано на снимке экрана. Выберите Принять.

   

7. Откроется следующий снимок экрана, указывающий, что вы успешно вошли в приложение.

Как работает приложение

На следующей схеме показано, как работает пример приложения:

1. Приложение использует пакет identity для получения токена доступа на платформе идентификаций Microsoft. Этот пакет основан на библиотеке проверки подлинности Майкрософт (MSAL) для Python для упрощения проверки подлинности и авторизации в веб-приложениях.

2. Маркер доступа, получаемый на предыдущем шаге, используется в качестве маркера носителя для проверки подлинности пользователя при вызове API Microsoft Graph.

Связанное содержимое

узел

• Узнайте, как создать веб-приложение Node.js, которое выполняет вход пользователей и вызывает API Microsoft Graph в учебнике . Выполняйте вход пользователей и получайте токен Microsoft Graph в веб-приложении Node.js & Express.

ASP.NET Core

• Узнайте, создавая это веб-приложение ASP.NET в рамках серии обучающих материалов : Урок. Регистрация приложения в платформе идентификации Microsoft.
• Краткое руководство: защита веб-API ASP.NET Core с помощью Платформы удостоверений Microsoft.
• Быстрый старт: Развертывание веб-приложения ASP.NET в Azure App Service

Python Flask

• Узнайте, как создать веб-приложение на Python, которое осуществляет вход пользователей и вызывает защищенный веб-API в руководстве : веб-приложение, которое осуществляет вход пользователей.

В этом быстром начале вы используете пример веб-приложения, чтобы помочь вам зарегистрировать пользователей в вашем внешнем клиенте. Пример приложения использует библиотеку проверки подлинности Майкрософт для обработки проверки подлинности.

Прежде чем начать, воспользуйтесь селектором Выберите тип арендатора в верхней части этой страницы, чтобы выбрать тип арендатора. Идентификатор Microsoft Entra предоставляет две конфигурации арендатора: рабочие и внешние. Конфигурация тенанта рабочей среды предназначена для ваших сотрудников, внутренних приложений и других организационных ресурсов. Внешний клиент предназначен для ваших клиентских приложений.

Необходимые условия

• Учетная запись Azure с активной подпиской. Если у вас еще нет учетной записи, пожалуйста, зарегистрируйтесь бесплатно.
• Эта учетная запись Azure должна иметь разрешения на управление приложениями. Любые из следующих ролей Microsoft Entra включают необходимые разрешения:
  • Администратор приложений
  • Разработчик приложений
• Внешний арендатор. Чтобы создать его, выберите один из следующих методов:
  • Используйте расширение Microsoft Entra External ID, чтобы настроить внешний клиент непосредственно в Visual Studio Code. (рекомендуется)
  • создание нового внешнего клиента в Центре администрирования Microsoft Entra.
• Поток пользователя. Дополнительные сведения см. в создании потоков пользователей самообслуживания для приложений в внешних арендаторах. Этот поток пользователя можно использовать для нескольких приложений.
• Visual Studio Code или другой редактор кода.

узел

• Зарегистрируйте новое приложение в Центре администрирования Microsoft Entra, настроенное только для учетных записей в этом каталоге организации. Дополнительные сведения см. в статье "Регистрация приложения ". Запишите следующие значения на странице обзора приложения для последующего использования:
  • Идентификатор приложения (клиента)
  • Идентификатор каталога (арендатора)
• Добавьте следующие URI перенаправления с помощью конфигурации веб-платформы . Дополнительные сведения см. в статье о добавлении URI перенаправления в приложение .
  • URI перенаправления: http://localhost:3000/auth/redirect
  • URL-адрес выхода фронтального канала: https://localhost:5001/signout-callback-oidc
• Добавьте секрет клиента в регистрацию приложения. Не используйте секреты клиента в рабочих приложениях. Вместо этого используйте сертификаты или федеративные учетные данные. Дополнительные сведения см. в статье о добавлении учетных данных в приложение.
• Добавление приложения в поток пользователя
• Node.js

ASP.NET Core

• Зарегистрируйте новое приложение в Центре администрирования Microsoft Entra, настроенное только для учетных записей в этом каталоге организации. Дополнительные сведения см. в статье "Регистрация приложения ". Запишите следующие значения на странице обзора приложения для последующего использования:
  • Идентификатор приложения (клиента)
  • Идентификатор каталога (арендатора)
• Добавьте следующие URI перенаправления с помощью конфигурации веб-платформы . Дополнительные сведения см. в статье о добавлении URI перенаправления в приложение .
  • URI перенаправления: https://localhost:5001/signin-oidc
  • URL-адрес выхода фронтального канала: https://localhost:5001/signout-callback-oidc
• Добавьте секрет клиента в регистрацию приложения. Не используйте секреты клиента в рабочих приложениях. Вместо этого используйте сертификаты или федеративные учетные данные. Дополнительные сведения см. в статье о добавлении учетных данных в приложение.
• Добавление приложения в поток пользователя
• Минимальная версия пакета SDK для .NET 8.0 .

Python Django

• Зарегистрируйте новое приложение в Центре администрирования Microsoft Entra, настроенное только для учетных записей в этом каталоге организации. Дополнительные сведения см. в статье "Регистрация приложения ". Запишите следующие значения на странице обзора приложения для последующего использования:
  • Идентификатор приложения (клиента)
  • Идентификатор каталога (арендатора)
• Добавьте следующие URI перенаправления с помощью конфигурации веб-платформы . Дополнительные сведения см. в статье о добавлении URI перенаправления в приложение .
  • URI перенаправления: http://localhost:5000/getAToken
• Добавление приложения в поток пользователя
• Python 3 +
• Добавьте секрет клиента в регистрацию приложения. Не используйте секреты клиента в рабочих приложениях. Вместо этого используйте сертификаты или федеративные учетные данные. Дополнительные сведения см. в статье о добавлении учетных данных в приложение.

Python Flask

• Зарегистрируйте новое приложение в Центре администрирования Microsoft Entra, настроенное только для учетных записей в этом каталоге организации. Дополнительные сведения см. в статье "Регистрация приложения ". Запишите следующие значения на странице обзора приложения для последующего использования:
  • Идентификатор приложения (клиента)
  • Идентификатор каталога (арендатора)
• Добавьте следующие URI перенаправления с помощью конфигурации веб-платформы . Дополнительные сведения см. в статье о добавлении URI перенаправления в приложение .
  • URI перенаправления: http://localhost:5000/getAToken
• Добавление приложения в поток пользователя
• Python 3 +
• Добавьте секрет клиента в регистрацию приложения. Не используйте секреты клиента в рабочих приложениях. Вместо этого используйте сертификаты или федеративные учетные данные. Дополнительные сведения см. в статье о добавлении учетных данных в приложение.

Клонирование или скачивание примера веб-приложения

узел

Чтобы получить пример приложения, можно клонировать его из GitHub или скачать его в виде файла .zip:

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

  git clone https://github.com/Azure-Samples/ms-identity-ciam-javascript-tutorial.git
  

• Или скачать образец файла .zipи затем извлечь его в путь к файлу, где длина имени меньше 260 символов.

Установка зависимостей проекта

1. Откройте окно консоли и перейдите в каталог, содержащий пример приложения Node.js:

   cd 1-Authentication\5-sign-in-express\App
   

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

   npm install
   

ASP.NET Core

Чтобы получить пример приложения, можно клонировать его из GitHub или скачать его в виде файла .zip.

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

  git clone https://github.com/Azure-Samples/ms-identity-ciam-dotnet-tutorial.git
  

• Скачайтефайл .zip. Извлеките его в каталог, где длина названия файла меньше 260 символов.

Python Django

Чтобы получить пример приложения, можно клонировать его из GitHub или скачать его в виде файла .zip.

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

  git clone https://github.com/Azure-Samples/ms-identity-docs-code-python.git
  

• Скачайтефайл .zip. Извлеките его в каталог, где длина названия файла меньше 260 символов.

Установка зависимостей проекта

1. Откройте окно консоли и перейдите в каталог, содержащий пример веб-приложения Flask:

   cd django-web-app
   

2. Настройка виртуальной среды:

   • Для Windowsвыполните следующие команды:

   py -m venv .venv
   .venv\scripts\activate
   

   • Для macOS/Linuxвыполните следующие команды:

   python3 -m venv .venv
   source .venv/bin/activate
   

3. Чтобы установить зависимости приложений, выполните следующие команды:

   python3 -m pip install -r requirements.txt
   

Python Flask

Чтобы получить пример приложения, можно клонировать его из GitHub или скачать его в виде файла .zip.

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

  git clone https://github.com/Azure-Samples/ms-identity-docs-code-python.git
  

• Скачайтефайл .zip. Извлеките его в каталог, где длина названия файла меньше 260 символов.

Установка зависимостей проекта

1. Откройте окно консоли и перейдите в каталог, содержащий пример веб-приложения Flask:

   cd flask-web-app
   

2. Настройка виртуальной среды:

   • Для Windowsвыполните следующие команды:

   py -m venv .venv
   .venv\scripts\activate
   

   • Для macOS/Linuxвыполните следующие команды:

   python3 -m venv .venv
   source .venv/bin/activate
   

3. Чтобы установить зависимости приложений, выполните следующие команды:

   python3 -m pip install -r requirements.txt
   

Настройка примера веб-приложения

Для входа пользователей в демонстрационном приложении, необходимо обновить его, добавив сведения о вашем приложении и арендаторе.

узел

1. В редакторе кода откройте файл приложения\authConfig.js.

2. Найдите плейсхолдер:

   • Enter_the_Application_Id_Here и замените его идентификатором приложения (клиента), зарегистрированного ранее.
   • Enter_the_Tenant_Subdomain_Here и замените его на поддомен каталога (домен клиента). Например, если основной домен клиента contoso.onmicrosoft.com, используйте contoso. Если у вас нет имени арендатора, узнайте, как можно узнать сведения об арендаторе.
   • Enter_the_Client_Secret_Here и замените его значением секрета приложения, скопированным ранее.

ASP.NET Core

1. Перейдите в корневой каталог, содержащий пример приложения ASP.NET Core:

   cd 1-Authentication\1-sign-in-aspnet-core-mvc
   

2. Откройте файл appsettings.json.

3. В Управлениенайдите Enter_the_Tenant_Subdomain_Here и замените его поддоменом вашего арендатора. Например, если основной домен клиента caseyjensen@onmicrosoft.com, то введите значение casyjensen.

4. Найдите значение Enter_the_Application_Id_Here и замените его идентификатором приложения (clientId) приложения, зарегистрированного в Центре администрирования Microsoft Entra.

5. Замените Enter_the_Client_Secret_Here настроенным значением секрета клиента.

Python Django

1. Откройте файлы проекта в Visual Studio Code или редакторе, который вы используете.

2. Создайте файл .env в корневой папке проекта, используя файл .env.sample.external-id в качестве руководства.

3. В файле .env укажите следующие переменные среды:

   1. CLIENT_ID, который является идентификатором клиента приложения, зарегистрированного ранее.
   2. CLIENT_SECRET, которое является значением секрета приложения, которое вы скопировали ранее.
   3. AUTHORITY, который является URL-адресом, определяющим центр авторизации токена. Он должен иметь формат https://{поддомен}.ciamlogin.com/{поддомен}.onmicrosoft.com. Замените поддомен на поддомен каталога (арендатора). Например, если основной домен клиента contoso.onmicrosoft.com, используйте contoso. Если у вас нет поддомена арендатора, узнайте, как просматривать сведения о вашем арендаторе.
   4. REDIRECT_URI, URI перенаправления, аналогичный зарегистрированному ранее, должен соответствовать вашей конфигурации.

Python Flask

1. Откройте файлы проекта в Visual Studio Code или редакторе, который вы используете.

2. Создайте файл .env в корневой папке проекта, используя файл .env.sample.external-id в качестве руководства.

3. В файле .env укажите следующие переменные среды:

   • CLIENT_ID, который является идентификатором клиента приложения, зарегистрированного ранее.
   • CLIENT_SECRET, которое является значением секрета приложения, которое вы скопировали ранее.
   • AUTHORITY, который является URL-адресом, определяющим центр авторизации токена. Он должен иметь формат https://{поддомен}.ciamlogin.com/{поддомен}.onmicrosoft.com. Замените поддомен на поддомен каталога (арендатора). Например, если основной домен клиента contoso.onmicrosoft.com, используйте contoso. Если у вас нет поддомена арендатора, узнайте, как просматривать сведения о вашем арендаторе.

4. Убедитесь, что URI перенаправления правильно настроен. URI перенаправления, зарегистрированный ранее, должен соответствовать конфигурации. По умолчанию в этом примере путь перенаправления URI установлен на /getAToken. Эта конфигурация находится в файле app_config.py в виде REDIRECT_PATH.

Запуск и тестирование примера веб-приложения

узел

Теперь можно протестировать пример веб-приложения Node.js. Необходимо запустить сервер Node.js и получить доступ к нему через браузер в http://localhost:3000.

1. В терминале выполните следующую команду:

   npm start 
   

2. Откройте браузер, а затем перейдите к http://localhost:3000. Вы увидите страницу, аналогичную следующему снимку экрана:

   

3. После завершения загрузки страницы выберите Войти при появлении запроса.

4. На странице входа в систему введите адрес электронной почты, выберите Далее, введите пароль, а затем выберите Войти. Если у вас нет учетной записи, выберите Нет учетной записи? Создайте одну ссылку, которая запускает поток регистрации.

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

   

6. Выберите Выйти, чтобы выйти пользователя из веб-приложения, или выберите Просмотреть утверждения токена идентификатора, чтобы увидеть утверждения, возвращаемые Microsoft Entra.

Принцип работы

Когда пользователи выбирают ссылку Войти, приложение инициирует запрос проверки подлинности и перенаправляет пользователей на Microsoft Entra External ID. На появившейся странице входа или регистрации после успешного входа пользователя или создания учетной записи Microsoft Entra External ID возвращает маркер идентификатора приложению. Приложение проверяет маркер идентификатора, считывает утверждения и возвращает безопасную страницу пользователям.

Когда пользователи выбирают ссылку "Выйти из аккаунта", приложение очищает сеанс, а затем перенаправляет пользователя на конечную точку выхода Microsoft Entra External ID, чтобы уведомить, что пользователь вышел из системы.

Если вы хотите создать приложение, аналогичное примеру, выполните шаги, описанные в статье Авторизация пользователей в вашем веб-приложении Node.js.

ASP.NET Core

1. В оболочке или командной строке выполните следующие команды:

   dotnet run
   

2. Откройте веб-браузер и перейдите к https://localhost:7274.

3. Войдите с учетной записью, зарегистрированной у внешнего арендатора.

4. После входа отображаемое имя показывается рядом с кнопкой Выход, как показано на следующем снимке экрана.

   

5. Чтобы выйти из приложения, нажмите кнопку Выйти.

Python Django

Запустите приложение, чтобы просмотреть интерфейс входа во время игры.

1. В терминале выполните следующую команду:

   python manage.py runserver localhost:5000                                             
   

   Вы можете использовать нужный номер порта.

2. Откройте браузер, а затем перейдите к http://localhost:5000. Вы увидите страницу, аналогичную следующему снимку экрана:

   

3. После завершения загрузки страницы выберите ссылку Войти. Вам будет предложено войти.

4. На странице входа в систему введите адрес электронной почты, выберите Далее, введите пароль, а затем выберите Войти. Если у вас нет учетной записи, выберите Нет учетной записи? Создайте одну ссылку, которая запускает поток регистрации.

5. Если выбрать вариант регистрации, вы пройдете процесс регистрации. Заполните электронную почту, одноразовый секретный код, новый пароль и дополнительные сведения об учетной записи, чтобы завершить весь поток регистрации.

6. После входа или регистрации вы перенаправляетесь обратно в веб-приложение. Вы увидите страницу, похожую на следующий снимок экрана:

   

7. Выберите выход, чтобы выйти из учетной записи пользователя в веб-приложении, или выберите Обратиться к нижестоящему API, чтобы выполнить вызов конечной точки Microsoft Graph.

Принцип работы

Когда пользователи выбирают ссылку Войти, приложение инициирует запрос проверки подлинности и перенаправляет пользователей на Microsoft Entra External ID. Затем пользователь войдёт или зарегистрируется на появившейся странице. После предоставления необходимых учетных данных и согласия на необходимые области внешний идентификатор Microsoft Entra перенаправляет пользователя обратно в веб-приложение с кодом авторизации. Затем веб-приложение использует этот код авторизации для получения токена из Microsoft Entra External ID.

Когда пользователи выбирают ссылку Выход, приложение очищает свой сеанс и перенаправляет пользователя на конечную точку выхода Microsoft Entra External ID, чтобы уведомить об этом систему. Затем пользователь перенаправляется обратно в веб-приложение.

Python Flask

Запустите приложение, чтобы просмотреть интерфейс входа во время игры.

1. В терминале выполните следующую команду:

   python3 -m flask run --debug --host=localhost --port=3000
   

   Вы можете использовать нужный порт. Это должно быть похоже на порт URI перенаправления, зарегистрированного ранее.

2. Откройте браузер, а затем перейдите к http://localhost:3000. Вы увидите страницу, аналогичную следующему снимку экрана:

   

3. После завершения загрузки страницы выберите ссылку Войти. Вам будет предложено войти.

4. На странице входа в систему введите адрес электронной почты, выберите Далее, введите пароль, а затем выберите Войти. Если у вас нет учетной записи, выберите Нет учетной записи? Создайте одну ссылку, которая запускает поток регистрации.

5. Если выбрать вариант регистрации, вы пройдете процесс регистрации. Заполните электронную почту, одноразовый секретный код, новый пароль и дополнительные сведения об учетной записи, чтобы завершить весь поток регистрации.

6. После входа или регистрации вы перенаправляетесь обратно в веб-приложение. Вы увидите страницу, похожую на следующий снимок экрана:

   

7. Выберите выход, чтобы выйти из учетной записи пользователя в веб-приложении, или выберите Обратиться к нижестоящему API, чтобы выполнить вызов конечной точки Microsoft Graph.

Принцип работы

Когда пользователи выбирают ссылку Войти, приложение инициирует запрос проверки подлинности и перенаправляет пользователей на Microsoft Entra External ID. Затем пользователь войдёт или зарегистрируется на появившейся странице. После предоставления необходимых учетных данных и согласия на необходимые области внешний идентификатор Microsoft Entra перенаправляет пользователя обратно в веб-приложение с кодом авторизации. Затем веб-приложение использует этот код авторизации для получения токена из Microsoft Entra External ID.

Когда пользователи выбирают ссылку Выход, приложение очищает свой сеанс и перенаправляет пользователя на конечную точку выхода Microsoft Entra External ID, чтобы уведомить об этом систему. Затем пользователь перенаправляется обратно в веб-приложение.

Связанное содержимое

узел

• Авторизация пользователей в вашем веб-приложении Node.js
• Быстрый старт по - вход пользователей и вызов веб-API в примере веб-приложения Node.js
• Быстрый старт - Изменение профиля в образце веб-приложения Node.js

ASP.NET Core

• Используйте нашу серию учебников с несколькими частями, чтобы создать это веб-приложение ASP.NET с нуля
• Включить сброс пароля
• Настройка фирменной символики по умолчанию

Python Django

• Выполнение входа пользователей с помощью примера веб-приложения Flask
• Включить сброс пароля
• Настройка фирменной символики по умолчанию

Python Flask

• Включить сброс пароля
• Настройка фирменной символики по умолчанию