Condividi tramite


Aggiungere attributi utente e personalizzare l'input dell'utente in Azure Active Directory B2C

Importante

A partire dal 1° maggio 2025, Azure AD B2C non sarà più disponibile per l'acquisto per i nuovi clienti. Altre informazioni sono disponibili nelle domande frequenti.

Prima di iniziare, utilizza il selettore Scegli un tipo di criterio nella parte superiore di questa pagina per scegliere il tipo di criterio che si sta configurando. Azure Active Directory B2C offre due metodi per definire il modo in cui gli utenti interagiscono con le applicazioni: tramite flussi utente predefiniti o tramite criteri personalizzati completamente configurabili. I passaggi necessari in questo articolo sono diversi per ogni metodo.

In questo articolo viene raccolto un nuovo attributo, ad esempio città, durante il percorso di iscrizione in Azure Active Directory B2C (Azure AD B2C). È possibile ottenere la città degli utenti, configurarla come elenco a discesa e definire se deve essere fornita.

Importante

Questo esempio usa la dichiarazione predefinita 'città'. È invece possibile scegliere uno degli attributi predefiniti di Azure AD B2C supportati o un attributo personalizzato. Per usare un attributo personalizzato, abilitare gli attributi personalizzati. Per usare un attributo incorporato o personalizzato diverso, sostituire 'city' con l'attributo di vostra scelta, ad esempio l'attributo incorporato jobTitle o un attributo personalizzato come extension_loyaltyId.

Prerequisiti

Aggiungere attributi utente al flusso utente

  1. Accedi al portale di Azure.
  2. Se si dispone dell'accesso a più tenant, selezionare l'icona Impostazioni nel menu superiore per passare al tenant di Azure AD B2C dal menu Directory + sottoscrizioni.
  3. In Servizi di Azure selezionare Azure AD B2C. In alternativa, usare la casella di ricerca per trovare e selezionare Azure AD B2C.
  4. Nel tenant di Azure AD B2C selezionare Flussi utente.
  5. Seleziona la tua politica (ad esempio, "B2C_1_SignupSignin") per aprirla.
  6. Selezionare Attributi utente e quindi selezionare l'attributo utente ,ad esempio "City".
  7. Seleziona Salva.

Fornire attestazioni facoltative all'app

Le attestazioni dell'applicazione sono valori restituiti all'applicazione. Aggiornare il flusso utente in modo che contenga le attestazioni desiderate:

  1. Seleziona la tua politica (ad esempio, "B2C_1_SignupSignin") per aprirla.
  2. Selezionare Dichiarazioni dell'applicazione.
  3. Selezionare gli attributi da inviare all'applicazione, ad esempio "City".
  4. Seleziona Salva.

Configurare il tipo di input degli attributi utente

  1. Seleziona la tua politica (ad esempio, "B2C_1_SignupSignin") per aprirla.

  2. Seleziona Layout delle pagine.

  3. Selezionare Pagina di iscrizione all'account locale.

  4. In Attributi utente selezionare Città.

    1. Nell'elenco a discesa Facoltativo selezionare No.
    2. In Tipo di input utente selezionare il tipo di input utente corrente, ad esempio TextBox, per aprire un riquadro della finestra dell'editor dei tipi di input utente
    3. Nell'elenco a discesa Tipo di input utente, selezionare DropdownSingleSelect.
    4. In Text and Values ( Testo e valori) immettere le coppie di testo e valore che costituiscono il set di risposte per l'attributo . Il testo viene visualizzato nell'interfaccia Web per il flusso e i valori vengono archiviati in Azure AD B2C per il testo selezionato. Facoltativo: usare i pulsanti "Sposta su/giù" per riordinare gli elementi a discesa.
  5. Selezionare OK. Facoltativo: usare i pulsanti "Sposta su/giù" per riordinare gli attributi utente nella pagina di iscrizione.

  6. Seleziona Salva.

    API verde per le chiamate di pagina Web.

Specificare un elenco di valori usando raccolte localizzate

Per fornire un insieme prestabilito di valori per l'attributo città:

  1. Abilitare la personalizzazione della lingua nel flusso utente
  2. Seleziona la tua politica (ad esempio, "B2C_1_SignupSignin") per aprirla.
  3. Nella pagina Lingua del flusso utente selezionare la lingua che si vuole personalizzare.
  4. In File di risorse a livello di pagina selezionare Pagina di iscrizione all'account locale.
  5. Selezionare Scarica impostazioni predefinite (o Scarica sostituzioni se è stata modificata in precedenza questa lingua).
  6. Creare un LocalizedCollections attributo.

LocalizedCollections è una matrice di Name coppie e Value . L'ordine per gli elementi è l'ordine in cui vengono visualizzati.

  • ElementId è l'attributo utente per il quale l'attributo LocalizedCollections rappresenta una risposta.
  • Name è il valore visualizzato all'utente.
  • Value è il valore restituito nell'attestazione quando questa opzione è selezionata.
{
  "LocalizedStrings": [...],
  "LocalizedCollections": [
    {
      "ElementType": "ClaimType",
      "ElementId": "city",
      "TargetCollection": "Restriction",
      "Override": true,
      "Items": [
        {
          "Name": "Berlin",
          "Value": "Berlin"
        },
        {
          "Name": "London",
          "Value": "London"
        },
        {
          "Name": "Seattle",
          "Value": "Seattle"
        }
      ]
    }
  ]
}

Caricamento delle modifiche

  1. Dopo aver completato le modifiche apportate al file JSON, tornare al tenant B2C.
  2. Selezionare Flussi utente e selezionare la politica (ad esempio, "B2C_1_SignupSignin") per aprirla.
  3. Selezionare Lingue.
  4. Selezionare la lingua in cui si vuole tradurre.
  5. In File di risorse a livello di pagina selezionare Pagina di iscrizione all'account locale.
  6. Selezionare l'icona della cartella e selezionare il file JSON da caricare. Le modifiche vengono salvate automaticamente nel flusso utente.

Testare il flusso utente

  1. Seleziona la tua politica (ad esempio, "B2C_1_SignupSignin") per aprirla.
  2. Per testare la politica, selezionare Esegui flusso utente.
  3. In Applicazione selezionare l'applicazione Web denominata testapp1 registrata in precedenza. L'URL di risposta dovrebbe mostrare https://jwt.ms.
  4. Selezionare Esegui flusso utente

Informazioni generali

È possibile raccogliere dati iniziali dagli utenti usando il percorso utente di iscrizione o accesso. È possibile raccogliere più attestazioni in un secondo momento usando un percorso utente di modifica del profilo. Ogni volta che Azure AD B2C raccoglie informazioni direttamente dall'utente in modo interattivo, usa il profilo tecnico autocertificato. In questo esempio:

  1. Definire un'attestazione "city".
  2. Chiedere all'utente la propria città.
  3. Rendere persistente la città nel profilo utente nella directory di Azure AD B2C.
  4. Leggi la dichiarazione city dalla directory di Azure AD B2C a ogni accesso.
  5. Reindirizza la città alla tua applicazione di terze parti dopo l'accesso o la registrazione.

Definire una richiesta

Una dichiarazione fornisce un archivio temporaneo dei dati durante l'esecuzione di una policy di Azure AD B2C. Lo schema delle attestazioni è il luogo in cui si dichiarano le attestazioni. Per definire l'attestazione vengono usati gli elementi seguenti:

  • DisplayName : stringa che definisce l'etichetta rivolta all'utente.
  • DataType : tipo dell'attestazione.
  • UserHelpText : aiuta l'utente a comprendere cosa è necessario.
  • UserInputType - tipo di controllo di input, ad esempio casella di testo, selezione singola, elenco a discesa o selezioni multiple.

Apri il file delle estensioni della tua policy. Ad esempio: SocialAndLocalAccounts/TrustFrameworkExtensions.xml.

  1. Cercare l'elemento BuildingBlocks. Se l'elemento non esiste, aggiungerlo.
  2. Individuare l'elemento ClaimsSchema . Se l'elemento non esiste, aggiungerlo.
  3. Aggiungere l'attestazione città all'elemento ClaimsSchema.
<!-- 
<BuildingBlocks>
  <ClaimsSchema> -->
    <ClaimType Id="city">
      <DisplayName>City where you work</DisplayName>
      <DataType>string</DataType>
      <UserInputType>DropdownSingleSelect</UserInputType>
      <Restriction>
        <Enumeration Text="Berlin" Value="berlin" />
        <Enumeration Text="London" Value="london" />
        <Enumeration Text="Seattle" Value="seattle" />
      </Restriction>
    </ClaimType>
  <!-- 
  </ClaimsSchema>
</BuildingBlocks>-->

Includere l'attributo SelectByDefault in un Enumeration elemento per renderlo selezionato per impostazione predefinita al primo caricamento della pagina. Ad esempio, per pre-selezionare l'elemento London , modificare l'elemento Enumeration come nell'esempio seguente:

<Restriction>
  <Enumeration Text="Berlin" Value="berlin" />
  <Enumeration Text="London" Value="london" SelectByDefault="true" />
  <Enumeration Text="Seattle" Value="seattle" />
</Restriction>

Aggiungere un'attestazione all'interfaccia utente

I seguenti profili tecnici sono autocertificati e richiamati quando sia previsto che un utente fornisca input:

  • LocalAccountSignUpWithLogonEmail - Flusso di iscrizione all'account locale.
  • SelfAsserted-Social : account federato per la prima volta che l'utente accede.
  • SelfAsserted-ProfileUpdate - Modifica flusso del profilo.

Per raccogliere l'attestazione della città durante l'iscrizione, è necessario aggiungerla come attestazione di output al LocalAccountSignUpWithLogonEmail profilo tecnico. Sovrascrivi questo profilo tecnico nel file di estensione. Specificare l'intero elenco di attestazioni di output per controllare l'ordine in cui vengono visualizzate le attestazioni sullo schermo. Trova l'elemento ClaimsProviders. Aggiungere un nuovo ClaimsProviders come indicato di seguito:

<ClaimsProvider>
  <DisplayName>Local Account</DisplayName>
  <TechnicalProfiles>
    <!--Local account sign-up page-->
    <TechnicalProfile Id="LocalAccountSignUpWithLogonEmail">
      <OutputClaims>
       <OutputClaim ClaimTypeReferenceId="email" PartnerClaimType="Verified.Email" Required="true" />
       <OutputClaim ClaimTypeReferenceId="newPassword" Required="true" />
       <OutputClaim ClaimTypeReferenceId="reenterPassword" Required="true" />
       <OutputClaim ClaimTypeReferenceId="displayName" />
       <OutputClaim ClaimTypeReferenceId="givenName" />
       <OutputClaim ClaimTypeReferenceId="surName" />
       <OutputClaim ClaimTypeReferenceId="city"/>
     </OutputClaims>
   </TechnicalProfile>
  </TechnicalProfiles>
</ClaimsProvider>

Per raccogliere la richiesta della città dopo l'accesso iniziale con un account federato, è necessario aggiungerla come richiesta di output al profilo tecnico SelfAsserted-Social. Per consentire agli utenti dell'account locale e federato di modificare i dati del profilo in un secondo momento, aggiungere le attestazioni di input e output al SelfAsserted-ProfileUpdate profilo tecnico. Eseguire l'override di questi profili tecnici nel file di estensione. Specificare l'intero elenco delle attestazioni di output per controllare l'ordine in cui vengono visualizzate le attestazioni sullo schermo. Trova l'elemento ClaimsProviders. Aggiungere un nuovo ClaimsProviders come indicato di seguito:

<ClaimsProvider>
  <DisplayName>Self Asserted</DisplayName>
  <TechnicalProfiles>
    <!--Federated account first-time sign-in page-->
    <TechnicalProfile Id="SelfAsserted-Social">
      <InputClaims>
        <InputClaim ClaimTypeReferenceId="city" />
      </InputClaims>
      <OutputClaims>
        <OutputClaim ClaimTypeReferenceId="displayName"/>
        <OutputClaim ClaimTypeReferenceId="givenName"/>
        <OutputClaim ClaimTypeReferenceId="surname"/>
        <OutputClaim ClaimTypeReferenceId="city"/>
      </OutputClaims>
    </TechnicalProfile>
    <!--Edit profile page-->
    <TechnicalProfile Id="SelfAsserted-ProfileUpdate">
      <InputClaims>
        <InputClaim ClaimTypeReferenceId="city" />
      </InputClaims>
      <OutputClaims>
        <OutputClaim ClaimTypeReferenceId="displayName"/>
        <OutputClaim ClaimTypeReferenceId="givenName" />
        <OutputClaim ClaimTypeReferenceId="surname" />
        <OutputClaim ClaimTypeReferenceId="city"/>
      </OutputClaims>
    </TechnicalProfile>
  </TechnicalProfiles>
</ClaimsProvider>

Leggere e scrivere un'attestazione

I profili tecnici seguenti sono profili tecnici di Active Directory, che leggono e scrivono dati in Microsoft Entra ID.
Usare PersistedClaims per scrivere dati nel profilo utente e OutputClaims per leggere i dati dal profilo utente all'interno dei rispettivi profili tecnici di Active Directory.

Eseguire l'override di questi profili tecnici nel file di estensione. Trova l'elemento ClaimsProviders. Aggiungere un nuovo ClaimsProviders come indicato di seguito:

<ClaimsProvider>
  <DisplayName>Azure Active Directory</DisplayName>
  <TechnicalProfiles>
    <!-- Write data during a local account sign-up flow. -->
    <TechnicalProfile Id="AAD-UserWriteUsingLogonEmail">
      <PersistedClaims>
        <PersistedClaim ClaimTypeReferenceId="city"/>
      </PersistedClaims>
    </TechnicalProfile>
    <!-- Write data during a federated account first-time sign-in flow. -->
    <TechnicalProfile Id="AAD-UserWriteUsingAlternativeSecurityId">
      <PersistedClaims>
        <PersistedClaim ClaimTypeReferenceId="city"/>
      </PersistedClaims>
    </TechnicalProfile>
    <!-- Write data during edit profile flow. -->
    <TechnicalProfile Id="AAD-UserWriteProfileUsingObjectId">
      <PersistedClaims>
        <PersistedClaim ClaimTypeReferenceId="city"/>
      </PersistedClaims>
    </TechnicalProfile>
    <!-- Read data after user resets the password. -->
    <TechnicalProfile Id="AAD-UserReadUsingEmailAddress">
      <OutputClaims>  
        <OutputClaim ClaimTypeReferenceId="city" />
      </OutputClaims>
    </TechnicalProfile>
    <!-- Read data after user authenticates with a local account. -->
    <TechnicalProfile Id="AAD-UserReadUsingObjectId">
      <OutputClaims>  
        <OutputClaim ClaimTypeReferenceId="city" />
      </OutputClaims>
    </TechnicalProfile>
    <!-- Read data after user authenticates with a federated account. -->
    <TechnicalProfile Id="AAD-UserReadUsingAlternativeSecurityId">
      <OutputClaims>  
        <OutputClaim ClaimTypeReferenceId="city" />
      </OutputClaims>
    </TechnicalProfile>
  </TechnicalProfiles>
</ClaimsProvider>

Includere un'attestazione nel token

Per restituire l'attestazione della città all'applicazione relying party, aggiungere un'attestazione di output al SocialAndLocalAccounts/SignUpOrSignIn.xml file. L'attestazione di output verrà aggiunta al token dopo un percorso utente riuscito e verrà inviata all'applicazione. Modificare l'elemento del profilo tecnico all'interno della sezione relying party per aggiungere la città come attestazione di output.

<RelyingParty>
  <DefaultUserJourney ReferenceId="SignUpOrSignIn" />
  <TechnicalProfile Id="PolicyProfile">
    <DisplayName>PolicyProfile</DisplayName>
    <Protocol Name="OpenIdConnect" />
    <OutputClaims>
      <OutputClaim ClaimTypeReferenceId="displayName" />
      <OutputClaim ClaimTypeReferenceId="givenName" />
      <OutputClaim ClaimTypeReferenceId="surname" />
      <OutputClaim ClaimTypeReferenceId="email" />
      <OutputClaim ClaimTypeReferenceId="objectId" PartnerClaimType="sub"/>
      <OutputClaim ClaimTypeReferenceId="identityProvider" />
      <OutputClaim ClaimTypeReferenceId="tenantId" AlwaysUseDefaultValue="true" DefaultValue="{Policy:TenantObjectId}" />
      <OutputClaim ClaimTypeReferenceId="city" DefaultValue="" />
    </OutputClaims>
    <SubjectNamingInfo ClaimType="sub" />
  </TechnicalProfile>
</RelyingParty>

Caricare e testare i criteri personalizzati aggiornati

  1. Se si dispone dell'accesso a più tenant, selezionare l'icona Impostazioni nel menu superiore per passare al tenant di Azure AD B2C dal menu Directory + sottoscrizioni.
  2. Cerca e seleziona Azure AD B2C.
  3. Sotto Politiche, selezionare Identity Experience Framework.
  4. Selezionare Carica criteri personalizzati.
  5. Carica i file dei criteri che hai modificato in precedenza.

Testare la politica personalizzata

  1. Seleziona i criteri della tua parte fidata, ad esempio B2C_1A_signup_signin.
  2. In Applicazione selezionare un'applicazione Web registrata in precedenza. L'URL di risposta dovrebbe mostrare https://jwt.ms.
  3. Selezionare il pulsante Esegui adesso .
  4. Nella pagina di iscrizione o accesso selezionare Iscriviti ora per iscriversi. Completare l'immissione delle informazioni utente, incluso il nome della città, e quindi selezionare Crea. Verrà visualizzato il contenuto del token restituito.

La schermata di iscrizione dovrebbe essere simile alla schermata seguente:

Screenshot dell'opzione di iscrizione modificata

Il token inviato all'applicazione include l'attestazione city.

{
  "typ": "JWT",
  "alg": "RS256",
  "kid": "X5eXk4xyojNFum1kl2Ytv8dlNP4-c57dO6QGTVBwaNk"
}.{
  "exp": 1583500140,
  "nbf": 1583496540,
  "ver": "1.0",
  "iss": "https://contoso.b2clogin.com/aaaabbbb-0000-cccc-1111-dddd2222eeee/v2.0/",
  "aud": "00001111-aaaa-2222-bbbb-3333cccc4444",
  "acr": "b2c_1a_signup_signin",
  "nonce": "defaultNonce",
  "iat": 1583496540,
  "auth_time": 1583496540,
  "name": "Emily Smith",
  "email": "joe@outlook.com",
  "given_name": "Emily",
  "family_name": "Smith",
  "city": "Berlin"
  ...
}

[Facoltativo] Localizzare l'interfaccia utente

Azure AD B2C consente di soddisfare i criteri in lingue diverse. Per altre informazioni, vedere Personalizzazione dell'esperienza di linguaggio. Per localizzare la pagina di iscrizione, configurare l'elenco delle lingue supportate e fornire etichette specifiche della lingua.

Annotazioni

Quando si usa LocalizedCollection con le etichette specifiche della lingua, è possibile rimuovere la Restriction raccolta dalla definizione della dichiarazione.

Nell'esempio seguente viene illustrato come fornire l'elenco delle città per l'inglese e lo spagnolo. Entrambi impostano la raccolta relativa all'attestazione della Restriction con un elenco di elementi in inglese e spagnolo. SelectByDefault consente di selezionare un elemento per impostazione predefinita quando la pagina viene caricata per la prima volta.

<!-- 
<BuildingBlocks>-->
  <Localization Enabled="true">
    <SupportedLanguages DefaultLanguage="en" MergeBehavior="Append">
      <SupportedLanguage>en</SupportedLanguage>
      <SupportedLanguage>es</SupportedLanguage>
    </SupportedLanguages>
    <LocalizedResources Id="api.localaccountsignup.en">
      <LocalizedCollections>
        <LocalizedCollection ElementType="ClaimType" ElementId="city" TargetCollection="Restriction">
          <Item Text="Berlin" Value="Berlin"></Item>
          <Item Text="London" Value="London" SelectByDefault="true"></Item>
          <Item Text="Seattle" Value="Seattle"></Item>
        </LocalizedCollection>
      </LocalizedCollections>
    </LocalizedResources>
    <LocalizedResources Id="api.localaccountsignup.es">
      <LocalizedCollections>
        <LocalizedCollection ElementType="ClaimType" ElementId="city" TargetCollection="Restriction">
          <Item Text="Berlina" Value="Berlin"></Item>
          <Item Text="Londres" Value="London" SelectByDefault="true"></Item>
          <Item Text="Seattle" Value="Seattle"></Item>
        </LocalizedCollection>
      </LocalizedCollections>
    </LocalizedResources>
  </Localization>
<!-- 
</BuildingBlocks>-->

Dopo aver aggiunto l'elemento di localizzazione, modificare la definizione del contenuto con la localizzazione. Nell'esempio seguente, le risorse localizzate in inglese (en) e spagnolo (es) personalizzate vengono aggiunte alla pagina di iscrizione:

<!-- 
<BuildingBlocks>
  <ContentDefinitions> -->
   <ContentDefinition Id="api.localaccountsignup">
    <LocalizedResourcesReferences MergeBehavior="Prepend">
        <LocalizedResourcesReference Language="en" LocalizedResourcesReferenceId="api.localaccountsignup.en" />
        <LocalizedResourcesReference Language="es" LocalizedResourcesReferenceId="api.localaccountsignup.es" />
    </LocalizedResourcesReferences>
   </ContentDefinition>
  <!-- 
  </ContentDefinitions>
</BuildingBlocks>-->

Passaggi successivi