ContentDefinitions

Примечание

В Azure Active Directory B2C пользовательские политики преимущественно предназначены для выполнения сложных сценариев. В большинстве случаев рекомендуется использовать встроенные пользовательские потоки. Ознакомьтесь со статьей Начало работы с настраиваемыми политиками в Azure Active Directory B2C, чтобы узнать о базовом пакете настраиваемых политик, если еще не сделали этого.

Вы можете настроить внешний вид любого самоподтвержденного технического профиля. Служба Azure Active Directory B2C выполняет код в браузере пользователя и использует современный подход — общий доступ к ресурсам независимо от источника (CORS).

Для настройки пользовательского интерфейса необходимо указать URL-адрес в элементе ContentDefinition с настраиваемым содержимым HTML. В самоподтвержденном техническом профиле или OrchestrationStep нужно указать этот идентификатор определения содержимого. Определение содержимого может содержать элемент LocalizedResourcesReferences, задающий список локализованных ресурсов для загрузки. Azure AD B2C объединяет элементы пользовательского интерфейса с содержимым HTML, загруженным по указанному URL-адресу, и отображает страницу для пользователя.

Элемент ContentDefinitions содержит URL-адреса шаблонов HTML5, которые могут использоваться в пути взаимодействия пользователя. URI страницы HTML5 используется для указанного шага пользовательского интерфейса, например для входа или регистрации, сброса пароля или страниц ошибок. Внешний вид можно изменить с помощью переопределения LoadUri для файла HTML5. Можно создать новые определения содержимого в соответствии с потребностями. Этот элемент может содержать ссылку на локализованные ресурсы — идентификатор локализации, заданный в элементе Localization.

В следующем примере показаны идентификатор определения содержимого и определение локализованных ресурсов:

<ContentDefinition Id="api.localaccountsignup">
  <LoadUri>~/tenant/default/selfAsserted.cshtml</LoadUri>
  <RecoveryUri>~/common/default_page_error.html</RecoveryUri>
  <DataUri>urn:com:microsoft:aad:b2c:elements:selfasserted:1.1.0</DataUri>
  <Metadata>
    <Item Key="DisplayName">Local account sign up page</Item>
  </Metadata>
  <LocalizedResourcesReferences MergeBehavior="Prepend">
    <LocalizedResourcesReference Language="en" LocalizedResourcesReferenceId="api.localaccountsignup.en" />
    <LocalizedResourcesReference Language="es" LocalizedResourcesReferenceId="api.localaccountsignup.es" />
    ...

Метаданные самоподтвержденного технического профиля LocalAccountSignUpWithLogonEmail содержат идентификатор определения содержимого ContentDefinitionReferenceId, для которого задано значение api.localaccountsignup

<TechnicalProfile Id="LocalAccountSignUpWithLogonEmail">
  <DisplayName>Email signup</DisplayName>
  <Protocol Name="Proprietary" Handler="Web.TPEngine.Providers.SelfAssertedAttributeProvider, Web.TPEngine, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />
  <Metadata>
    <Item Key="ContentDefinitionReferenceId">api.localaccountsignup</Item>
    ...
  </Metadata>
  ...

ContentDefinition

Элемент ContentDefinition содержит следующий атрибут:

attribute	Обязательно	Описание
Идентификатор	Да	Идентификатор определения содержимого. Значение указано в разделе Идентификаторы определения содержимого далее на этой странице.

Элемент ContentDefinition содержит следующие элементы:

Элемент	Вхождения	Описание
LoadUri	1:1	Строка, содержащая URL-адрес страницы HTML5 для определения содержимого.
RecoveryUri	1:1	Строка, содержащая URL-адрес страницы HTML для отображения ошибки, связанной с определением содержимого. В настоящее время не используется, значение должно быть ~/common/default_page_error.html.
DataUri	1:1	Строка, содержащая относительный URL-адрес HTML-файла, который предоставляет пользовательский интерфейс для вызова соответствующего шага.
Метаданные	0:1	Коллекция пар "ключ — значение", содержащая метаданные, используемые в определении содержимого.
LocalizedResourcesReferences	0:1	Коллекция ссылок на локализованные ресурсы. Этот элемент позволяет настроить локализацию пользовательского интерфейса и атрибута утверждений (claims).

LoadUri

Элемент LoadUri используется для указания URL-адреса страницы HTML5 для определения содержимого. Начальные пакеты пользовательской политики Azure AD B2C поставляются с определениями содержимого, которые используют HTML-страницы Azure AD B2C. LoadUri начинается с ~, который представляет собой относительный путь к клиенту Azure AD B2C.

<ContentDefinition Id="api.signuporsignin">
  <LoadUri>~/tenant/templates/AzureBlue/unified.cshtml</LoadUri>
  ...
</ContentDefinition>

Можно настроить пользовательский интерфейс с помощью HTML-шаблонов. При использовании HTML-шаблонов укажите абсолютный URL-адрес. В следующем примере показано определение содержимого с помощью HTML-шаблона:

<ContentDefinition Id="api.signuporsignin">
  <LoadUri>https://your-storage-account.blob.core.windows.net/your-container/customize-ui.html</LoadUri>
  ...
</ContentDefinition>

DataUri

Элемент DataUri используется для указания идентификатора страницы. В Azure AD B2C идентификатор страницы используется для загрузки и запуска элементов пользовательского интерфейса и JavaScript на стороне клиента. Формат значения — urn:com:microsoft:aad:b2c:elements:page-name:version. В следующей таблице перечислены идентификаторы страниц, которые можно использовать.

Идентификатор страницы	Описание
globalexception	Отображает страницу ошибки при обнаружении исключения или ошибки.
providerselection, idpselection	Отображает список поставщиков удостоверений, которые пользователи могут выбирать во время входа.
unifiedssp	Отображает форму для входа в локальную учетную запись (на основе адреса электронной почты или имени пользователя). Это значение также предоставляет функцию "Оставаться в системе" и ссылку "Забыли пароль?".
unifiedssd	Отображает форму для входа в локальную учетную запись на основе адреса электронной почты или имени пользователя. Этот идентификатор страницы устарел. Используйте вместо него идентификатор страницы unifiedssp.
multifactor	Проверяет номера телефонов с помощью SMS-сообщения или голосового вызова во время регистрации или входа.
selfasserted	Отображает форму для сбора данных от пользователя. Например, позволяет пользователям создать или обновить свой профиль.

Выбор разметки страницы

Код JavaScript на стороне клиента можно включить путем вставки contract между elements и типом страницы. Например, urn:com:microsoft:aad:b2c:elements:contract:page-name:version.

Часть version в DataUri определяет пакет содержимого, содержащего HTML, CSS и JavaScript для элементов пользовательского интерфейса в политике. Если вы планируете включить код JavaScript на стороне клиента, элементы, которые основаны на вашем коде JavaScript, должны быть неизменяемыми. Если они не будут неизменяемыми, любые изменения могут вызвать непредвиденное поведение на страницах пользователя. Чтобы избежать этих проблем, принудительно примените разметки страницы и укажите версию разметки страницы. Это гарантирует, что все определения содержимого, на которых основан JavaScript, останутся неизменяемыми. Даже если вы не планируете включать JavaScript, все равно необходимо указать версию разметки для страниц.

В следующем примере показан DataUriselfasserted версии 1.2.0:

<!-- 
<BuildingBlocks> 
  <ContentDefinitions>-->
    <ContentDefinition Id="api.localaccountpasswordreset">
      <LoadUri>~/tenant/templates/AzureBlue/selfAsserted.cshtml</LoadUri>
      <RecoveryUri>~/common/default_page_error.html</RecoveryUri>
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:selfasserted:1.2.0</DataUri>
      <Metadata>
        <Item Key="DisplayName">Local account change password page</Item>
      </Metadata>
    </ContentDefinition>
  <!-- 
  </ContentDefinitions> 
</BuildingBlocks> -->

Переход на разметку страницы

Чтобы выполнить миграцию со старого значения DataUri (без контракта страниц) на версию с разметкой страниц, добавьте слово contract после версии страницы. Используйте следующую таблицу для перехода со старого значения DataUri на версию с разметкой страниц.

Старое значение DataUri	Новое значение DataUri
urn:com:microsoft:aad:b2c:elements:globalexception:1.0.0	urn:com:microsoft:aad:b2c:elements:contract:globalexception:1.2.1
urn:com:microsoft:aad:b2c:elements:globalexception:1.1.0	urn:com:microsoft:aad:b2c:elements:contract:globalexception:1.2.1
urn:com:microsoft:aad:b2c:elements:idpselection:1.0.0	urn:com:microsoft:aad:b2c:elements:contract:providerselection:1.2.1
urn:com:microsoft:aad:b2c:elements:selfasserted:1.0.0	urn:com:microsoft:aad:b2c:elements:contract:selfasserted:2.1.7
urn:com:microsoft:aad:b2c:elements:selfasserted:1.1.0	urn:com:microsoft:aad:b2c:elements:contract:selfasserted:2.1.7
urn:com:microsoft:aad:b2c:elements:unifiedssd:1.0.0	urn:com:microsoft:aad:b2c:elements:contract:unifiedssd:1.2.1
urn:com:microsoft:aad:b2c:elements:unifiedssp:1.0.0	urn:com:microsoft:aad:b2c:elements:contract:unifiedssp:2.1.5
urn:com:microsoft:aad:b2c:elements:unifiedssp:1.1.0	urn:com:microsoft:aad:b2c:elements:contract:unifiedssp:2.1.5
urn:com:microsoft:aad:b2c:elements:multifactor:1.0.0	urn:com:microsoft:aad:b2c:elements:contract:multifactor:1.2.5
urn:com:microsoft:aad:b2c:elements:multifactor:1.1.0	urn:com:microsoft:aad:b2c:elements:contract:multifactor:1.2.5

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

<!-- 
<BuildingBlocks> -->
  <ContentDefinitions>
    <ContentDefinition Id="api.error">
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:globalexception:1.2.1</DataUri>
    </ContentDefinition>
    <ContentDefinition Id="api.idpselections">
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:providerselection:1.2.1</DataUri>
    </ContentDefinition>
    <ContentDefinition Id="api.idpselections.signup">
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:providerselection:1.2.1</DataUri>
    </ContentDefinition>
    <ContentDefinition Id="api.signuporsignin">
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:unifiedssp:2.1.7</DataUri>
    </ContentDefinition>
    <ContentDefinition Id="api.selfasserted">
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:selfasserted:2.1.14</DataUri>
    </ContentDefinition>
    <ContentDefinition Id="api.selfasserted.profileupdate">
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:selfasserted:2.1.14</DataUri>
    </ContentDefinition>
    <ContentDefinition Id="api.localaccountsignup">
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:selfasserted:2.1.14</DataUri>
    </ContentDefinition>
    <ContentDefinition Id="api.localaccountpasswordreset">
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:selfasserted:2.1.14</DataUri>
    </ContentDefinition>
    <ContentDefinition Id="api.phonefactor">
      <RecoveryUri>~/common/default_page_error.html</RecoveryUri>
      <DataUri>urn:com:microsoft:aad:b2c:elements:contract:multifactor:1.2.5</DataUri>
    </ContentDefinition>
  </ContentDefinitions>
<!-- 
</BuildingBlocks> -->

Метаданные

Элемент Metadata содержит следующие элементы.

Элемент	Вхождения	Описание
Item	0:n	Метаданные, относящиеся к определению содержимого.

Элемент Item из элемента Metadata содержит следующие атрибуты:

attribute	Обязательно	Описание
Клавиши	Да	Ключ метаданных.

Ключи метаданных

Определение содержимого поддерживает следующие элементы метаданных:

Ключ	Обязательно	Описание
DisplayName	нет	Строка, содержащая имя определения содержимого.

LocalizedResourcesReferences

Элемент LocalizedResourcesReferences содержит следующие элементы:

Элемент	Вхождения	Описание
LocalizedResourcesReference	1:n	Список ссылок на локализованные ресурсы для определения содержимого.

Элемент LocalizedResourcesReference содержит следующие атрибуты:

attribute	Обязательно	Описание
Язык	Да	Строка, содержащая поддерживаемый язык для политики согласно стандарту RFC 5646 "Tags for Identifying Languages" (Теги для идентификации языков).
LocalizedResourcesReferenceId	Да	Идентификатор элемента LocalizedResources.

Следующий пример показывает определение содержимого регистрации или входа в систему со ссылкой на локализацию для английского, французского и испанского языков:

<ContentDefinition Id="api.signuporsignin">
  <LoadUri>~/tenant/default/unified.cshtml</LoadUri>
  <RecoveryUri>~/common/default_page_error.html</RecoveryUri>
  <DataUri>urn:com:microsoft:aad:b2c:elements:unifiedssp:1.0.0</DataUri>
  <Metadata>
    <Item Key="DisplayName">Signin and Signup</Item>
  </Metadata>
  <LocalizedResourcesReferences MergeBehavior="Prepend">
    <LocalizedResourcesReference Language="en" LocalizedResourcesReferenceId="api.signuporsignin.en" />
    <LocalizedResourcesReference Language="fr" LocalizedResourcesReferenceId="api.signuporsignin.rf" />
    <LocalizedResourcesReference Language="es" LocalizedResourcesReferenceId="api.signuporsignin.es" />
</LocalizedResourcesReferences>
</ContentDefinition>

Сведения о том, как добавить поддержку локализации в определения содержимого, см. в описании элемента Localization.

Идентификаторы определения содержимого

Атрибут ID (идентификатор) элемента ContentDefinition указывает тип страницы, относящейся к определению содержимого. Этот элемент определяет контекст, который будет применяться в пользовательском шаблоне HTML5 или CSS. В следующей таблице описан набор идентификаторов определений содержимого, распознаваемых Identity Experience Framework, и типы страниц, относящиеся к ним. Вы можете создать собственные определения содержимого с произвольным идентификатором.

ID	Шаблон по умолчанию	Описание
api.error	exception.cshtml	Страница ошибки — отображает страницу ошибки при обнаружении исключения или ошибки.
api.idpselections	idpSelector.cshtml	Страница выбора поставщика удостоверений — на этой странице содержится список поставщиков удостоверений, которые пользователи могут выбирать во время входа. Обычно это поставщики удостоверений организаций, социальных сетей, включая Facebook и Google+, или локальных учетных записей.
api.idpselections.signup	idpSelector.cshtml	Выбор поставщика удостоверений для регистрации — на этой странице содержится список поставщиков удостоверений, которые пользователи могут выбирать во время регистрации. Обычно это поставщики удостоверений организаций, социальных сетей, включая Facebook и Google+, или локальных учетных записей.
api.localaccountpasswordreset	selfasserted.cshtml	Страница "Забыли пароль?" — отображает форму, которую пользователи должны заполнить для сброса пароля.
api.localaccountsignin	selfasserted.cshtml	Страница входа в локальную учетную запись — отображает форму для входа в локальную учетную запись (на основе адреса электронной почты или имени пользователя). Форма может содержать текстовое поле ввода и окно ввода пароля.
api.localaccountsignup	selfasserted.cshtml	Страница регистрации локальной учетной записи — отображает форму для регистрации локальной учетной записи на основе адреса электронной почты или имени пользователя. Форма может содержать разные элементы управления для ввода текста, например: текстовое поле, поле ввода пароля, переключатель, раскрывающийся список с единственным выбором или флажки множественного выбора.
api.phonefactor	multifactor-1.0.0.cshtml	Страница многофакторной проверки подлинности — проверяет номера телефонов с помощью SMS-сообщения или голосового вызова во время регистрации или входа.
api.selfasserted	selfasserted.cshtml	Страница регистрации учетной записи социальной сети — отображает форму, которую нужно заполнить при регистрации с использованием существующей учетной записи от поставщика удостоверений в социальных сетях. Эта страница аналогична странице регистрации локальных учетных записей, за исключением полей для ввода пароля.
api.selfasserted.profileupdate	updateprofile.cshtml	Страница обновления профиля — отображает форму для обновления профиля пользователя. Эта страница аналогична странице регистрации локальных учетных записей, за исключением полей для ввода пароля.
api.signuporsignin	unified.cshtml	Унифицированная страница регистрации и входа — обрабатывает процесс регистрации и входа пользователей. Пользователи могут использовать поставщики удостоверений организаций, социальных сетей, включая Facebook и Google+, или локальные учетные записи.

Дальнейшие действия

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

Настройка пользовательского интерфейса приложения с помощью настраиваемой политики