このドキュメントでは、ウェブサイトで Cloud Armor 用 reCAPTCHA を統合する方法について説明します。
統合を完了するには、Cloud Armor 用 reCAPTCHA の 1 つ以上の機能を実装し、Cloud Armor セキュリティ ポリシーを構成する必要があります。
始める前に
reCAPTCHA Enterprise API を有効にします。
API を有効にするために必要なロール
API を有効にするには、
serviceusage.services.enable権限が必要です。プロジェクトを作成した場合は、オーナーロール(roles/owner)を介してこの権限がすでに付与されている可能性があります。それ以外の場合は、Service Usage 管理者ロール(roles/serviceusage.serviceUsageAdmin)を介してこの権限を取得できます。ロールを付与する方法をご覧ください。ウェブサイトを保護するために Cloud Armor 用 reCAPTCHA の機能を実装する方法を計画します。
- ユースケースに最も適した WAF 機能を 1 つ以上選択します。
- 保護するページと、そのページで実装する Cloud Armor 機能のタイプを特定します。
Cloud Armor 用 reCAPTCHA の機能を実装する
要件に応じて、1 つのアプリケーションで Cloud Armor 用 reCAPTCHA の 1 つ以上の機能を使用できます。
1 つ以上の機能を使用する場合は、これらの機能ごとに reCAPTCHA キーを作成し、アプリケーションで使用する必要があります。たとえば、reCAPTCHA アクション トークンと reCAPTCHA による確認ページを使用する場合は、アクション トークンキーと確認ページキーを作成してアプリケーションで使用する必要があります。
reCAPTCHA アクション トークンを実装する
アクション トークンを生成するには、reCAPTCHA をウェブページで実行する必要があります。checkout などのユーザー アクションを保護する必要がある場合、reCAPTCHA がアクション トークンを生成したら、事前定義されたリクエスト ヘッダーにアクション トークンを添付します。デフォルトでは、アクション トークンは 30 分間有効ですが、トラフィックによって異なる場合があります。Cloud Armor がトークン属性を評価できるように、トークンが期限切れになる前にアクション トークンを事前定義されたリクエスト ヘッダーに添付する必要があります。
reCAPTCHA アクション トークンを実装するには、次の手順を実行します。
ウェブサイトのアクション トークンキーを作成します。 <0x0A
Cloud コンソール
Google Cloud コンソールで、[Google Cloud Fraud Defense] ページに移動します。
ページの上部にあるプロジェクト セレクタにリソース名が表示されていることを確認します。
プロジェクトの名前が表示されない場合は、リソース セレクタをクリックしてプロジェクトを選択します。
- [キー] タブを選択します。
- [鍵を作成] をクリックします。
- [表示名] フィールドに、キーの表示名を入力します。
- WAF 用 reCAPTCHA キーを作成するプラットフォームに応じて、適切なアクションを実行します。
- [アプリケーションの種類] で [ウェブ] を選択します。
[ドメインリスト] セクションが表示されます。
- ドメインとサブドメインの reCAPTCHA キーを保護するには、[ドメインの所有権の証明を無効にする] トグルがオフになっていることを確認します。
サイトの制限はないため、ドメインの所有権の証明の無効化はセキュリティ リスクとなります。したがって、reCAPTCHA キーは誰でもアクセスして使用できます。
-
お使いのウェブサイトのドメイン名を入力してください。
- [ドメインリスト] セクションで、[ドメインを追加] をクリックします。
- [ドメイン] フィールドにドメインの名前を入力します。
省略可: ドメインを追加するには、[ドメインを追加] をクリックし、[ドメイン] フィールドに別のドメインの名前を入力します。最大 250 個のドメインを追加できます。
ウェブサイトの場合、reCAPTCHA キーは、指定したドメインとサブドメインに固有のものです。複数のドメインからウェブサイトを提供する場合は、複数のドメインを指定できます。あるドメイン(たとえば
examplepetstore.com)を指定すると、そのサブドメイン(たとえばsubdomain.examplepetstore.com)を指定する必要はありません。
- [追加設定] で、[このキーをウェブ アプリケーション ファイアウォール(WAF)にデプロイしますか?] 切り替えをオンにします。
[機能] オプションから [アクション] を選択します。
-
省略可: [チャレンジを使用する] 切り替えをオンにします。
- [鍵を作成] をクリックします。
新しく作成された鍵は、[reCAPTCHA のキー] ページにリストされています。
gcloud
reCAPTCHA キーを作成するには、gcloud recaptcha keys create コマンドを使用します。
後述のコマンドデータを使用する前に、次のように置き換えます。
- INTEGRATION_TYPE: 統合の種類
scoreまたはcheckboxを指定します。 - DISPLAY_NAME: キーの名前。通常はサイト名です。
- DOMAIN_NAME: キーの使用を許可されたウェブサイトのドメインまたはサブドメイン。
複数のドメインをカンマ区切りのリストとして指定します。 省略可:
--allow-all-domainsを指定して、ドメインの所有権の証明を無効にします。サイトの制限はないため、ドメインの所有権の証明の無効化はセキュリティ リスクとなります。したがって、reCAPTCHA キーは誰でもアクセスして使用できます。
- WAF_FEATURE: WAF 機能の名前。
action-tokenを実行します。 - WAF_SERVICE: WAF サービス プロバイダの名前。
Cloud Armor に
CAを指定します。
gcloud recaptcha keys create コマンドを実行します。
Linux、macOS、Cloud Shell
gcloud recaptcha keys create \ --web \ --display-name=DISPLAY_NAME \ --integration-type=INTEGRATION_TYPE \ --domains=DOMAIN_NAME \ --waf-feature=WAF_FEATURE \ --waf-service=WAF_SERVICE
Windows(PowerShell)
gcloud recaptcha keys create ` --web ` --display-name=DISPLAY_NAME ` --integration-type=INTEGRATION_TYPE ` --domains=DOMAIN_NAME ` --waf-feature=WAF_FEATURE ` --waf-service=WAF_SERVICE
Windows(cmd.exe)
gcloud recaptcha keys create ^ --web ^ --display-name=DISPLAY_NAME ^ --integration-type=INTEGRATION_TYPE ^ --domains=DOMAIN_NAME ^ --waf-feature=WAF_FEATURE ^ --waf-service=WAF_SERVICE
レスポンスには、新しく作成された reCAPTCHA キーが含まれます。
REST
キーの種類と統合タイプに関する API リファレンス情報については、鍵と統合タイプをご覧ください。リクエストのデータを使用する前に、次のように置き換えます。
- INTEGRATION_TYPE: 統合の種類
scoreまたはcheckboxを指定します。 - DISPLAY_NAME: キーの名前。通常はサイト名です。
- DOMAIN_NAME: キーの使用を許可されたウェブサイトのドメインまたはサブドメイン。
複数のドメインをカンマ区切りのリストとして指定します。 省略可:
--allow-all-domainsを指定して、ドメインの所有権の証明を無効にします。サイトの制限はないため、ドメインの所有権の証明の無効化はセキュリティ リスクとなります。したがって、reCAPTCHA キーは誰でもアクセスして使用できます。
- WAF_FEATURE: WAF 機能の名前。
action-tokenを実行します。 - WAF_SERVICE: WAF サービス プロバイダの名前。
Cloud Armor に
CAを指定します。 - DEFAULT_SCORE_THRESHOLD: ポリシーベースのチャレンジ キーの場合、カスタム スコアしきい値が定義されていないときに、キーのユニバーサル チャレンジしきい値を定義します。これはプレビュー版です。
- ACTION_SCORE_THRESHOLDS: ポリシーベースのチャレンジ キーの場合、アクションと対応するしきい値スコア(0.0 ~ 1.0)を指定します。例:
login='{"scoreThreshold": "0.3"}',signup='{"scoreThreshold": "0.1"}'これはプレビュー版です。
HTTP メソッドと URL:
POST https://recaptchaenterprise.googleapis.com/v1/projects/PROJECT_ID/keys
リクエストの本文(JSON):
{ "displayName": "DISPLAY_NAME", 'wafSettings': " { "wafService": "WAF_SERVICE", "wafFeature": "WAF_FEATURE" } "webSettings": { "allowedDomains": "DOMAINS", "integrationType": "INTEGRATION_TYPE" } }リクエストを送信するには、次のいずれかのオプションを選択します。
curl
リクエスト本文を
request.jsonという名前のファイルに保存して、次のコマンドを実行します。curl -X POST \
-H "Authorization: Bearer $(gcloud auth print-access-token)" \
-H "Content-Type: application/json; charset=utf-8" \
-d @request.json \
"https://recaptchaenterprise.googleapis.com/v1/projects/PROJECT_ID/keys"PowerShell
リクエスト本文を
request.jsonという名前のファイルに保存して、次のコマンドを実行します。$cred = gcloud auth print-access-token
$headers = @{ "Authorization" = "Bearer $cred" }
Invoke-WebRequest `
-Method POST `
-Headers $headers `
-ContentType: "application/json; charset=utf-8" `
-InFile request.json `
-Uri "https://recaptchaenterprise.googleapis.com/v1/projects/PROJECT_ID/keys" | Select-Object -Expand Content次のような JSON レスポンスが返されます。
{ "name": "projects/project-id/keys/7Ldqgs0UBBBBBIn4k7YxEB-LwEh5S9-Gv6QQIWB8m", "displayName": "DISPLAY_NAME, "webSettings": { "allowAllDomains": true, "allowedDomains": [ "localhost" ], "integrationType": "SCORE", }, "wafSettings": { "wafService": "CA", "wafFeature": "ACTION_TOKEN" } }ウェブページの reCAPTCHA JavaScript を、作成したアクション トークン キーと統合します。手順については、アクション トークンキーの統合タイプに対応するドキュメントをご覧ください。
SCORE統合タイプについては、スコアベースのキーをフロントエンドに統合するをご覧ください。CHECKBOX統合タイプについては、フロントエンドで reCAPTCHA ウィジェットをレンダリングするをご覧ください。
reCAPTCHA からトークンを受信したら、次の形式の事前定義されたリクエスト ヘッダーにトークンを添付します。
X-Recaptcha-Token: value-of-your-action-token
XHR、Ajax、Fetch API などの言語および Fetch API を使用して、事前定義されたリクエスト ヘッダーにトークンを添付できます。
次のサンプル スクリプトでは、JavaScript と XHR を使用して、
executeアクションを保護し、事前定義されたリクエスト ヘッダーにトークンを添付する方法を示します。<script> src="https://www.google.com/recaptcha/enterprise.js?render=ACTION_TOKEN_KEY"></script> <script> function onSuccess(action_token) { const xhr = new XMLHttpRequest(); xhr.open('GET','YOUR_URL', false); // Attach the action-token to the predefined request header xhr.setRequestHeader("X-Recaptcha-Token", action_token); xhr.send(null); } function onError(reason) { alert('Response promise rejected: ' + reason); grecaptcha.enterprise.ready(function () { document.