Aktivieren von CAPTCHA in Azure Active Directory B2C

• Erstellen Sie einen Benutzerflow, damit sich Benutzer bei Ihrer Anwendung registrieren und anmelden können.
• Registrieren Sie eine Webanwendung.

• Führen Sie die Schritte in "Erste Schritte mit benutzerdefinierten Richtlinien in Active Directory B2C" aus. In diesem Lernprogramm erfahren Sie, wie Sie benutzerdefinierte Richtliniendateien für die Verwendung Ihrer Azure AD B2C-Mandantenkonfiguration aktualisieren.
• Registrieren Sie eine Webanwendung.

1. Melden Sie sich beim Azure-Portal an.

2. Wenn Sie Zugriff auf mehrere Mandanten haben, wählen Sie das Symbol Einstellungen im Menü oben aus, um über das Menü Verzeichnisse + Abonnements zu Ihrem Azure AD B2C-Mandanten zu wechseln.

3. Wählen Sie im linken Menü Azure AD B2C aus. Oder wählen Sie "Alle Dienste " aus, und suchen Sie nach Azure AD B2C.

4. Wählen Sie Benutzerflüsse aus.

5. Wählen Sie den Benutzerflow aus, für den Sie CAPTCHA aktivieren möchten. Beispiel: B2C_1_signinsignup.

6. Wählen Sie Eigenschaften aus.

7. Wählen Sie unter CAPTCHA (Vorschau) den Ablauf aus, für den CAPTCHA aktiviert werden soll, z. B. CAPTCHA aktivieren – Registrieren.

8. Wählen Sie Speichern aus.

Testen des Benutzerflows

Führen Sie die Schritte unter Testen des Benutzerflows aus, um zu testen und zu bestätigen, dass CAPTCHA für den ausgewählten Flow aktiviert ist. Sie sollten aufgefordert werden, die Zeichen einzugeben, die Sie sehen oder hören, je nachdem, welchen CAPTCHA-Typ (Bild oder Audio) Sie auswählen.

Um CAPTCHA in Ihrer benutzerdefinierten Richtlinie zu aktivieren, müssen Sie Ihre vorhandenen benutzerdefinierten Richtliniendateien aktualisieren. Wenn Sie noch keine benutzerdefinierten Richtliniendateien haben, laden Sie die .zip Datei herunter oder klonen Sie das Repository von https://github.com/Azure-Samples/active-directory-b2c-custom-policy-starterpack. In diesem Artikel aktualisieren wir die XML-Dateien im Ordner /Display Controls Starterpack/LocalAccounts/.

Deklarieren von Ansprüchen

Sie benötigen weitere Ansprüche, um CAPTCHA in Ihrer benutzerdefinierten Richtlinie zu aktivieren:

1. Öffnen Sie in VS Code die Datei TrustFrameworkBase.XML .

2. Deklarieren Sie in diesem ClaimsSchema Abschnitt Ansprüche mit dem folgenden Code:

    <!--<ClaimsSchema>-->
     ...
     <ClaimType Id="inputSolution">
       <DataType>string</DataType>
     </ClaimType>
   
     <ClaimType Id="solved">
       <DataType>boolean</DataType>
     </ClaimType>
   
     <ClaimType Id="reason">
       <DataType>string</DataType>
     </ClaimType>
   
     <ClaimType Id="azureregion">
       <DataType>string</DataType>
     </ClaimType>
   
     <ClaimType Id="challengeId">
       <DisplayName>The ID of the generated captcha</DisplayName>
       <DataType>string</DataType>
       <UserHelpText>Captcha challenge identifier</UserHelpText>
       <UserInputType>Paragraph</UserInputType>
     </ClaimType>
   
     <ClaimType Id="challengeType">
       <DisplayName>Type of captcha (visual / audio)</DisplayName>
       <DataType>string</DataType>
       <UserHelpText>Captcha challenge type</UserHelpText>
       <UserInputType>Paragraph</UserInputType>
     </ClaimType>
   
     <ClaimType Id="challengeString">
       <DisplayName>Captcha challenge code</DisplayName>
       <DataType>string</DataType>
       <UserHelpText>Captcha challenge code</UserHelpText>
       <UserInputType>Paragraph</UserInputType>
     </ClaimType>
   
     <ClaimType Id="captchaEntered">
       <DisplayName>Captcha entered by the user</DisplayName>
       <DataType>string</DataType>
       <UserHelpText>Enter the characters you see</UserHelpText>
       <UserInputType>TextBox</UserInputType>
     </ClaimType>
   
     <ClaimType Id="isCaptchaSolved">
       <DisplayName>Flag indicating that the captcha was successfully solved</DisplayName>
       <DataType>boolean</DataType>
     </ClaimType>
   
     <ClaimType Id="mfaCaptchaEnabled">
       <DisplayName>flag used to control captcha enabled in MFA</DisplayName>
       <DataType>string</DataType>
     </ClaimType>
   
     <ClaimType Id="signupCaptchaEnabled">
       <DisplayName>flag used to control captcha enabled during signup</DisplayName>
       <DataType>string</DataType>
     </ClaimType>
   
     <ClaimType Id="signinCaptchaEnabled">
       <DisplayName>flag used to control captcha enabled during signin</DisplayName>
       <DataType>string</DataType>
     </ClaimType>
     ...
    <!--<ClaimsSchema>-->
   

Konfigurieren eines Anzeigesteuerelements

Um CAPTCHA für Ihre benutzerdefinierte Richtlinie zu aktivieren, verwenden Sie ein CAPTCHA-Anzeigesteuerelement. Das CAPTCHA-Anzeigesteuerelement generiert und rendert das CAPTCHA-Bild.

Suchen Sie in der TrustFrameworkBase.XML Datei das DisplayControls Element, und fügen Sie dann das folgende Anzeigesteuerelement als untergeordnetes Element hinzu. Wenn Sie noch nicht über ein Element verfügen DisplayControls , fügen Sie eines hinzu.

<!--<DisplayControls>-->
...    
<DisplayControl Id="captchaControlChallengeCode" UserInterfaceControlType="CaptchaControl" DisplayName="Help us beat the bots">    
    <InputClaims>
        <InputClaim ClaimTypeReferenceId="challengeType" />
        <InputClaim ClaimTypeReferenceId="challengeId" />
    </InputClaims>

    <DisplayClaims>
        <DisplayClaim ClaimTypeReferenceId="challengeType" ControlClaimType="ChallengeType" />
        <DisplayClaim ClaimTypeReferenceId="challengeId" ControlClaimType="ChallengeId" />
        <DisplayClaim ClaimTypeReferenceId="challengeString" ControlClaimType="ChallengeString" />
        <DisplayClaim ClaimTypeReferenceId="captchaEntered" ControlClaimType="CaptchaEntered" />
    </DisplayClaims>

    <Actions>
    <Action Id="GetChallenge">
        <ValidationClaimsExchange>
        <ValidationClaimsExchangeTechnicalProfile
            TechnicalProfileReferenceId="HIP-GetChallenge" />
        </ValidationClaimsExchange>
    </Action>

    <Action Id="VerifyChallenge">
        <ValidationClaimsExchange>
        <ValidationClaimsExchangeTechnicalProfile
            TechnicalProfileReferenceId="HIP-VerifyChallenge" />
        </ValidationClaimsExchange>
    </Action>
    </Actions>
</DisplayControl> 
...
<!--</DisplayControls>-->

Konfigurieren eines technischen CAPTCHA-Profils

Das technische Azure AD B2C-CAPTCHA-Profil überprüft die CAPTCHA-Abfrage. Dieses technische Profil kann einen CAPTCHA-Code generieren oder überprüfen, je nachdem, wie Sie es konfigurieren.

Suchen Sie in der TrustFrameworkBase.XML Datei das ClaimsProviders Element, und fügen Sie den Anspruchsanbieter hinzu, indem Sie den folgenden Code verwenden:

<!--<ClaimsProvider>-->
...
<ClaimsProvider>

    <DisplayName>HIPChallenge</DisplayName>

    <TechnicalProfiles>

    <TechnicalProfile Id="HIP-GetChallenge">
        <DisplayName>GetChallenge</DisplayName>
        <Protocol Name="Proprietary" Handler="Web.TPEngine.Providers.CaptchaProvider, Web.TPEngine, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />
        <Metadata>
            <Item Key="Operation">GetChallenge</Item>
            <Item Key="Brand">HIP</Item>
        </Metadata>
        <InputClaims>
            <InputClaim ClaimTypeReferenceId="challengeType" />
        </InputClaims>
        <DisplayClaims>
            <DisplayClaim ClaimTypeReferenceId="challengeString" />
        </DisplayClaims>
        <OutputClaims>
            <OutputClaim ClaimTypeReferenceId="challengeId" />
            <OutputClaim ClaimTypeReferenceId="challengeString" PartnerClaimType="ChallengeString" />
            <OutputClaim ClaimTypeReferenceId="azureregion" />
        </OutputClaims>
    </TechnicalProfile>
    <TechnicalProfile Id="HIP-VerifyChallenge">
        <DisplayName>Verify Code</DisplayName>
        <Protocol Name="Proprietary" Handler="Web.TPEngine.Providers.CaptchaProvider, Web.TPEngine, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />
        <Metadata>
        <Item Key="Brand">HIP</Item>
            <Item Key="Operation">VerifyChallenge</Item>
        </Metadata>
        <InputClaims>
            <InputClaim ClaimTypeReferenceId="challengeType" DefaultValue="Visual" />
            <InputClaim ClaimTypeReferenceId="challengeId" />
            <InputClaim ClaimTypeReferenceId="captchaEntered" PartnerClaimType="inputSolution" Required="true" />
            <InputClaim ClaimTypeReferenceId="azureregion" />
        </InputClaims>
        <DisplayClaims>
            <DisplayClaim ClaimTypeReferenceId="captchaEntered" />
        </DisplayClaims>
        <OutputClaims>
            <OutputClaim ClaimTypeReferenceId="challengeId" />
            <OutputClaim ClaimTypeReferenceId="isCaptchaSolved" PartnerClaimType="solved" />
            <OutputClaim ClaimTypeReferenceId="reason" PartnerClaimType="reason" />
        </OutputClaims>
    </TechnicalProfile>
    </TechnicalProfiles>
</ClaimsProvider>    
...
<!--<ClaimsProviders>-->

Das technische CAPTCHA-Profil, das Sie mit dem GetChallenge-Vorgang konfigurieren, generiert die CAPTCHA-Abfragezeichenfolge und zeigt sie an. Das technische CAPTCHA-Profil, das Sie mit der VerifyChallenge konfigurieren, überprüft die Abfragezeichenfolge, die der Benutzer eingibt.

Aktualisieren der Seitenlayouts der Inhaltsdefinition

Verwenden Sie für die verschiedenen Seitenlayouts die folgenden Seitenlayoutversionen:

Beispiel:

Suchen Sie in der TrustFrameworkBase.XML Datei unter dem ContentDefinitions Element nach einer Inhaltsdefinition mit Id="api.localaccountsignup", und aktualisieren Sie dann deren DataUri , wie im folgenden Code gezeigt:

<!---<ContentDefinitions>-->
...
<ContentDefinition Id="api.localaccountsignup">
    ...
    <!--Update this DataUri-->
    <DataUri>urn:com:microsoft:aad:b2c:elements:contract:selfasserted:2.1.27</DataUri>
    ...
</ContentDefinition>
...
<!---</ContentDefinitions>-->

Wir geben die selbstbestätigte Seitenlayoutversion als 2.1.27 an.

Nachdem Sie Ihre technischen Profile und Anzeigesteuerelemente konfiguriert haben, können Sie den Ablauf angeben, für den Sie CAPTCHA aktivieren möchten.

Aktivieren von CAPTCHA für den Registrierungs- oder Anmeldevorgang

Führen Sie die folgenden Schritte aus, um CAPTCHA für Ihren Registrierungs- oder Anmeldeablauf zu aktivieren:

1. Überprüfen Sie Ihre User Journey für die Registrierungsanmeldung, z. B. SignUpOrSignIn, um das selbst bestätigte technische Profil zu identifizieren, das Ihre Registrierungs- oder Anmeldeerfahrung anzeigt.

2. Fügen Sie im technischen Profil, z. B. LocalAccountSignUpWithLogonEmail, einen Metadatenschlüssel und einen Anzeigeanspruchseintrag hinzu, wie im folgenden Code gezeigt:

<TechnicalProfile Id="LocalAccountSignUpWithLogonEmail">
    ...
  <Metadata>
    ...
    <!--Add this metadata entry. Set value to true to activate CAPTCHA-->
    <Item Key="setting.enableCaptchaChallenge">true</Item>
    ...
  </Metadata>
    ...
  <DisplayClaims>
    ...
    <!--Add this display claim, which is a reference to the captcha display control-->
    <DisplayClaim DisplayControlReferenceId="captchaControlChallengeCode" /> 
    ...
  </DisplayClaims>
    ...
</TechnicalProfile>

Der Anzeigeanspruchseintrag verweist auf das Anzeigesteuerelement, das Sie zuvor konfiguriert haben.

Aktivieren von CAPTCHA im MFA-Fluss

Um CAPTCHA im MFA-Fluss zu aktivieren, müssen Sie eine Aktualisierung in zwei technischen Profilen vornehmen, d. h. im selbstbestätigten technischen Profil und im technischen Profil für den Telefonfaktor:

1. Überprüfen Sie die User Journey für die Registrierung bei der Registrierung, z. B. SignUpOrSignIn, um das selbstbestätigte technische Profil und die technischen Profile für den Telefonfaktor zu identifizieren, die für Ihren Registrierungs- oder Anmeldeablauf verantwortlich sind.

2. Fügen Sie in beiden technischen Profilen einen Metadatenschlüssel und einen Anzeigeanspruchseintrag hinzu, wie im folgenden Code gezeigt:

<TechnicalProfile Id="PhoneFactor-InputOrVerify">
    ...
  <Metadata>
    ...
    <!--Add this metadata entry. Value set to true-->
    <Item Key="setting.enableCaptchaChallenge">true</Item>
    ...
  </Metadata>
    ...
  <DisplayClaims>
    ...
    <!--Add this display claim-->
    <DisplayClaim DisplayControlReferenceId="captchaControlChallengeCode" /> 
    ...
  </DisplayClaims>
    ...
</TechnicalProfile>

CAPTCHA-Feature-Flag aktivieren

Um CAPTCHA während der Registrierung, Anmeldung oder MFA zu erzwingen, müssen Sie ein technisches Profil hinzufügen, das für jedes Szenario ein Featureflag aktiviert, und dann das technische Profil in der User Journey aufrufen.

1. Suchen Sie in der TrustFrameworkBase.XML Datei das ClaimsProviders Element, und fügen Sie den Anspruchsanbieter hinzu, indem Sie den folgenden Code verwenden:

<!--<ClaimsProvider>-->
...
<ClaimsProvider>

    <DisplayName>Set Feature Flags</DisplayName>

    <TechnicalProfiles>

    <TechnicalProfile Id="SetFeatureDefaultValue">
        <DisplayName>Set Feature Flags</DisplayName>
        <Protocol Name="Proprietary" Handler="Web.TPEngine.Providers.ClaimsTransformationProtocolProvider, Web.TPEngine, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />
        <OutputClaims>
            <OutputClaim ClaimTypeReferenceId="signupCaptchaEnabled" DefaultValue="true" />
            <OutputClaim ClaimTypeReferenceId="signinCaptchaEnabled" DefaultValue="true" />
            <OutputClaim ClaimTypeReferenceId="mfaCaptchaEnabled" DefaultValue="true" />
        </OutputClaims>
    </TechnicalProfile>
    </TechnicalProfiles>
</ClaimsProvider>
...
<!--<ClaimsProviders>-->

2. Je nach CAPTCHA-Szenario auf true oder false setzen DefaultValue

3. Fügen Sie der User Journey das technische Profil für Featureflags hinzu und aktualisieren Sie dann die Reihenfolge der restlichen Orchestrierungsschritte.

<!--<UserJourneys>-->
...
<UserJourney Id="SignUpOrSignIn">
    <OrchestrationSteps>

        <!--Add this orchestration step-->
        <OrchestrationStep Order="1" Type="ClaimsExchange">
          <ClaimsExchanges>
            <ClaimsExchange Id="SetFeatureDefaultValue" TechnicalProfileReferenceId="SetFeatureDefaultValue" />
          </ClaimsExchanges>
        </OrchestrationStep>
...
<!--<UserJourneys>-->

Hochladen der benutzerdefinierten Richtliniendateien

Führen Sie die Schritte unter Hochladen der Richtlinien aus, um Ihre benutzerdefinierten Richtliniendateien hochzuladen.

Testen der benutzerdefinierten Richtlinie

Führen Sie die Schritte unter Testen der benutzerdefinierten Richtlinie aus, um zu testen und zu bestätigen, dass CAPTCHA für den ausgewählten Flow aktiviert ist. Sie sollten aufgefordert werden, die Zeichen einzugeben, die Sie sehen oder hören, je nachdem, welchen CAPTCHA-Typ (Bild oder Audio) Sie auswählen.