إضافة سمات المستخدم وتخصيص مدخلات المستخدم في Azure Active Directory B2C

قبل أن تبدأ استخدم اختر نوع النهجالمحدد لاختيار نوع النهج التي تقوم بإعدادها. يوفر Azure Active Directory B2C طريقتين لتحديد كيفية تفاعل المستخدمين مع تطبيقاتك: من خلال تدفقات محددة مسبقا للمستخدمين أو من خلال سياسات مخصصة قابلة للتكوين بشكل كامل. تختلف الخطوات المطلوبة في هذه المقالة لكل أسلوب.

في هذه المقالة، يمكنك جمع سمة جديدة أثناء رحلة الاشتراك في Azure Active Directory B2C (Azure AD B2C). ستحصل على مدينة المستخدمين، وتهيئتها كمسقط، وتحدد ما إذا كان من المطلوب توفيرها.

هام

يستخدم هذا النموذج "المدينة" المطالبة المضمنة. بدلا من ذلك، يمكنك اختيار إحدى سمات Azure AD B2C المضمنة المدعومة أو سمة مخصصة. لاستخدام سمة مخصصة، قم بتمكين السمات المخصصة. لاستخدام سمة مضمنة أو مخصصة مختلفة، استبدل "المدينة" بالسمة التي تختارها، على سبيل المثال، وظيفة السمة المضمنة أو سمة مخصصة مثل extension_loyaltyId.

المتطلبات الأساسية

• إنشاء تدفق مستخدم لتمكين المستخدمين من تسجيل الدخول إلى تطبيقك.
• تسجيل تطبيق ويب.

• أكمل الخطوات في ابدأ العمل مع النهج المخصص في خدمات مجال Active Directory B2C
• تسجيل تطبيق ويب.

إضافة سمات المستخدم تدفق المستخدم الخاص بك

1. سجل الدخول إلى مدخل Azure.
2. إذا كان لديك حق الوصول إلى عدة مستأجرين، فحدد رمز الإعدادات في القائمة العلوية للتبديل إلى مستأجر Azure AD B2C من قائمة Directories + subscriptions.
3. من خدمات Azure، حدد Azure AD B2C. أو استخدم مربع البحث للبحث عن Azure AD B2Cوتحديده.
4. في مستأجر Azure AD B2C، حدّد User flows.
5. حدد نهجك (على سبيل المثال، "B2C_1_SignupSignin") لفتحه.
6. حدد سمات المستخدم ثم حدد سمة المستخدم (على سبيل المثال، "المدينة").
7. حدد حفظ.

تقديم مطالبات اختيارية للتطبيق

مطالبات التطبيق هي القيم التي يتم إرجاعها إلى التطبيق. تحديث تدفق المستخدم الخاص بك لاحتواء المطالبات المطلوبة.

1. حدد نهجك (على سبيل المثال، "B2C_1_SignupSignin") لفتحه.
2. اختر مطالبات التطبيق.
3. حدد السمات التي تريد إرسالها مرة أخرى إلى تطبيقك (على سبيل المثال، "المدينة").
4. حدد حفظ.

تكوين نوع إدخال سمات المستخدم

1. حدد نهجك (على سبيل المثال، "B2C_1_SignupSignin") لفتحه.

2. اختر تخطيطات الصفحة.

3. اختر صفحة تسجيل الحساب المحلي.

4. ضمن سمات المستخدم، حدد المدينة.

   1. في القائمة المنسدلة اختياري، حدد لا.
   2. في نوع إدخال المستخدم، حدد نوع إدخال المستخدم الحالي، مثل مربع نص، لفتح جزء نافذة محرر نوع إدخال المستخدم.
   3. في القائمة المنسدلة نوع إدخال المستخدم، حدد DropdownSingleSelect.
   4. في النص والقيم، أدخل أزواج النص والقيم التي تشكل مجموعة الاستجابات الخاصة بك للسمة. يتم عرض النص في واجهة الويب للتدفق الخاص بك، ويتم تخزين القيم في Azure AD B2C لـ النص المحدد. اختياري: استخدم أزرار "التحريك لأعلى/لأسفل" لإعادة ترتيب عناصر القائمة المنسدلة.

5. حدد OK. اختياري: استخدم زري "التحريك لأعلى/لأسفل" لإعادة ترتيب سمات المستخدم في صفحة الاشتراك.

6. حدد حفظ.

   

توفير قائمة بالقيم باستخدام المجموعات المترجمة

لتوفير قائمة مجموعة من القيم لسمة المدينة:

1. تمكين تخصيص اللغة على تدفق المستخدم
2. حدد نهجك (على سبيل المثال، "B2C_1_SignupSignin") لفتحه.
3. في الصفحة لغات لتدفق المستخدم، حدد لغة تريد دعمها.
4. ضمن ملفات الموارد على مستوى الصفحة، حدد صفحة تسجيل الحساب المحلي.
5. حدد تنزيل الإعدادات الافتراضية (أو تجاوز التنزيل إذا قمت بتحرير هذه اللغة مسبقا).
6. إنشاء LocalizedCollections سمة.

LocalizedCollections هي مصفوفة من Name و Value أزواج. سيكون ترتيب العناصر هو الترتيب الذي يتم عرضها به.

• ElementId هي سمة المستخدم التي تستجيب لها هذه السمة LocalizedCollections.
• Nameهي القيمة التي تظهر للمستخدم.
• Value هو ما يتم إرجاعه في المطالبة عند تحديد هذا الخيار.

{
  "LocalizedStrings": [...],
  "LocalizedCollections": [
    {
      "ElementType": "ClaimType",
      "ElementId": "city",
      "TargetCollection": "Restriction",
      "Override": true,
      "Items": [
        {
          "Name": "Berlin",
          "Value": "Berlin"
        },
        {
          "Name": "London",
          "Value": "London"
        },
        {
          "Name": "Seattle",
          "Value": "Seattle"
        }
      ]
    }
  ]
}

حمل التغييرات الخاصة بك

1. بعد إكمال التغييرات على ملف JSON الخاص بك، عد إلى مستأجر B2C.
2. حدد تدفقات المستخدم وحدد نهجك (على سبيل المثال، "B2C_1_SignupSignin") لفتحها.
3. حدد اللغات
4. حدد اللغة التي تريد الترجمة إليها.
5. ضمن ملفات الموارد على مستوى الصفحة، حدد صفحة تسجيل الحساب المحلي.
6. حدد رمز المجلد، وحدد ملف JSON لتحميله. يتم حفظ التغييرات على تدفق المستخدم تلقائيًا.

اختبار تدفق المستخدم لديك

1. حدد نهجك (على سبيل المثال، "B2C_1_SignupSignin") لفتحه.
2. لاختبار سياستك، حدّد "Run user flow".
3. للتطبيق، حدد تطبيق الويب المسمى testapp1 الذي قمت بتسجيله مسبقًا. عنوان URL الرد يجب أن يعرض https://jwt.ms.
4. انقر فوق تشغيل تدفق المستخدم

نظرة عامة

يمكنك جمع البيانات الأولية من المستخدمين باستخدام تسجيل الدخول أو تسجيل رحلة المستخدم. يمكن تجميع مطالبات إضافية لاحقا باستخدام رحلة مستخدم تحرير ملف تعريف. في أي وقت يقوم Azure AD B2C بجمع المعلومات مباشرة من المستخدم بشكل تفاعلي، فإنه يستخدم ملف التعريف التقني المؤكد ذاتيا. في هذه العينة، يمكنك:

1. تعريف مطالبة "المدينة".
2. اسأل المستخدم عن مدينته.
3. استمرار المدينة في ملف التعريف المستخدم في الدليل B2C AD Azure.
4. اقرأ مطالبة المدينة من دليل Azure AD B2C لكل تسجيل دخول.
5. أعد المدينة إلى تطبيق الطرف المعتمد بعد تسجيل الدخول أو الاشتراك.

تعريف مطالبة

توفر المطالبة تخزينا مؤقتا للبيانات أثناء تنفيذ نهج Azure AD B2C. مخطط المطالبات هو المكان الذي تعلن فيه عن مطالباتك. وتستخدم العناصر التالية لتعريف المطالبة:

• اسم العرض - سلسلة تعرف التسمية التي تواجه المستخدم.
• نوع البيانات - نوع المطالبة.
• نص تعليمات المستخدم - يساعد المستخدم على فهم ما هو مطلوب.
• نوع إدخال المستخدم - نوع عنصر تحكم الإدخال، مثل مربع النص أو تحديد الراديو أو القائمة المنسدلة أو التحديدات المتعددة.

افتح ملف ملحقات النُهج الخاص بك. على سبيل المثال، SocialAndLocalAccounts/TrustFrameworkExtensions.xml.

1. ابحث عن عنصر BuildingBlocks . إذا كان العنصر غير موجود، قم بإضافته.
2. حدد موقع عنصر ClaimsSchema . إذا كان العنصر غير موجود، قم بإضافته.
3. أضف مطالبة المدينة للعنصر 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>-->

تضمين سمة حدد افتراضيًا على Enumeration عنصر لجعله محددا بشكل افتراضي عند تحميل الصفحة الأولى. على سبيل المثال، لتحديد العنصر لندن مسبقا تغيير Enumeration العنصر كما في المثال التالي:

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

إضافة مطالبة إلى واجهة المستخدم

يتم تأكيد الملفات التقنيةالتالية ذاتيا، ويتم استدعاؤها عندما يتوقع من المستخدم توفير الإدخال:

• LocalAccountSignUpWithLogonEmail - تدفق تسجيل الدخول للحساب المحلي.
• تأكيد الذات-الاجتماعية - حساب الاتحاد تسجيل دخول المستخدم لأول مرة.
• تحديث الملف الشخصي-تأكيد الذات - تحرير تدفق ملف التعريف.

لجمع مطالبة المدينة أثناء التسجيل، يجب إضافتها كمطالبة بالمخرجات إلى LocalAccountSignUpWithLogonEmail الملف الشخصي الفني. تجاوز ملفت التعريف الفني في ملف الملحق. حدد القائمة الكاملة لمطالبات مخرجات عنصر التحكم في الترتيب الذي يتم عرض المطالبات عليه على الشاشة. ابحث عن عنصر ClaimsProviders. إضافة مطالبات جديدة كما يلي:

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

لجمع مطالبة المدينة بعد تسجيل الدخول الأولي باستخدام حساب مجمع، يجب إضافتها كمطالبة بالمخرجات إلى SelfAsserted-Social ملف التعريف الفني. لكي يتمكن مستخدمو الحساب المحلية والمتحدة من تحرير بيانات ملف التعريف الخاصة بهم لاحقا، أضف مطالبات الإدخال والإخراج إلى SelfAsserted-ProfileUpdate ملف التعريف الفني. تجاوز هذه التشكيلات الجانبية التقنية في الملف الملحق. حدد القائمة الكاملة لمطالبات المخرجات للتحكم في الترتيب الذي يتم عرض المطالبات عليه على الشاشة. ابحث عن عنصر ClaimsProviders. إضافة مطالبات جديدة كما يلي:

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

اقرأ واكتب مطالبة

ملفات التعريف التقنية التالية هي ملفات تعريف تقنية ل Active Directory، والتي تقرأ البيانات وتكتبها إلى معرف Microsoft Entra.
تستخدم PersistedClaims لكتابة البيانات إلى ملف التعريف للمستخدم OutputClaims وقراءة البيانات من ملف التعريف مستخدم ضمن ملفات التعريف الفنية Active Directory المعنية.

تجاوز هذه التشكيلات الجانبية التقنية في الملف الملحق. ابحث عن عنصر ClaimsProviders. إضافة مطالبات جديدة كما يلي:

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

تضمين مطالبة في الرمز المميز

لإعادة مطالبة المدينة مرة أخرى إلى تطبيق الطرف المعول، أضف مطالبة مخرجات إلى SocialAndLocalAccounts/SignUpOrSignIn.xml الملف. سيتم إضافة مطالبة المخرجات إلى الرمز المميز بعد رحلة مستخدم ناجحة، وسيتم إرسالها إلى التطبيق. تعديل عنصر ملف التعريف التقني داخل قسم الطرف المعول لإضافة المدينة كمطالبة مخرجات.

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

تحميل واختبار النهج المخصص المحدث

1. إذا كان لديك حق الوصول إلى عدة مستأجرين، فحدد رمز الإعدادات في القائمة العلوية للتبديل إلى مستأجر Azure AD B2C من قائمة Directories + subscriptions.
2. ابحث عن Azure AD B2C وحدده.
3. ضمن Policies، حدد Identity Experience Framework.
4. حدد تحميل النهج المخصص.
5. حمل ملفات النهج التي قمت بتغييرها مسبقا.

اختبار النهج المخصص

1. حدد نهج جهة الاعتماد، على سبيل المثالB2C_1A_signup_signin.
2. للوصول إلى التطبيق، حدّد تطبيق الويب الذي قمت بتسجيله مسبقاً. عنوان URL الرد يجب أن يعرض https://jwt.ms.
3. حدّدالتشغيل الآن الزر.
4. من صفحة الاشتراك أو تسجيل الدخول، حدد التسجيل الآن لتسجيل الدخول. الانتهاء من إدخال معلومات المستخدم بما في ذلك اسم المدينة، ثم انقر فوق إنشاء. لا بد أن تشاهد محتويات الرمز المميز الذي تم إرجاعه.

يجب أن تبدو شاشة الاشتراك مشابهة للقطة الشاشة التالية:

يتضمن الرمز المميز المرسل إلى طلبك المطالبة city.

{
  "typ": "JWT",
  "alg": "RS256",
  "kid": "X5eXk4xyojNFum1kl2Ytv8dlNP4-c57dO6QGTVBwaNk"
}.{
  "exp": 1583500140,
  "nbf": 1583496540,
  "ver": "1.0",
  "iss": "https://contoso.b2clogin.com/f06c2fe8-709f-4030-85dc-38a4bfd9e82d/v2.0/",
  "aud": "e1d2612f-c2bc-4599-8e7b-d874eaca1ee1",
  "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"
  ...
}

[اختياري] قم بترجمة واجهة المستخدم

يسمح لك Azure AD B2C بملاءمة سياستك مع لغات مختلفة. لمزيد من المعلومات، تعرف على تخصيص تجربة اللغة. لترجمة صفحة الاشتراك، قم بإعداد قائمة اللغات المعتمدة،وتوفير تسميات خاصة باللغة.

إشعار

عند استخدام LocalizedCollection التسميات الخاصة باللغة، يمكنك إزالة Restriction المجموعة من تعريف المطالبة.

يوضح المثال التالي كيفية توفير قائمة المدن للغة الإنجليزية والإسبانية. ووضع كلاهما Restriction في مجموعة من مدينة المطالبة مع قائمة بالعناصر للغة الإنجليزية والإسبانية. حدد افتراضيًا يجعل عنصر محدد بشكل افتراضي عند تحميل الصفحة الأولى.

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

بعد إضافة عنصر التعريب، قم بتحرير تعريف المحتوى باستخدام التعريب. في المثال التالي، يتم إضافة موارد مترجمة مخصصة باللغة الإنجليزية (en) والأسبانية (es) إلى صفحة الاشتراك:

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

الخطوات التالية

• تعرف على المزيد حول عنصر ClaimsSchema في مرجع IEF.
• تعرف على كيفية استخدام السمات المخصصة في Azure AD B2C.

الخطوات التالية

• تخصيص واجهة المستخدم في Azure Active Directory B2C.
• تخصيص واجهة المستخدم مع قوالب HTML في Azure Active Directory B2C.
• تمكين JavaScript.