広告を利用しています

当サイトは広告を掲載しています。消費者庁が2023年10月1日から施行した景品表示法の規制対象(通称:ステマ規制)にならないよう配慮して記事を作成しています(記事はこちら、消す方法はこちら

【WordPress】問い合わせのスパム対策にCloudflare Turnstile導入!

2025年2月9日WordPress

「Cloudflare Turnstile」のアイコン画像

この記事では、問い合わせのスパム対策に導入していた「reCAPTCHA」をやめて「Cloudflare Turnstile」に移行した話を書きます。

「ナポリタン寿司のPC日記」の「Contact Form 7」に「Simple Cloudflare Turnstile」を導入した画像

以下の手順で移行できます。

  1. reCAPTCHA」を自身のサイトから解除する
  2. Cloudflare」のアカウントを新規作成する
  3. 「Cloudflare Turnstile」に自身のサイトを追加する
  4. 発行されたサイトキーとシークレットキーをコピーする
  5. Contact Form 7」で使えるよう設定

僕はブログ記事のネタにするため随時スクリーンショットやメモしながら作業したのでそこそこ時間がかかりましたが、そうじゃない場合は大体1時間もあればできるんじゃないかなと思います。1時間も大分余裕見ています。本当にさっさとやったら10分とかでできそうです。

「reCAPTCHA」から「Cloudflare Turnstile」に移行したい方、参考にしてみてください。

事の発端(どうでもいい方はスキップ)

僕がなぜ移行するに至ったのかの話です。移行作業に全く関係ないので興味ない方はこちらに飛んでください。

「reCAPTCHA」が「Google Cloud」内に統合されるらしい

2025年2月に一通のメールが届きました。

2025年末までにすべての「Google reCAPTCHA」キーを「Google Cloud」プロジェクトに移行するよ~というお知らせメールです。

2025年2月に「Google Cloud」から届いた「reCAPTCHA」の移行お知らせメール画像

以下から同じような内容を確認できます。英語ですけどね。

僕の中で「Google Cloudグーグル クラウド」は、Googleが提供している色々なサービスの分析やらYouTubeのAPI利用などできる管理ツール…というイメージでした。

これまで「reCAPTCHA」は「reCAPTCHA」単体でサービスとしてありましたが、今後は色々まとめて管理できる「Google Cloud」の中の一つとして合体するってことだと思います。

「え~。僕は何かしないといけんの?めんどくせぇ」って思ったんですが、よくメールを読んでみると最悪やらなくても向こうが自動的にやってくれる…ようです。

変更の適用は、今年一年を通して段階的に進められます。お客様のキーが対象になった時点で改めてメールでご連絡いたします。その際には、Google Cloud プロジェクトが自動的に作成され、それにお客様のキーが関連付けられます。

ただし、このプロセスより前にこちらの手順に沿って、reCAPTCHA Classic から手動で移行することをおすすめします。そうすることで、キーの関連付け先の Google Cloud プロジェクトを明確に指定できます。

「Google Cloud」から届いたメール内容の一部抜粋

移行作業は2025年の一年で段階的にされていくようです。

ブロガーである僕が何もしなくても向こうが勝手に作業してくれてキーを発行してくれます。キーってのは「Google Cloud」で「reCAPTCHA」を使うための必要なものです。

ただ自分で移行作業をすることで、自分で好きなプロジェクト名を決められるので多少管理しやすくなるようです。自分でやることで自分の中でより知識や理解が深まるという考えもあるのかなーと。

「Google Cloud」は色々なものをまとめて管理するツールなので向こうが適当に発行したやつだと「えっと…どれがreCAPTCHAを管理しているやつだっけ…」とちょっと迷子になる可能性があります。

とはいえ「Google Cloud」で他のことをしないのであれば「reCAPTCHA」だけなので向こうが適当に決めた名前でも何でもいいような気もします。

移行作業もめちゃくちゃ難しいって雰囲気じゃなかったです。

以下のページから「reCAPTCHAを管理する」→「reCAPTCHA Enterprise API」を有効にしてあれこれ…って流れだと思います。僕はやっていないので分かりませんが。

多分「reCAPTCHA Google Cloud 移行」とかでググったら解説記事でると思います。公式ドキュメントもあります。

これはいいタイミングだ!で「reCAPTCHA」脱退を決意

移行作業はそこまで大変じゃなさそう、かつ最悪やらなくても向こうがキー発行してくれる(発行したキーの登録などは自分でやらないといけないと思うけど)ことから、別にそのまま使い続けても良かったです。

しかし、以前から「reCAPTCHA」より「Cloudflare Turnstile」のほうがいい…という話をちらほら読者様やネット上の知り合いから聞いていました。

以下のような記事があります。

当社のデータによると、ユーザーがCAPTCHAに答えるのに平均で32秒を要します。世界には46億人のインターネットユーザーがいます。普通のインターネットユーザーは、およそ10日に1回の割合で、CAPTCHA認証を目にしていると推測されます。

ざっくり計算すると、毎日およそ500年分の時間がムダになっているわけです。自分たちが人間であるということを証明するためだけに、これだけの時間が費やされているのです。

人類はCAPTCHAで毎日約500年をムダにしている。この狂気から脱却する時が来た

CAPTCHAが煩雑なユーザーエクスペリエンスを生み出すという事実を蒸し返すことに意味はありません。これに関してはこのブログで以前にも、そして他の場所でも何度となく取り上げられています。CAPTCHAの創始者は、「人間の脳のサイクルという貴重な資源を10秒ごとに何百万時間も浪費するシステムを無意識のうちに作り上げてしまいました」と公に嘆いています。私たちはそれを嫌い、あなたもそれを嫌い、誰もがそれを嫌います。

CAPTCHAに代わり、利便性が高く、プライバシーが守られるTurnstileを発表

「Cloudflare Turnstile」を提供している「Cloudflare」によると、画像から英数字を入力するやつとか信号機があるタイルをクリックしてください的な「reCAPTCHA」認証に要する1回の平均時間は32秒、毎日およそ500年分の時間がムダになっている…らしいです。

自社サービス使ってほしいがための売り文句な可能性もありますが、実際のところ僕もストレスでした。

画像が表示されて「横断歩道のタイルをクリックしてください」ってなんですかあれ…。クリアしたかと思ったら別の画像でもう一回…。

まぁセキュリティ的に一番安全だから世界中で普及しているんでしょうけどね。

「Cloudflare Turnstile」を推奨している方ほど僕の中でITつよつよなイメージがあります。人に流されやすい性格もあり、そういう方々がいうなら…ってことでちょーどこのタイミングを良い機会ととらえて移行してみます。

「reCAPTCHA」から「Cloudflare Turnstile」に移行する手順

「reCAPTCHA」を自身のサイトから解除する

どの段階から始めるかで作業時間が変わります。「reCAPTCHA」は既に退会しているならその過程は飛ばして「Cloudflare」のアカウント作成から開始します。

本記事では「reCAPTCHA」をやめる方法は別記事に書いたので、ステップ2の「Cloudflare」のアカウント作成から説明します。

まだ解除していない場合は以下記事を参考にして本記事に戻ってください。

注意点としてなるべく移行している間の何もスパム対策していない時間(期間)が少ないほうがいいので、作業するなら一気にやったほうがいいです。

「今日はreCAPTCHAやめる作業をしてCloudflare Turnstile導入はまた明日~」はあんまりよくないと思います。その間に大量のスパムメールがくる可能性も無きにしも非ず。

むしろ被っている期間があってもいいから先に導入して、その後「reCAPTCHA」をやめるでもありです。

「Cloudflare」のアカウントを作成する

以下サイトを開きます。

「無料で始める」をクリックします。

「Cloudflare」のアカウントを新規作成する手順画像1

メールアドレスやパスワードを設定します。僕は「Continue with Google」を押してGoogleアカウントでアカウント作成することにしました。

「Cloudflare」のアカウントを新規作成する手順画像2

Googleアカウントの場合、ログイン許可与えてもいいか確認ページが表示されるので「次へ」を押します。

「Cloudflare」のアカウントを新規作成する手順画像3

アカウント作成できたら「Cloudflare」の管理ページ(ダッシュボード)が表示されます。

「Cloudflare」の英語版ダッシュボード画像

「reCAPTCHA」と違ってアクセス解析(アナリティクス)やセキュリティチェックなど色々な項目がある中で「Turnstile」という問い合わせのスパム対策機能がある状態です。

よって左側サイドバーにはあれこれ表示されていますが、スパム対策だけやるなら「Turnstile」だけ見たらOKです。あとあと他のことに手をだしてもいいですしね。

ダッシュボードの言語を変更する

僕の場合管理画面は英語でした。右上の「English」→「日本語」を選択することで日本語に変更できます。

「Cloudflare」サイトを日本語化する手順画像

「Cloudflare Turnstile」にサイト登録する

ウィジェットの追加

「ウィジェットを追加」をクリックします。

「Cloudflare Turnstile」に新しくサイト(ウィジェット)を追加する手順画像

ウィジェット名に好きな名前を入力します。自分が分かればなんでもいいです。僕は自身のブログ名「ナポリタン寿司のPC日記」にしました。

ホスト名の追加

「ホスト名の追加」をクリックします。

「Cloudflare Turnstile」に新しく登録するサイトの名前を設定する手順画像

右側サイドバーがひょいっと表示されるので、自身のブログのドメイン名を入力します。

「Cloudflare Turnstile」に登録するホスト名(ドメイン)を検索する手順画像

例えば、本記事は「https://www.naporitansushi.com/wordpress-recaptcha-cloudflare-turnstile-transition/」というURLですが、ドメイン名は「naporitansushi.com」になります。

<!--当サイトを「Cloudflare Turnstile」に登録する場合-->
naporitansushi.com

その他の余計な情報を入れるとうまく認証されない可能性があるので間違えないようにします。

「追加」を押すと検索されて結果が表示されます。自分のサイトが間違いなく表示されていたらチェックをつけて下部にある「追加」を押します。

「Cloudflare Turnstile」に登録するホスト名(ドメイン)を追加する手順画像

ウィジェットモードの選択

ウィジェットモードは「管理対象」でOKです。

「Cloudflare Turnstile」のウィジェットモードを選択する手順画像

事前クリアランスの設定

「このサイトの事前クリアランスを選択しますか?」はお好みです。

初めて訪れたユーザーには全員チェックさせるけど、2回目、3回目と訪れた人はめんどくさいだろうからチェック作業を飛ばしてあげる…っていう設定です。

つまるところ読者的には「はい」のほうがCookieのデータがある場合認証作業をスキップしてくれるので楽です。ただし、セキュリティ対策的には毎回全員に一律でチェックさせたほうがいいので「いいえ」がいいです。

僕はひとまず「はい」にしました。もしこれでスパムメールが多かったら「いいえ」に戻したいと思います。

「はい」にすると追加でどの場合に認証をスキップさせるか設定できます。

「Cloudflare Turnstile」の事前クリアランスの設定画像

僕調べだと以下です。一番あんぱいなのが「管理対象」です。僕もそうしています。危険とか安全はかなり大げさな表現です。

事前クリアランスの項目セキュリティ的には?読者的には?
インタラクティブ一番緩い=危険全て(3つ)の認証がスキップされるので楽
管理対象標準2つの認証がスキップされる。1つはスキップされない。標準
非インタラクティブ一番厳しい=安全1つしか認証がスキップされないので読者的には手間

「ChatGPT」に聞いた結果も貼っておきます。

「ChatGPT」に「Cloudflare Turnstile」の事前クリアランスについて質問している画像
参考:「Cloudflare Turnstile」の「このサイトの事前クリアランスを選択しますか?」設定項目

ひとまず利用するなら「管理対象」にして様子見するのがいいかなと思います。スパムが多いようなら「非インタラクティブ」にするかあるいはそもそも事前クリアランスを「いいえ」にします。

あとからいくらでも設定変えられるのでひとまずバランス型をとるのがいいかなと。

選択したら「作成」をクリックします。

サイトキー、シークレットキーのコピー

Turnstileのウィジェット作成(サイト登録)が完了すると、サイトキー、シークレットキーという大事な2つの文字列が発行されます。

「Cloudflare Turnstile」に新しく登録したブログのサイトキー、シークレットキーをコピーする手順画像

このページ(タブ)は開いたまま次の作業にうつります。

最悪タブを閉じてもまたいつでも開いて確認できます。今後を考えた時ページをブックマークなどに登録しておくと開きやすいです。

「Cloudflare Turnstile」のダッシュボードに登録した「ナポリタン寿司のPC日記」画像

「Contact Form 7」にTurnstileを登録する

「Simple Cloudflare Turnstile」プラグインについて

ここからはWordPressでの作業です。

本記事では以前「Simple Cloudflare Turnstile」プラグインを使った方法を紹介していましたが、2025年6月26日にリリースされたContact Form 7のバージョン6.1から公式が対応したので、現在は別途プラグインを導入しなくても実装できるようになりました。

Cloudflare Turnstile インテグレーションの導入
以前お知らせした通り、6.1 では Cloudflare Turnstile のインテグレーションモジュールが導入されます。Turnstile は無料で利用でき Google reCAPTCHA と同等に効果的に機能します。私たちは Contact Form 7 ユーザーに対して Cloudflare Turnstile を推奨します。

Contact Form 7 6.1 | Contact Form 7 [日本語]

もちろんプラグインを使った方法も今でもできるとは思うし、何よりプラグインだと全てのフォームに柔軟じゅうなんに対応しています。

「Contact Form 7」は文字通り「Contact Form 7」上のフォームのみで、ログインページやコメント欄など他の入力欄には対応していません。

各記事の下に設置したコメント欄でもTurnstile認証やりたい!って場合は、プラグインを導入してそこでサイトキーやシークレットキーを登録する方法がいいような気がします。

本記事では、なるべくシンプルに!ってことで、記事を修正して「Contact Form 7」に直接「Cloudflare Turnstile」を登録する方法に切り替えています。

なお、お分かりの通り本記事は問い合わせフォームにContact Form 7プラグインを使っている前提です。それ以外の問い合わせフォームのやり方は知りません。

Contact Form 7のインテグレーションページを開く

管理画面左側サイドバー内にある「お問い合わせ」→「インテグレーション」に進みます。

WordPressで問い合わせのインテグレーションを開く手順画像

バージョン6.1(2025年6月26日)以降、それまでなかった「Turnstile」タイルがあります。この中の「インテグレーションのセットアップ」をクリックします。

WordPressの「Contact Form 7」でTurnstileのインテグレーションセットアップを開始する手順画像

Turnstileを登録する

サイトキーとシークレットキーにこちらで取得したキーを貼り付けます。「Cloudflare Turnstile」のページ(タブ)に戻ってコピーですね。

WordPressの「Contact Form 7」でTurnstileのサイトキーとシークレットキーを登録する手順画像

コピペできたら「変更を保存」をクリックします。

「設定を保存しました」と表示されて、「✔ Turnstileはこのサイト上で有効化されています。」になっていればOKです。

WordPressの「Contact Form 7」にTurnstileのインテグレーションを登録した画像

実際に問い合わせページを確認

一連の作業が終わったら実際に「Cloudflare Turnstile」が表示されるのか確認します。

僕の場合、「Contact Form 7」で作成している「https://www.naporitansushi.com/question/」ページを開きます。

無時に自分で開いた時もチェック画面が表示されました。チェックすることで人間かボット(機械)か判断してくれます。人間だったら「成功しました!」と緑チェックが表示されて問い合わせ送信できます。

WordPressの「Contact Form 7」にTurnstileウィジェットを設置した画像

【任意】配置や表示位置の調整

感想

以上、WordPressの問い合わせのスパム対策に導入していた「reCAPTCHA」をやめて「Cloudflare Turnstile」に移行した話でした。

導入してから管理画面を見るとちゃんとデータが蓄積されていっているので正常に稼働していると思います。ガチガチの英語で設定項目も多い…とかだったら大変でしたが、そうじゃなかったので良かったです。

2025年2月9日WordPress

Posted by ナポリタン寿司