Question

在某种程度上，已经问过这个问题： Azure B2C sign-up. Hide password fields until verification code entered?

但是，在提出问题时，该功能（JavaScript）不可用。现在是了。

我们正在使用自定义策略
我们已经为注册页面提供了自定义UI（静态HTML + CSS）

但是，我不确定如何最好地达到期望的结果。对成功的验证做出反应的最佳方法是什么？我目前不确定如何赶上活动。

这些示例非常少，并且没有显示任何对诸如验证之类的B2C（内部？）事件做出反应的信息。

https://docs.microsoft.com/en-us/azure/active-directory-b2c/javascript-samples

不要在HTML元素上绑定click事件。

不要依赖Azure AD B2C代码或注释。

Answer 1

目前，此功能在使用JS的B2C注册页面中不可用。如果您认为这是forum中的必需功能，则可以将其添加到支持请求中。如果可以使用策略满足请求，并且建议这样做，请确保实施自定义策略。

这是在B2C注册页面中使用javascript的准则

使用JavaScript的指南

使用JavaScript自定义应用程序界面时，请遵循以下准则： •不要在HTML元素上绑定click事件。

•不要依赖Azure AD B2C代码或注释。

•请勿更改Azure AD B2C HTML元素的顺序或层次结构。使用Azure AD B2C策略来控制UI元素的顺序。

•您可以出于以下考虑调用任何RESTful服务：

o您可能需要将RESTful服务CORS设置为允许客户端HTTP调用。

o确保您的RESTful服务是安全的，并且仅使用HTTPS协议。

o不要直接使用JavaScript调用Azure AD B2C终结点。

•您可以嵌入JavaScript，也可以链接到外部JavaScript文件。使用外部JavaScript文件时，请确保使用绝对URL，而不是相对URL。

•JavaScript框架：

o Azure AD B2C使用特定版本的jQuery。不要包含其他版本的jQuery。在同一页面上使用多个版本会导致问题。

o不支持使用RequireJS。

o Azure AD B2C不支持大多数JavaScript框架。

•可以通过调用window.SETTINGS，window.CONTENT对象（例如当前的UI语言）来读取Azure AD B2C设置。请勿更改这些对象的值。

•若要自定义Azure AD B2C错误消息，请在策略中使用本地化。

•如果使用策略可以实现任何目的，通常是推荐的方法。

Answer 2

建议的方法是尽可能不使用JavaScript来实现。一旦您对政策的运作方式有了更多的了解，这将非常容易。

基本思路：根据您要显示的声明将技术资料分为两部分。

    <ClaimsProvider>
      <DisplayName>Local Account</DisplayName>
      <TechnicalProfiles>
        <!-- First page of signup containing only email verification -->
        <TechnicalProfile Id="LocalAccountSignUpWithLogonEmail_Custom">
          <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="IpAddressClaimReferenceId">IpAddress</Item>
            <Item Key="ContentDefinitionReferenceId">api.localaccountsignup</Item>
            <Item Key="language.button_continue">Create</Item>
          </Metadata>
          <CryptographicKeys>
            <Key Id="issuer_secret" StorageReferenceId="B2C_1A_TokenSigningKeyContainer" />
          </CryptographicKeys>
          <InputClaims>
            <InputClaim ClaimTypeReferenceId="email" />
          </InputClaims>
          <OutputClaims>
            <OutputClaim ClaimTypeReferenceId="email" PartnerClaimType="Verified.Email" Required="true" />
          </OutputClaims>
        </TechnicalProfile>
        <!-- Second page of signup after email verification -->
        <TechnicalProfile Id="LocalAccountSignUpWithLogonEmail_Custom2">
          <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="IpAddressClaimReferenceId">IpAddress</Item>
            <Item Key="ContentDefinitionReferenceId">api.localaccountsignup</Item>
            <Item Key="language.button_continue">Create</Item>
          </Metadata>
          <CryptographicKeys>
            <Key Id="issuer_secret" StorageReferenceId="B2C_1A_TokenSigningKeyContainer" />
          </CryptographicKeys>
          <InputClaims>
            <InputClaim ClaimTypeReferenceId="email" />
          </InputClaims>
          <OutputClaims>
            <OutputClaim ClaimTypeReferenceId="objectId" />
            <OutputClaim ClaimTypeReferenceId="email" PartnerClaimType="Verified.Email" Required="true" />
            <OutputClaim ClaimTypeReferenceId="newPassword" Required="true" />
            <OutputClaim ClaimTypeReferenceId="reenterPassword" Required="true" />
            <OutputClaim ClaimTypeReferenceId="executed-SelfAsserted-Input" DefaultValue="true" />
            <OutputClaim ClaimTypeReferenceId="authenticationSource" />
            <OutputClaim ClaimTypeReferenceId="newUser" />
            <OutputClaim ClaimTypeReferenceId="displayName" Required="true" />
          </OutputClaims>
          <ValidationTechnicalProfiles>
            <ValidationTechnicalProfile ReferenceId="AAD-UserWriteUsingLogonEmail" />
          </ValidationTechnicalProfiles>
          <UseTechnicalProfileForSessionManagement ReferenceId="SM-AAD" />
        </TechnicalProfile>
      </TechnicalProfiles>
    </ClaimsProvider>

第二：参考技术资料，将您的用户分为两个步骤。

        <OrchestrationStep Order="2" Type="ClaimsExchange">
          <ClaimsExchanges>
            <ClaimsExchange Id="SignUpWithLogonEmailExchange" TechnicalProfileReferenceId="LocalAccountSignUpWithLogonEmail_Custom" />
          </ClaimsExchanges>
        </OrchestrationStep>
        <OrchestrationStep Order="3" Type="ClaimsExchange">
          <ClaimsExchanges>
            <ClaimsExchange Id="SignUpWithLogonEmailExchange2" TechnicalProfileReferenceId="LocalAccountSignUpWithLogonEmail_Custom2" />
          </ClaimsExchanges>
        </OrchestrationStep>

B2C注册页面-电子邮件验证后显示断言字段

2 个答案: