Google「reCAPTCHA」を使用する

コンタクトフォームの迷惑メール、スパム対策として
Google「reCAPTCHA」を使用してみました。

GoogleCloudを使用する

先ずGoogleのアカウントが必要です。
しかし現在、Googleのアカウントだけでは「reCAPTCHA」は使用できません。
「GoogleCloud」を使用しないといけないようなのでGoogleCloudを作成します。

Google「reCAPTCHA」
https://www.google.com/recaptcha/about/
右上の「Get Started with Enterprise」から
作成したGoogleアカウントでログインします。

自動的にアカウントの「GoogleCloud」が作成されます。

この流れでGoogleCloudを作成した場合、
左メニューに「reCAPTCHA Enterprise」が表示されていると思います。

もし一度ログアウトされたりして、再ログインした場合
https://cloud.google.com/?hl=ja
GoogleCloud管理画面のナビゲーションメニュー
セキュリティ＞保護＞「reCAPTCHA Enterprise」
という位置になります。

ここでキーを作成したり編集ができます。
プラットフォームでウェブサイトを選択し
「reCAPTCHA」を使用したいサイトのドメインを追加しキーを作成します。

WPのコンタクトフォーム側の設定に必要な情報は
・サイトキー
・シークレットキー
この2つです。

なのでこの2つをこのGoogleCloud管理画面では控えておきたいのですが
サイトキーはヨシとして、シークレットキーが少しわかりずらいです。
「秘密鍵」と呼ばれています、、笑
そのままなんですが、急に純日本語でこられると逆につまずいてしまいます笑
作成した「鍵の詳細」から隠れている「秘密鍵」の情報を展開します。

詳しくはこちらをどうぞ
https://cloud.google.com/recaptcha-enterprise/docs/create-key?_ga=2.30255479.-992708925.1674107030&hl=ja

コンタクトフォーム7側の設定

・サイトキー
・シークレットキー
の情報を控えたら、今度はWPの管理画面から
コンタクトフォーム側の設定をします。
こちらは簡単です。

お問い合せ＞インテグレーション＞ reCAPTCHA
ここで、サイトキー、シークレットキー(秘密鍵)の情報を入力。
以上で設定は完了です。

Google「reCAPTCHA」の問題点

設定が完了すると
サイトの右下に「reCAPTCHA」のロゴが表示されます。

これに安心感、ブランド感というようなものを見出して「良し」とされるサイトもあると思います。
ですが逆に、余計なものを表示させたくない、ページTOPボタンと被る、など「問題」と感じるケースもあるはずです。

そんな場合は別途、ロゴを非表示にするという手間が必要です。

あと一応もう1点。
ひとつのアカウントで複数のサイトの設定ができますが
100万件/1ヶ月という無料利用枠があって、それを超えると保護解除されてしまいます。
通常ならまったく余裕で問題ないと思いますが
既にアタックを喰らっている場合などは、もしかするとこのあたりも一考された方がいいかもしれません。

reCAPTCHAのバッジ(ロゴ)を非表示にする

https://developers.google.com/recaptcha/docs/faq?hl=ja#id-like-to-hide-the-recaptcha-badge.-what-is-allowed
こちらは公式。
ですが、、

https://tanomasaki.com/recaptcha-badge-hidden/
こちらのサイト様の方がはるかに親切、丁寧に書いてくださってるのでこちらをご参照ください。

・フォームを埋め込むページにGoogle指定の一文を入れる(html)
・非表示にするcssを追加する
ざっくりいうとこの2つの作業でreCAPTCHAのロゴを非表示にすることができます。

まとめ

今回のことで以下のようなサイト様も見させてもらったんですが
現在だいぶ仕様が変わっています。
大きくは「GoogleCloud」の存在ですね。
Googleは本当に何もかもをGoogleで済ましてほしいんだなぁ、、
ということをあらためて思いました笑
そしてわかりずらい、、
まだ単純な和訳しか済んでなさそうな、というか
これからまたどんどん変わってきそうな気がします、、
いや、変わってください。
ユーザビリティわるすぎなので笑

「reCAPTCHA」自体は ver.2 → ver.3 の変化がとても大きいと思います。
これで一般的にもかなり使用率が高まるんじゃないかと思います。

reCAPTCHA　参考サイト様
https://www.one-pixel.net/blog/contact-form7-antispam/
https://kodocode.net/wordpress-plugin-contactform-secure/
https://www.synergy-marketing.co.jp/blog/using_recaptcha_on_form
https://technote.flyingjunk.net/154/