Azure Active Directory B2C で CAPTCHA を有効にする

2025-05-08

重要

2025 年 5 月 1 日より、Azure AD B2C は新規のお客様向けに購入できなくなります。詳細については、FAQ を参照してください。

開始する前にこのページの上部にある ポリシーの種類 セレクターを使用して、設定するポリシーの種類を選択します。 Azure Active Directory B2C には、ユーザーがアプリケーションを操作する方法を定義する 2 つの方法 (定義済みのユーザーフローを使用する、または完全に構成可能なカスタムポリシーを使用する) があります。この記事で必要な手順は、方法ごとに異なります。

Azure Active Directory B2C (Azure AD B2C) を使用すると、CAPTCHA を有効にして、コンシューマー向けアプリケーションに対する自動攻撃を防ぐことができます。 Azure AD B2C の CAPTCHA では、オーディオとビジュアルの両方の CAPTCHA の課題がサポートされています。このセキュリティ機能は、ローカルアカウントのサインアップフローとサインインフローの両方で有効にすることができます。 CAPTCHA は、ソーシャル ID プロバイダーのサインインには適用されません。

注

この機能はパブリックプレビュー段階です

[前提条件]

ユーザーがサインアップしてアプリケーションにサインインできるように、ユーザーフローを作成します。
Web アプリケーションを登録します。

「Active Directory B2C でのカスタムポリシーの概要」の手順を完了してください。このチュートリアルでは、Azure AD B2C テナント構成を使用するようにカスタムポリシーファイルを更新する方法について説明します。
Web アプリケーションを登録します。

CAPTCHA を有効にする

Azure portal にサインインします。
複数のテナントにアクセスできる場合、上部のメニューの [設定] アイコンを選択し、[ディレクトリとサブスクリプション] メニューからお使いの Azure AD B2C テナントに切り替えます。
左側のメニューで、 Azure AD B2C を選択します。または、[ すべてのサービス ] を選択し、 Azure AD B2C を検索して選択します。
ユーザーフローを選択します。
CAPTCHA を有効にするユーザーフローを選択します。たとえば、 B2C_1_signinsignup。
[プロパティ] を選択します。
CAPTCHA (プレビュー) で、CAPTCHA を有効にするフロー (CAPTCHA の有効化 - サインアップなど) を選択します。
保存を選択します。

ユーザーフローをテストする

「ユーザーフローのテスト」の手順を使用して、選択したフローに対して CAPTCHA が有効になっていることをテストして確認します。 CAPTCHA の種類, つまりビジュアルまたはオーディオを選択すると, 画面に表示されるか音声で読み上げられる文字を入力するよう求められます。

カスタムポリシーで CAPTCHA を有効にするには、既存のカスタムポリシーファイルを更新する必要があります。既存のカスタムポリシーファイルがない場合は、 .zip ファイルをダウンロードするか、 https://github.com/Azure-Samples/active-directory-b2c-custom-policy-starterpackからリポジトリを複製します。この記事では、 /Display Controls Starterpack/LocalAccounts/ フォルダー内の XML ファイルを更新します。

要求を宣言する

カスタムポリシーで CAPTCHA を有効にするには、さらに要求が必要です。

VS Code で、 TrustFrameworkBase.XML ファイルを開きます。

ClaimsSchema セクションで、次のコードを使用して要求を宣言します。

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

表示コントロールを構成する

カスタムポリシーに対して CAPTCHA を有効にするには、 CAPTCHA 表示コントロールを使用します。 CAPTCHA ディスプレイコントロールは CAPTCHA イメージを生成してレンダリングします。

TrustFrameworkBase.XML ファイルで、DisplayControls要素を見つけ、次の表示コントロールを子要素として追加します。 DisplayControls要素がまだない場合は、要素を追加します。

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

CAPTCHA 技術プロファイルを構成する

Azure AD B2C CAPTCHA 技術プロファイルは、CAPTCHA チャレンジを検証します。この技術プロファイルでは、CAPTCHA コードを生成したり、構成方法に応じて確認したりできます。

TrustFrameworkBase.XML ファイルで、ClaimsProviders要素を見つけ、次のコードを使用してクレームプロバイダーを追加します。

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

GetChallenge 操作で構成した CAPTCHA 技術プロファイルは、CAPTCHA チャレンジ文字列を生成して表示します。 VerifyChallenge を使用して構成した CAPTCHA 技術プロファイルは、ユーザーが入力したチャレンジ文字列を検証します。

コンテンツ定義のページレイアウトを更新する

さまざまなページレイアウトでは、次のページレイアウトバージョンを使用します。

ページのレイアウト	ページレイアウトのバージョン範囲
セルフアサート	>=2.1.33
ユニファイドSSP	>=2.1.21
多要素	>=1.2.19

例:

TrustFrameworkBase.XML ファイルの ContentDefinitions 要素の下で、Id="api.localaccountsignup" を持つコンテンツ定義を見つけ、次のコードに示すように DataUri を更新します。

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

セルフアサートされたページレイアウトバージョンを 2.1.27 として指定します。

技術プロファイルと表示コントロールを構成したら、CAPTCHA を有効にするフローを指定できます。

サインアップまたはサインインフローで CAPTCHA を有効にするには、次の手順に従います。

SignUpOrSignIn などのサインアップサインインユーザー体験を調べて、サインアップまたはサインインエクスペリエンスを表示するセルフアサート技術プロファイルを特定します。
LocalAccountSignUpWithLogonEmail などの技術プロファイルで、次のコードに示すように、メタデータキーと表示要求エントリを追加します。

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

表示要求エントリは、前に構成した表示コントロールを参照します。

MFA フローで CAPTCHA を有効にする

MFA フローで CAPTCHA を有効にするには、2 つの技術プロファイル (セルフアサート技術プロファイルと電話要素技術プロファイル) で更新を行う必要があります。

SignUpOrSignIn などのサインアップサインインユーザー体験を調べて、サインアップまたはサインインフローを担当するセルフアサート技術プロファイルと電話要素技術プロファイルを特定します。
どちらの技術プロファイルでも、次のコードに示すように、メタデータキーと表示要求エントリを追加します。

<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 機能フラグを有効にする

サインアップ、サインイン、または MFA 中に CAPTCHA を適用するには、各シナリオの機能フラグを有効にする技術プロファイルを追加し、ユーザー体験で技術プロファイルを呼び出す必要があります。

TrustFrameworkBase.XML ファイルで、ClaimsProviders要素を見つけ、次のコードを使用してクレームプロバイダーを追加します。

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

CAPTCHA シナリオに応じて、 DefaultValue を true または false に設定する
機能フラグ技術プロファイルをユーザー体験に追加し、オーケストレーション手順の残りの部分の順序を更新します。

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

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

カスタムポリシーファイルをアップロードする

「ポリシーのアップロード」の手順を使用して、カスタムポリシーファイルをアップロードします。

カスタムポリシーをテストする

「カスタムポリシーをテストする」の手順を使用して、選択したフローで CAPTCHA が有効になっていることをテストして確認します。 CAPTCHA の種類, つまりビジュアルまたはオーディオを選択すると, 画面に表示されるか音声で読み上げられる文字を入力するよう求められます。

注

サインアップのみのユーザーフローで MFA ステップに CAPTCHA を追加することはできません。
MFA フローでは、選択した MFA メソッドが SMS または電話、SMS のみ、または電話呼び出しのみである場合に CAPTCHA が適用されます。

CAPTCHA 技術プロファイルを定義する方法について説明します。
CAPTCHA 表示コントロールを構成する方法について説明します。

次の方法で共有

Azure Active Directory B2C で CAPTCHA を有効にする

[前提条件]

CAPTCHA を有効にする

ユーザー フローをテストする

要求を宣言する

表示コントロールを構成する

CAPTCHA 技術プロファイルを構成する

コンテンツ定義のページ レイアウトを更新する

サインアップまたはサインイン フローで CAPTCHA を有効にする

MFA フローで CAPTCHA を有効にする

CAPTCHA 機能フラグを有効にする

カスタム ポリシー ファイルをアップロードする

カスタム ポリシーをテストする

関連コンテンツ

フィードバック

その他のリソース

ユーザーフローをテストする

コンテンツ定義のページレイアウトを更新する

サインアップまたはサインインフローで CAPTCHA を有効にする

カスタムポリシーファイルをアップロードする

カスタムポリシーをテストする