コアコンポーネントに基づく AEM アダプティブフォームでの Google reCAPTCHA の使用

最終更新日： 2025年2月19日
  • 適用対象：
  • Experience Manager as a Cloud Service

作成対象：

  • ユーザー
  • 開発者
適用先記事リンク
コアコンポーネントに基づくアダプティブフォームこの記事
基盤コンポーネントに基づくアダプティブフォームここをクリックしてください

CAPTCHA（コンピュータと人間を区別する完全に自動化された公開チューリングテスト）は、人間と自動化されたプログラム／ボットを区別するために、オンライントランザクションで一般的に使用されるプログラムです。テストを行ってユーザーの反応を評価し、サイトを使用しているのが人間かボットかを判断します。テストが失敗した場合の続行を防ぎ、ボットによるスパムの投稿や悪意のある目的を防止することで、オンライントランザクションの安全性を高めます。

AEM Forms as a Cloud Service は、次の CAPTCHA ソリューションをサポートしています。

AEM Forms コアコンポーネントと Google による reCAPTCHA サービスとの接続

フォームの作成者は、Google による reCAPTCHA サービスを使用してアダプティブフォームに CAPTCHA を実装できます。サイトを保護する高度な CAPTCHA 機能を提供します。reCAPTCHA の仕組みについて詳しくは、Google reCAPTCHA を参照してください。これを使用して、フォームの送信時に CAPTCHA の課題を提示します。AEM Forms as a Cloud Service は、Google reCAPTCHA v2 および reCAPTCHA Enterprise をサポートしています。その他のバージョンはサポートされません。また、アダプティブフォームの CAPTCHA は、AEM Forms アプリのオフラインモードではサポートされていません。

要件に基づいて、reCAPTCHA サービスを設定して、次を有効にすることができます。

reCAPTCHA Enterprise の設定

  1. を作成または選択します。 Google Cloud プロジェクト を有効にします。 reCAPTCHA Enterprise API.

  2. の取得 プロジェクト ID をクリックし、 API キー および web サイトのサイトキー.

  3. クラウドサービス用の設定コンテナを作成します。

    1. ツール／一般／設定ブラウザー ​に移動します。

    2. 次の手順に従って、フォルダーを選択するか、フォルダーを作成し、クラウド設定用にフォルダーを有効にします。

      1. 設定ブラウザーで、フォルダーを選択して「プロパティ」をクリックします。
      2. 設定プロパティダイアログで、「クラウド設定」を有効にします。
      3. 「保存して閉じる」を選択して設定内容を保存し、ダイアログを閉じます。

  4. のクラウドサービスを設定しますreCAPTCHA Enterprise。

    1. Experience Manager オーサーインスタンスで、 tools-1 ／クラウドサービス ​に移動します。
    2. 「reCAPTCHA」を選択します。設定ページが表示されます。作成した設定コンテナを選択し、「作成」をクリックします。
    3. としてバージョンを選択し、reCAPTCHA Enterprise名前、reCAPTCHA Enterprise サービスのプロジェクト ID、サイトキーおよび API キー（手順 2 および で取得）を指定します。
    4. キーのタイプを選択します。キーのタイプは、Google Cloud プロジェクトで設定したサイトキー（チェックボックスサイトキー ​または​ スコアベースのサイトキー ​など）と同じにする必要があります。
    5. を指定します。 0 ～ 1 の範囲のしきい値スコア. スコアがしきい値以上になると、人間のインタラクションを識別し、それ以外の場合はボットのインタラクションとみなされます。
    6. 「作成」を選択して、クラウドサービス設定を作成します。

reCAPTCHA Enterprise サービスを有効にすると、アダプティブフォームで使用できるようになります。アダプティブフォームでの CAPTCHA の使用を参照してください。

Google reCAPTCHA v2 の設定

  1. Google から reCAPTCHA API キーペアを取得します。これには、サイトキー ​と​ 秘密鍵 ​が含まれます。

    Google の Web サイトで Google reCAPTCHA 設定を作成して、reCAPTCHA キーを取得する

  2. 設定コンテナを AEM Forms as a Cloud Service 環境に作成します。設定コンテナには、AEM を外部サービスに接続するために使用されるクラウド設定が格納されます。Google で AEM Forms 環境を reCAPTCHA サービスに接続するための設定コンテナを作成および設定するには、次の手順を実行します。

    1. AEM Forms as a Cloud Service インスタンスを開きます。

    2. ツール／一般／設定ブラウザー ​に移動します。設定ブラウザーでは、次の操作を実行できます。

    3. 既存のフォルダーを選択するか、フォルダーを作成します。フォルダーを作成して、そのフォルダーの「クラウド設定」オプションを有効にしたり、既存のフォルダーの「クラウド設定を有効にする」オプションを有効にしたりできます。

      • フォルダーを作成し、それに対して「クラウド設定」オプションを有効にするには、次の手順を実行します。

        1. 設定ブラウザーで「作成」をタップします。
        2. 設定作成ダイアログで、名前とタイトルを指定し、「クラウド設定」オプションを選択します。
        3. 「作成」をクリックします

      • 既存のフォルダーに対して「クラウド設定」オプションを有効にするには：

        1. 設定ブラウザーで、フォルダーを選択して「プロパティ」を選択します。
        2. 設定プロパティダイアログで、「クラウド設定」を有効にします。
        3. 「保存して閉じる」を選択して設定内容を保存し、ダイアログを閉じます。

  3. Cloud Service を設定：

    1. AEM オーサーインスタンスで、 tools-1 ／クラウドサービス ​に移動し、「reCAPTCHA」を選択します。
    2. 前の節で作成または更新した設定コンテナを選択します。「作成」を選択します。
    3. reCAPTCHA サービス用（手順 1 で取得）に​ タイトル、名前、サイトキー ​および 秘密鍵 ​を指定します。「作成」を選択します。

    AEM Forms 環境を Google の reCAPTCHA サービスに接続するよう Cloud Service を設定

    reCAPTCHA サービスを設定すると、アダプティブフォームで使用できるようになります。詳しくは、アダプティブフォームでの Google reCAPTCHA の使用を参照してください。

アダプティブフォームでの Google reCAPTCHA の使用

アダプティブフォームで Google reCAPTCHA を使用

アダプティブフォームで reCAPTCHA を使用するには：

  1. AEM Forms as a Cloud Service インスタンスを開きます。

  2. Forms／フォームとドキュメント ​に移動します。

  3. アダプティブフォームを選択し、「プロパティ」を選択します。「設定コンテナ」オプションで AEM Forms を Google の reCAPTCHA サービスに接続するクラウド設定を含む設定コンテナを選択し、「保存して閉じる」を選択します。

    このような設定コンテナがない場合は、Googleによる reCAPTCHA サービスを使用した AEM Forms 環境の接続の節を参照して、設定コンテナを作成する方法を確認してください。

    設定コンテナの選択

  4. アダプティブフォームを選択し、「編集」を選択します。アダプティブフォームエディターでアダプティブフォームが開きます。

  5. コンポーネントブラウザーから アダプティブフォーム reCAPTCHA コンポーネントをアダプティブフォームにドラッグ＆ドロップします。

    メモ
    • Google reCAPTCHA 検証は時間的制約があり、数分で期限切れになります。そのため、アダプティブフォーム reCAPTCHA コンポーネントを​ 送信 ​ボタンのすぐ前に配置することをお勧めします。

  6. アダプティブフォーム reCAPTCHA コンポーネントを選択し、プロパティ プロパティアイコン アイコンを選択します。プロパティダイアログが開きます。次の必須プロパティを指定します。

    • 名前： フォームコンポーネントは、フォーム内とルールエディター内の両方で一意の名前で簡単に識別できますが、名前にスペースや特殊文字を含めることはできません。

    • タイトル： Captcha ウィジェットのタイトルを指定します。デフォルト値は Captcha です。タイトルを表示しない場合は、「タイトルを非表示にする」を選択します。タイトルをリッチテキスト形式で編集するには、「タイトルのリッチテキストを許可」を選択します。また、タイトルを​ 非バインドフォーム要素 ​としてマークすることもできます。

    • Captcha 設定： ​フォームの Google reCAPTCHA ダイアログを表示するには、reCAPTCHA Enterprise または reCAPTCHA v2 の設定ドロップダウンから設定を選択します。

      1. 次を選択した場合、 reCAPTCHA Enterprise バージョンの場合、キーのタイプは チェックボックス または スコアベース ​の場合、設定時の選択内容に基づきます web サイトのサイトキー:

        メモ
        • クラウド設定で、 キーの種類 as チェックボックス ​を指定した場合、captcha の検証が失敗すると、カスタマイズされたエラーメッセージがインラインメッセージとして表示されます。
        • クラウド設定で、 キーの種類 as スコアベース ​を指定した場合、カスタマイズされたエラーメッセージは、captcha の検証が失敗した場合にポップアップメッセージとして表示されます。

      2. サイズは、「標準」と「コンパクト」から選択できます。

      メモ
      • 同様の目的で、環境内に複数のクラウド設定を作成することができます。そのため、サービスは慎重に選択してください。サービスが表示されない場合は、Googleによる reCAPTCHA サービスを使用した AEM Forms 環境の接続で、AEM Forms 環境と Google の reCAPTCHA サービスを接続する Cloud Service を作成する方法を参照してください。

    • Captcha サイズ：「Google reCAPTCHA チャレンジ」ダイアログの表示サイズを選択できます。「コンパクト」オプションを選択すると小さいサイズ、「標準」オプションを選択すると比較的大きなサイズの Google reCAPTCHA チャレンジダイアログを表示できます。
      次を選択した場合、 reCAPTCHA v2 バージョン：

      1. reCAPTCHA ウィジェットのサイズを、「標準」または「コンパクト」から選択します。
      2. また、「非表示 option to show the CAPTCHA chall」オプションを使用して、疑わしいアクティビティの場合にのみ CAPTCHA チャレンジを表示できます。

    アダプティブフォーム上で reCAPTCHA サービスが有効になります。フォームをプレビューして、CAPTCHA が機能していることを確認できます。以下に表示されている reCAPTCHA による保護 ​バッジが保護されたフォームに表示されます。

    reCAPTCHA バッジによって保護された Google

  7. 「完了」を選択します。

    reCAPTCHA で保護された がアダプティブフォームに表示されます。Google reCAPTCHA サービスを使用するように設定されているすべてのアダプティブフォームに表示されます。

    現在、フォームの入力者は Google reCAPTCHA サービスによって提供される課題を正常にクリアした正規のフォームのみを送信できます。