Google reCAPTCHA v3の導入方法！登録やContact Form7の設定方法を解説

スパム対策に有効な手段は、GoogleのreCAPTCHA認証を導入することです。そして、GoogleのreCAPTCHAには、v2とv3があります。また、サイト内にお問い合わせフォームを設置する場合には、Contact Form7を設定する必要があります。

そこでここでは、GoogleのreCAPTCHA認証とは何かや、GoogleのreCAPTCHA v3認証の導入方法について解説していきます。

スパム対策に有効な手段は、GoogleのreCAPTCHA v3認証を導入することだと言われていますが、GoogleのreCAPTCHA v3認証とは一体どのようなものなのでしょうか。そこでここでは、GoogleのreCAPTCHA v3認証とはどういったサービスなのかを解説していきます。

GoogleのreCAPTCHA認証とは、ログイン画面やお問い合わせフォームなどでロボットと人間を見分けるシステムのことです。このreCAPTCHA認証とは、ロボットと人間を見分けることで、サイトへの不正アクセスを防止するためのシステムになっています。

そして、reCAPTCHA認証によって不正アクセスを防止することで、運営しているサイトを守ることができるのです。よくあるのが、サイトのお問い合わせフォームからスパムメールが大量に届くことです。よって、そういったスパムを防ぐシステムつまりreCAPTCHA認証を設置することが重要になってきます。

GoogleのreCAPTCHA認証とは、ログイン画面やお問い合わせフォームなどでよく表示されている「私はロボットではありません」という画面表示のことです。このreCAPTCHA認証画面である、「私はロボットではありません」にチェックを入れることで、ロボットと人間を見分けるようになっているのです。

また、reCAPTCHA認証画面には「私はロボットではありません」以外にも、「〇〇の画像を選択してください」と表示されて、指定した画像にチェックを入れる場合もあります。

GoogleのreCAPTCHA認証にはv2とv3がありますが、違いとは一体どのようなものなのでしょうか。まず、reCAPTCHA v2認証とは、ログイン画面やお問い合わせフォームなどで「私はロボットではありません」にチェックを入れることで、ロボットと人間を見分けるようになってます。

また、reCAPTCHA v2認証には、「〇〇の画像を選択してください」と表示されて、指定した画像にチェックを入れることでロボットと人間を見分けることもあります。

次に、reCAPTCHA v2認証に対して、reCAPTCHA v3認証とは、ログイン画面やお問い合わせフォームなどで「私はロボットではありません」という画面は表示されません。また、reCAPTCHA v2認証のように、「〇〇の画像を選択してください」という画面も表示されません。

なぜなら、reCAPTCHA v2認証とは異なり、reCAPTCHA v3認証では、サイトに訪れたユーザーの行動を「スコア」として算出します。そして、算出したスコアをベースとして、ロボットと人間を見分けるようになっているのです。

このように、reCAPTCHA v2とv3ではユーザーが操作するか/しないかの違いがあります。reCAPTCHA v2では、ユーザーがチェックを入れないといけないため、多少の煩わしさが生じてしまいます。しかし、reCAPTCHA v3ではチェックをしなくても自動的にスコアによって判定されるのでストレスがありません。

reCAPTCHA v3認証の導入方法について解説していきます。

reCAPTCHA v3認証の管理画面では、リクエスト数や、不審なトラフィックがあったかどうかをすぐに確認できるようになっています。

reCAPTCHA v3認証の導入/登録方法①は、新規で登録することです。reCAPTCHA v3認証の導入方法/登録手順は、まず「https://www.google.com/recaptcha/about/」にアクセスして、reCAPTCHA v3認証の登録画面を開きます。

reCAPTCHA v3認証の登録画面を開いたら、「v3 管理コンソール」をクリックして、管理画面を開きます。

reCAPTCHA v3認証の導入/登録方法②は、キーを取得することです。reCAPTCHA v3認証の管理画面を開いたら、キーを取得していきます。reCAPTCHA v3のキーを取得する方法は、下に表示してある赤枠内に、必要な項目を入力していきます。

• ラベル:管理画面で表示される名称になりますので、自分が分かりやすい「表示名」を入力してください。
• reCAPTCHA タイプ:「reCAPTCHA v3」にチェックを入れます。
• ドメイン:reCAPTCHA v3を埋込む「ドメイン」を入力します。
• reCAPTCHA 利用条件に同意する:チェックを入れます。
• アラートをオーナーに送信する:チェックを入れます。
• 「送信」をクリックします。

reCAPTCHA v3認証の管理画面で登録/必要項目を入力し、送信ボタンをクリックすると上のような画面が表示されて、reCAPTCHA v3のサイトキーとシークレットキーが表示されます。

reCAPTCHA v3認証のサイトキーとシークレットキーは、「サイトキーをコピーする」と「シークレットキーをコピーする」をクリックして、メモ帳などに貼り付けて保存しておきましょう。

reCAPTCHA v3認証の導入/登録方法③は、フォームの実装/HTMLへのreCAPTCHAを埋め込みを実行することです。reCAPTCHA v3認証の登録ができたら、次はフォームの実装/HTMLへreCAPTCHA v3認証の埋め込みを行っていきます。

フォームに埋め込むのは、「<script src="https://www.google.com/recaptcha/api.js"=(サイトキーを入力)></script>」になります。サイトキーのところには、コピーしておいた「サイトキー」を入力していください。

次に、フォームに埋め込むのは、「<input type="hidden" name="recaptchaToken" id="recaptchaToken">」です。埋め込む箇所は、上に表示してある画像を参考にしてください。

reCAPTCHA v3認証の導入/登録方法④は、サーバーサイドの実装/プログラム照合チェック処理の埋め込みを実行することです。reCAPTCHA v3の登録/フォームへのreCAPTCHAの埋め込みができたら、サーバーサイドの実装/プログラム照合チェック処理の埋め込みを行っていきます。

埋め込むのは、上の画面のような内容になっています。そして、reCAPTCHA v3認証のシークレットキーのところには、コピーしておいた「シークレットキー」を入力し、トークンコードのところには、HTMLからの「トークンコード」を入力します。

ここまでは、reCAPTCHA v3認証とは何かや、reCAPTCHA v3認証の導入方法について紹介しました。しかし、そのままでは設定したサイトの画面右下に、reCAPTCHA v3認証のアイコンが表示されてしまいます。サイトの画面右下に「TOPに戻るボタン」を設置している場合は、reCAPTCHA v3認証のアイコンと被ってしまうためどうしても邪魔になります。

そこでここでは、reCAPTCHA v3認証のアイコンの表示を消す方法について解説していきます。まずは、Google公認のreCAPTCHA v3認証のアイコンの表示を消す方法について紹介していきます。Google公認のreCAPTCHA v3認証のアイコンの表示を消す方法は、以下の文言を記載し、ソースコードをCSSに追加してください。

This site is protected by reCAPTCHA and the Google     <a href="https://policies.google.com/privacy">Privacy Policy</a> and     <a href="https://policies.google.com/terms">Terms of Service</a> apply.

reCAPTCHA v3認証のアイコンの表示を消す方法には、CSS追記で非表示にする方法もあります。CSS追記で非表示にする方法は、次の文言をCSSへ追加してください。

.grecaptcha-badge { visibility: hidden; }

ここまでは、reCAPTCHA v3認証の登録方法や導入方法について解説しました。しかし、「WordPress」であればContact Form 7の設定をすれば簡単にreCAPTCHA v3認証の導入ができます。

Contact Form 7の設定には、reCAPTCHA v3認証の管理画面で取得した「サイトキー」と「シークレットキー」を設定するだけです。そこでここでは、Contact Form 7の設定方法について解説していきます。

WordPressで、お問い合わせフォームを設置する場合は、Contact Form7のプラグインをインストールする必要があります。Contact Form7のプラグインとは、お問い合わせフォーム設置するための拡張機能のとをいいます。まだ、Contact Form7のプラグインをインストールしていない場合は、インストールしましょう。

Contact Form 7のプラグインをインストールする方法は、「WordPress」を開いて、ダッシュボードにある「プラグイン」→「新規追加」をクリックします。そうすると、画面左上に検索ボックスが表示されるので、そこに「Contact Form7」と入力します。

そうすれば、拡張機能の一覧が表示されるので、その中から「Contact Form7」のところにある「今すぐインストール」をクリックします。Contact Form7のインストールが完了したら、「有効化」をクリックして、拡張機能を有効に設定します。次に、ダッシュボードにある「お問い合わせ」→「新規追加」をクリックして、フォームを作成していきます。

フォームには、あらかじめ「名前」/「メールアドレス」/「題名」/「メッセージ本文」の項目が設定されています。そのままの内容で良い場合は、「保存」をクリックします。あとは、フォームの上部に表示されるいる「コード」をコピーして、追加したいページに追加します。

ここまでで、Contact Form7のインストールとお問い合わせフォームの設置は完了になり、reCAPTCHAの設定を行っていきます。

Contact Form7のプラグインをインストールし、お問い合わせフォームの設置をしたら、reCAPTCHA v3認証の設定を行っていきます。reCAPTCHA v3認証の設定方法は、「WordPress」を開いて、ダッシュボードにある「お問い合わせ」→「インテグレーション」をクリックします。次に、reCAPTCHAのところにある「インテグレーションのセットアップ」をクリックします。

そうすると、reCAPTCHAの設定画面が表示されるので、reCAPTCHA v3認証の管理画面で取得した「サイトキー」と「シークレットキー」を入力します。reCAPTCHA v3認証の管理画面で取得した「サイトキー」と「シークレットキー」を入力したら、「変更の保存」をクリックします。そうすれば、reCAPTCHA v3認証が有効になります。

スパム対策に有効な手段は、GoogleのreCAPTCHA認証を導入することだと言われています。そして、GoogleのreCAPTCHAには、v2とv3があります。

しかし、reCAPTCHA v2では、ユーザーがチェックを入れる手間かかることに対して、reCAPTCHA v3ではチェックをしなくても自動的にスコアによって判定されるようになっています。そんな便利なreCAPTCHA v3を、是非この機会に導入してサイトのセキュリティを強化しましょう。