ドキュメントCommerce管理システムガイド

Google reCAPTCHA

Last update: Sun Jul 14 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

作成対象：

  • 初心者
  • 中級
  • 管理者

Google reCAPTCHA は、コンピューター（または「ボット」）ではなく人間が web サイトとやり取りしていることを確認します。 標準のAdobe CommerceやMagento Open SourceCAPTCHA とは異なり、Google reCAPTCHA は、様々な表示オプションおよび表示方法を使用してセキュリティを強化します。 追加の web サイトトラフィック情報は、Google reCAPTCHA アカウントのダッシュボードで確認できます。

Google reCAPTCHA は、管理者とストアフロント用に個別に設定されます。

  • 管理者の場合、Google reCAPTCHA は ログインページで、またユーザーがパスワードリセットをリクエストしたときに使用できます。 標準のCommerceCAPTCHA も有効になっている場合は、Google reCAPTCHA を問題なく同時に使用できます。

  • ストアフロントでは、Google reCAPTCHA を使用して、 カスタマーアカウントにサインインしたり、 お問い合わせページからメッセージを送信したり、他の多くのストアフロントの場所で使用したりできます。

    Google reCAPTCHA - カスタマーログイン {width="700" modal="regular"}

Google reCAPTCHA は、以下のようないくつかの方法で実装できます。

  • reCAPTCHA v3 非表示 - アルゴリズムを使用して、ユーザーのインタラクションを評価し、スコアに基づいて、ユーザーが人間である可能性を判断します。

  • reCAPTCHA v2 Invisible - ユーザーの操作なしでバックグラウンド検証を実行します。 ユーザーと顧客は自動的に検証されますが、課題を完了するには特定の画像を選択する必要がある場合があります。

  • reCAPTCHA v2 （「私はロボットではありません」） — 「私はロボットではありません チェックボックスでリクエストを検証 ます。

IMPORTANT
Google reCAPTCHA を設定する前に、PHP.ini ファイルに次の設定が含まれていることを確認してください。allow_url_fopen = 1 これには、開発者の支援が必要になる場合があります。 インストールガイドの 必須の PHP 設定を参照してください。

手順 1:Google reCAPTCHA キーの生成

Google reCAPTCHA を有効にするには、1 組の API キーが必要です。 これらのキーは、reCAPTCHA サイトから無料で取得できます。 キーを生成する前に、使用する reCAPTCHA のタイプを知っておく必要があります。

  1. Google reCAPTCHA ページを開き、アカウントにログインします。

  2. Label：内部参照用のキーを識別する名前を入力します。

    Adobe CommerceまたはMagento Open Sourceのインストールで使用される reCAPTCHA タイプごとに 1 セットのキーが必要です。 例：Commerce Invisible

  3. reCAPTCHA type：使用する方法を選択します。

    • reCAPTCHA v3 非表示
    • reCAPTCHA v2 非表示
    • reCAPTCHA v2 （"I am not a robot"）

  4. Domain: ストアのドメインを入力します。 例：mystore.com

    異なるドメインを持つ複数のストアがある場合は、各ドメインを別々の行に入力します。

    • ストアドメインとサブドメインを追加します。
    • テストの必要に応じて、localhost、その他のローカル VM ドメイン、ステージングドメインを追加できます。

  5. Accept the reCAPTCHA Terms of Service すチェックボックスを選択します。

  6. （オプション）「Send alerts to owners」チェックボックスをオンにすると、Googleで問題や疑わしいトラフィックが検出された場合に通知が送信されます。

  7. Submit をクリックして登録を完了し、キーを受け取ります。

    note important
    IMPORTANT
    すべてのキーがすべてのタイプの reCAPTCHA に適用できるわけではなく、適用を誤ると、予期しない動作が発生する可能性があります。 例えば、「I'm not a robot」用に生成されたGoogle reCAPTCHA キーは、reCAPTCHA v2 Invisible では機能せず、reCAPTCHA が有効になっている場合は機能をブロックする可能性があります。

手順 2：管理者用のGoogle reCAPTCHA の設定

  1. 管理者アカウントにログインします。

  2. 管理者サイドバーで、Stores/Settings/Configuration ​に移動します。

  3. 右上隅の Store View を Default Config に設定します。

  4. 左側のパネルで「Security」を展開し、「Google reCAPTCHA Admin Panel」をクリックします。

    note note
    NOTE
    設定する各フィールドの「Use system value」チェックボックスをオフにします。

  5. reCAPTCHA v2 (“I am not a robot”) ​を使用するには、「reCAPTCHA v2 (“I am not a robot”)」セクションを展開して、次の手順を実行します。

    • Google API Website Key:Google reCAPTCHA アカウントの登録時にこの reCAPTCHA タイプ用に作成された web サイトキーを入力します。

    • Google API Secret Key:Google reCAPTCHA アカウントに関連付けられている秘密鍵を入力します。

    • Size：表示するGoogle reCAPTCHA ボックスのサイズを選択します。 オプション：Normal (default) / Compact

    • Theme しくは、Google reCAPTCHA ボックスのスタイル設定に使用するテーマを選択します。 オプション：Light Theme (default) / Dark Theme

    • Language Code しくは、2 文字のコードを入力して Google reCAPTCHA テキストおよびメッセージングで使用される言語を指定します。

    reCAPTCHA v2 - 「私はロボットではありません」 {width="600" modal="regular"}

  6. reCAPTCHA v2 Invisible ​を使用するには、「reCAPTCHA v2 Invisible」セクションを展開して、次の手順を実行します。

    • Google API Website Key:Google reCAPTCHA アカウントの登録時にこの reCAPTCHA タイプ用に作成された web サイトキーを入力します。

    • Google API Secret Key:Google reCAPTCHA アカウントに関連付けられている秘密鍵を入力します。

    • Invisible Badge Position しくは、各ページで使用するバッジの位置を選択します。 オプション：Inline/Bottom Right/Bottom Left

    • Theme しくは、Google reCAPTCHA ボックスのスタイル設定に使用するテーマを選択します。 オプション：Light Theme (default) / Dark Theme

    • Language Code しくは、（Google reCAPTCHA テキストおよびメッセージングで使用される言語 を指定する 2 文字のコードを入力しす。

    reCAPTCHA v2 非表示 {width="600" modal="regular"}

  7. reCAPTCHA v3 Invisible ​を使用するには、「reCAPTCHA v3 Invisible」セクションを展開して、次の手順を実行します。

    • Google API Website Key:Google reCAPTCHA アカウントの登録時にこの reCAPTCHA タイプ用に作成された web サイトキーを入力します。

    • Google API Secret Key:Google reCAPTCHA アカウントに関連付けられている秘密鍵を入力します。

    • ユーザーインタラクションが潜在的なリスクとしてフラグ付けされるタイミングを識別する Minimum Score Threshold を入力します。1.0 は一般的なユーザーインタラクションで、0.0 はボットである可能性があります。 デフォルト：0.5

    • Invisible Badge Position しくは、各ページで使用する位置を選択します。 オプション：Inline/Bottom Right/Bottom Left

    • Theme しくは、Google reCAPTCHA ボックスのスタイル設定に使用するテーマを選択します。 オプション：Light Theme (default) / Dark Theme

    • Language Code しくは、（Google reCAPTCHA テキストおよびメッセージングで使用される言語 を指定する 2 文字のコードを入力しす。

    reCAPTCHA v3 非表示 {width="600" modal="regular"}

  8. 「reCAPTCHA Validation Failure Messages」を展開し、検証に失敗した場合や検証を完了できない場合に管理者に表示されるメッセージを入力します。

    reCAPTCHA エラーメッセージ {width="600" modal="regular"}

  9. 「Admin Panel」セクションを展開し、必要に応じて以下を設定します。

    • 管理者のログインページに使用する reCAPTCHA タイプに Enable for Login を設定します。

    • パスワードリセットリクエストに使用する reCAPTCHA タイプに Enable for Forgot Password を設定します。

    reCAPTCHA 管理オプション {width="600" modal="regular"}

手順 3：ストアフロントのGoogle reCAPTCHA の設定

  1. Security ​の下の左パネルで、「Google reCAPTCHA Storefront」を選択します。

  2. ストアフロントで使用する reCAPTCHA タイプごとに、セクションを完了します。

    各 reCAPTCHA タイプのオプションについて詳しくは、手順 2：管理者用のGoogle reCAPTCHA の設定 を参照してください。

  3. reCAPTCHA Validation Failure Messages を展開し、検証が失敗した場合や完了できなかった場合にストアフロントに表示されるメッセージを入力します。

  4. 「Storefront」セクションを展開します。

    note note
    NOTE
    設定する各フィールドの「Use system value」チェックボックスをオフにします。

  5. 各ストアフロントの場所フィールドを、使用するように設定した reCAPTCHA のタイプに設定します。

    • Enable for Customer Login
    • Enable for Forgot Password
    • Enable for Create New Customer Account
    • Enable for Edit Customer Account
    • Enable for Create New Company Account Adobe Commerce B2B （Adobe Commerce B2B でのみ使用可能）
    • Enable for Contact Us
    • Enable for Product Review
    • Enable for Newsletter Subscription
    • Enable for Gift Card Adobe Commerce （Adobe Commerceのみ）
    • Enable for Invitation Create Account
    • Enable for Send To Friend
    • Enable for Checkout/Placing Order
    • Enable for Wishlist Sharing
    • Enable for Coupon Codes
    • Enable for PayPal PayflowPro payment form

    ストアフロントオプションの設定 {width="600" modal="regular"}

手順 4：設定を保存する

  1. 設定が完了したら、「Save Config」をクリックします。

  2. ワークスペースの上部にあるメッセージで、「Cache Management」をクリックし、無効な各キャッシュを更新します。

recommendation-more-help
d3c62084-5181-43fb-bba6-1feb2fcc3ec1