Udostępnij za pośrednictwem


Definicje treści

Ważne

Od 1 maja 2025 r. usługa Azure AD B2C nie będzie już dostępna do zakupu dla nowych klientów. Dowiedz się więcej w naszych często zadawanych pytaniach.

Uwaga / Notatka

W usłudze Azure Active Directory B2C niestandardowe zasady są przeznaczone głównie do rozwiązywania złożonych scenariuszy. W przypadku większości scenariuszy zalecamy używanie wbudowanych przepływów użytkownika. Jeśli nie zostało to zrobione, dowiedz się więcej o niestandardowym pakiecie startowym zasad w temacie Wprowadzenie do zasad niestandardowych w usłudze Active Directory B2C.

Możesz dostosować wygląd i działanie dowolnego własnego profilu technicznego. Usługa Azure Active Directory B2C (Azure AD B2C) uruchamia kod w przeglądarce klienta i korzysta z nowoczesnego podejścia o nazwie Współużytkowanie zasobów między źródłami (CORS).

Aby dostosować interfejs użytkownika, należy określić adres URL w elemecie ContentDefinition z dostosowaną zawartością HTML. W samozwańczym profilu technicznym lub orchestrationStep wskazujesz ten identyfikator definicji zawartości. Definicja zawartości może zawierać element LocalizedResourcesReferences , który określa listę zlokalizowanych zasobów do załadowania. Azure AD B2C scala elementy interfejsu użytkownika z zawartością HTML, która jest ładowana z adresu URL, a następnie wyświetla stronę użytkownikowi.

Element ContentDefinitions zawiera adresy URL do szablonów HTML5, których można używać w podróży użytkownika. Identyfikator URI strony HTML5 jest używany do określonego kroku interfejsu użytkownika. Na przykład strony logowania lub rejestracji, resetowania hasła lub błędów. Wygląd i działanie można zmodyfikować, przesłaniając identyfikator LoadUri dla pliku HTML5. Możesz utworzyć nowe definicje zawartości zgodnie z potrzebami. Ten element może zawierać odwołanie do zlokalizowanych zasobów do identyfikatora lokalizacji określonego w elemencie Lokalizacja .

W poniższym przykładzie przedstawiono identyfikator definicji zawartości i definicję zlokalizowanych zasobów:

<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" />
    ...

Metadane lokalnego profilu technicznego LocalAccountSignUpWithLogonEmail zawiera identyfikator definicji zawartości ContentDefinitionReferenceId ustawiony na wartość 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>
  ...

Definicja zawartości

Element ContentDefinition zawiera następujący atrybut:

Atrybut Wymagane Opis
Id Tak Identyfikator definicji zawartości. Wartość jest określona w sekcji Identyfikatory definicji zawartości w dalszej części tej strony.

Element ContentDefinition zawiera następujące elementy:

Składnik Wystąpień Opis
Identyfikator LoadUri 1:1 Ciąg zawierający adres URL strony HTML5 dla definicji zawartości.
Identyfikator RecoveryUri 1:1 Ciąg zawierający adres URL strony HTML do wyświetlania błędu związanego z definicją zawartości. Obecnie nie jest używana, wartość musi mieć wartość ~/common/default_page_error.html.
Identyfikator DataUri 1:1 Ciąg zawierający względny adres URL pliku HTML, który zapewnia środowisko użytkownika do wywołania dla kroku.
Metadane 0:1 Kolekcja par klucz/wartość zawierająca metadane używane przez definicję zawartości.
LocalizedResourcesReferences 0:1 Kolekcja zlokalizowanych odwołań do zasobów. Użyj tego elementu, aby dostosować lokalizację interfejsu użytkownika i atrybutu oświadczenia.

Identyfikator LoadUri

Element LoadUri służy do określania adresu URL strony HTML5 dla definicji zawartości. Pakiety początkowe zasad niestandardowych usługi Azure AD B2C zawierają definicje zawartości korzystające ze stron HTML usługi Azure AD B2C. Identyfikator LoadUri rozpoczyna się od ~, która jest ścieżką względną do dzierżawy usługi Azure AD B2C.

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

Interfejs użytkownika można dostosować przy użyciu szablonów HTML. W przypadku korzystania z szablonów HTML podaj bezwzględny adres URL. Poniższy przykład ilustruje definicję zawartości z szablonem HTML:

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

Identyfikator DataUri

Element DataUri służy do określania identyfikatora strony. Usługa Azure AD B2C używa identyfikatora strony do ładowania i inicjowania elementów interfejsu użytkownika oraz języka JavaScript po stronie klienta. Format wartości to urn:com:microsoft:aad:b2c:elements:page-name:version. W poniższej tabeli wymieniono identyfikatory stron, których można użyć.

Identyfikator strony Opis
globalexception Wyświetla stronę błędu, gdy wystąpi wyjątek lub błąd.
providerselection, idpselection Wyświetla listę dostawców tożsamości, których użytkownicy mogą wybierać podczas logowania.
unifiedssp Wyświetla formularz logowania przy użyciu konta lokalnego opartego na adresie e-mail lub nazwie użytkownika. Ta wartość zawiera również link "Keep me sign-in" (Nie pamiętam hasła).
unifiedssd Wyświetla formularz logowania przy użyciu konta lokalnego opartego na adresie e-mail lub nazwie użytkownika. Ten identyfikator strony jest przestarzały. Zamiast tego użyj identyfikatora unifiedssp strony.
multifactor Weryfikuje numery telefonów przy użyciu tekstu lub głosu podczas rejestracji lub logowania.
selfasserted Wyświetla formularz do zbierania danych od użytkownika. Umożliwia na przykład użytkownikom tworzenie lub aktualizowanie profilu.

Wybieranie układu strony

Kod po stronie klienta języka JavaScript można włączyć, wstawiając contract między elements typem strony i typem strony. Na przykład urn:com:microsoft:aad:b2c:elements:contract:page-name:version.

Część wersjiDataUri określa pakiet zawartości zawierającej kod HTML, CSS i JavaScript dla elementów interfejsu użytkownika w zasadach. Jeśli zamierzasz włączyć kod po stronie klienta języka JavaScript, elementy, które są bazą dla Twojego JavaScript, muszą być niezmienne. Jeśli nie są one niezmienne, wszelkie zmiany mogą spowodować nieoczekiwane zachowanie na stronach użytkowników. Aby zapobiec tym problemom, wymuś użycie układu strony i określ wersję układu strony. Dzięki temu wszystkie definicje zawartości oparte na języku JavaScript są niezmienne. Nawet jeśli nie zamierzasz włączyć języka JavaScript, nadal musisz określić wersję układu strony dla stron.

W poniższym przykładzie przedstawiono identyfikator DataUri wersji selfasserted1.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> -->

Migrowanie do układu strony

Aby przeprowadzić migrację ze starej wartości Identyfikatora DataUri (bez kontraktu strony) do wersji układu strony, dodaj wyraz contract , a następnie wersję strony. Użyj poniższej tabeli, aby przeprowadzić migrację ze starej wartości identyfikatora DataUri do wersji układu strony.

Stara wartość identyfikatora DataUri Nowa wartość identyfikatora 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

W poniższym przykładzie przedstawiono identyfikatory definicji zawartości i odpowiadający mu identyfikator DataUri z najnowszą wersją strony:

<!-- 
<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> -->

Metadane

Element Metadata zawiera następujące elementy:

Składnik Wystąpień Opis
Przedmiot 0:n Metadane powiązane z definicją zawartości.

Element Item elementu Metadata zawiera następujące atrybuty:

Atrybut Wymagane Opis
Klawisz Tak Klucz metadanych.

Klucze metadanych

Definicja zawartości obsługuje następujące elementy metadanych:

Klawisz Wymagane Opis
Nazwa wyświetlana Nie. Ciąg zawierający nazwę definicji zawartości.

LocalizedResourcesReferences

Element LocalizedResourcesReferences zawiera następujące elementy:

Składnik Wystąpień Opis
LocalizedResourcesReference (Odniesienie do zasobów) 1:n Lista zlokalizowanych odwołań do zasobów dla definicji zawartości.

Element LocalizedResourcesReference zawiera następujące atrybuty:

Atrybut Wymagane Opis
Język Tak Ciąg zawierający obsługiwany język dla zasad na RFC 5646 — tagi identyfikujące języki.
LocalizedResourcesReferenceId Tak Identyfikator elementu LocalizedResources .

W poniższym przykładzie przedstawiono definicję zawartości rejestracji lub logowania z odwołaniem do lokalizacji dla języka angielskiego, francuskiego i hiszpańskiego:

<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>

Aby dowiedzieć się, jak dodać obsługę lokalizacji do definicji zawartości, zobacz Lokalizacja.

Identyfikatory definicji zawartości

Atrybut ID elementu ContentDefinition określa typ strony powiązanej z definicją zawartości. Element definiuje kontekst, który ma być stosowany przez niestandardowy szablon HTML5/CSS. W poniższej tabeli opisano zestaw identyfikatorów definicji zawartości rozpoznawanych przez platformę Identity Experience Framework oraz typy stron, które je odnoszą. Możesz utworzyć własne definicje zawartości przy użyciu dowolnego identyfikatora.

Identyfikator Szablon domyślny Opis
api.error (błąd api) exception.cshtml (wyjątek.cshtml) Strona błędu — wyświetla stronę błędu, gdy wystąpi wyjątek lub błąd.
api.idpselections idpSelector.cshtml Strona wyboru dostawcy tożsamości — wyświetla listę dostawców tożsamości, których użytkownicy mogą wybierać podczas logowania. Opcje są zwykle dostawcami tożsamości przedsiębiorstwa, dostawcami tożsamości społecznościowych, takimi jak Facebook i Google+, lub konta lokalne.
api.idpselections.signup idpSelector.cshtml Wybór dostawcy tożsamości na potrzeby rejestracji — wyświetla listę dostawców tożsamości, których użytkownicy mogą wybierać podczas rejestracji. Opcje są zwykle dostawcami tożsamości przedsiębiorstwa, dostawcami tożsamości społecznościowych, takimi jak Facebook i Google+, lub konta lokalne.
api.localaccountpasswordreset selfasserted.cshtml Nie pamiętasz strony hasła — wyświetla formularz, który użytkownicy muszą ukończyć w celu zainicjowania resetowania hasła.
api.localaccountsignin selfasserted.cshtml Strona logowania do konta lokalnego — wyświetla formularz logowania przy użyciu konta lokalnego opartego na adresie e-mail lub nazwie użytkownika. Formularz może zawierać pole wprowadzania tekstu i pole wprowadzania hasła.
api.localaccountsignup (rejestracja) selfasserted.cshtml Strona rejestracji konta lokalnego — wyświetla formularz rejestracji dla konta lokalnego opartego na adresie e-mail lub nazwie użytkownika. Formularz może zawierać różne kontrolki wejściowe, takie jak: pole wprowadzania tekstu, pole wprowadzania hasła, przycisk radiowy, pola rozwijane zaznaczania jednokrotnego i pola wyboru wielokrotnego wyboru.
api.phonefactor (czynnik api) wieloczynnikowy-1.0.0.cshtml Strona uwierzytelniania wieloskładnikowego — weryfikuje numery telefonów przy użyciu tekstu lub głosu podczas rejestracji lub logowania.
api.selfasserted (api.selfasserted) selfasserted.cshtml Strona rejestracji konta społecznościowego — wyświetla formularz, który użytkownicy muszą wykonać po zarejestrowaniu się przy użyciu istniejącego konta od dostawcy tożsamości społecznościowych. Ta strona jest podobna do poprzedniej strony tworzenia konta społecznościowego, z wyjątkiem pól wprowadzania hasła.
api.selfasserted.profileupdate Plik updateprofile.cshtml Strona aktualizacji profilu — wyświetla formularz, do którego użytkownicy mogą uzyskiwać dostęp w celu zaktualizowania profilu. Ta strona jest podobna do strony rejestracji konta społecznościowego, z wyjątkiem pól wprowadzania hasła.
api.signuporsignin ujednolicony.cshtml Ujednolicona strona rejestracji lub logowania — obsługuje proces rejestracji i logowania użytkownika. Użytkownicy mogą używać dostawców tożsamości przedsiębiorstwa, dostawców tożsamości społecznościowych, takich jak Facebook lub Google+, lub konta lokalne.

Dalsze kroki

Aby zapoznać się z przykładem dostosowywania interfejsu użytkownika przy użyciu definicji zawartości, zobacz:

Dostosowywanie interfejsu użytkownika aplikacji przy użyciu zasad niestandardowych