お問い合わせフォームのスパム対策を、reCAPTCHAからCloudflare Turnstileに切り替えました

Calmaのサイトでは、お問い合わせフォームのスパム対策を、Googleの「reCAPTCHA」からCloudflareの「Turnstile（ターンスタイル）」に切り替えました。
この記事では、切り替えた理由、Turnstileの特長、WordPress（Contact Form 7）での設定手順をまとめます。同じようにreCAPTCHAを使っている方の参考になればうれしいです。

そもそもフォームのスパム対策とは

Webサイトのお問い合わせフォームには、プログラム（ボット）による迷惑メールが日々送られてきます。
それを防ぐため、「送信しているのが人間かどうか」を判定する仕組みを入れるのが一般的です。代表的なものがGoogleのreCAPTCHAで、多くのWordPressサイトで使われています。

reCAPTCHAから切り替えた理由

画面右下のバッジが気になる

reCAPTCHA v3を使うと、画面の右下に「reCAPTCHA」のバッジが表示されます。デザインの邪魔になりやすく、フローティングボタンなどと重なることもありました。
さらに、設定によってはお問い合わせページ以外の全ページで読み込まれてしまいます。

ページの表示が重くなる

reCAPTCHAはGoogleの外部スクリプトを読み込むため、ページの表示速度に少なからず影響します。表示速度はユーザーの使いやすさだけでなく、SEOの評価にも関わる部分です。

Google Cloudへの移行と料金体系の変更

reCAPTCHAは2025年からGoogle Cloudの「reCAPTCHA Enterprise」に統合され、一定の利用件数を超えると有料になる料金体系に変わりました。
小規模なサイトであればすぐに費用がかかるわけではありません。ただ、管理画面が変わったり、Google Cloudのプロジェクト管理が必要になったりと、運用の手間は増えています。

Cloudflare Turnstileとは

Turnstileは、Cloudflareが提供する無料のスパム対策サービスです。reCAPTCHAに代わる仕組みとして使われるケースが増えています。

画像選択が不要

「信号機の画像をすべて選んでください」のような操作は基本的になく、多くの場合は自動で判定が終わります。

見た目がシンプル

フォームの中に小さなチェック表示が出るだけで、画面右下のバッジはありません。

プライバシーへの配慮

広告目的で個人の情報を使わない方針を掲げています。

無料で使える

Cloudflareのアカウントがあれば、基本的に無料で導入できます。サイト自体をCloudflareに移す必要もありません。

Contact Form 7での設定手順

Contact Form 7はバージョン6.1から、Turnstileに標準で対応しています。別のプラグインを追加する必要はありません。

1. Cloudflareでウィジェットを作成する

Cloudflareの公式サイトからアカウントを作成し、管理画面の「Turnstile」からウィジェットを追加します。サイト名とドメインを登録し、モードは「マネージド」を選びます。

2. サイトキーとシークレットキーをコピーする

ウィジェットを作成すると発行される「サイトキー」と「シークレットキー」をコピーします。

3. WordPressにキーを登録する

WordPressの管理画面で「お問い合わせ」→「インテグレーション」を開き、Turnstileの「インテグレーションのセットアップ」にキーを貼り付けて保存します。

4. 表示位置を調整する

キーを保存すると、すべてのフォームにTurnstileが自動で表示されます。初期状態ではフォームの一番上に出るので、表示位置を変えたい場合は、フォームの編集画面で送信ボタンの上などに [turnstile] というタグを入れます。

■コード例

 <div class="cloudflare">
[turnstile]
</div>

5. reCAPTCHAのキーを削除する

reCAPTCHAを使っていた場合は、インテグレーションの画面からreCAPTCHAのキーを削除しておきましょう。

設定後は、実際にフォームからテスト送信を行い、問題なく届くか確認してください。

設定するときのポイント

読み込むページを絞る

スパム対策のスクリプトは、テーマ側の設定でお問い合わせページだけで読み込むようにしておくと、ほかのページが軽くなります。

<?php
/**
 * Contact Form 7 のスクリプトとスパム対策（Turnstile / reCAPTCHA）を
 * お問い合わせページだけで読み込む
 *
 * 'contact' の部分は、お問い合わせページのスラッグに合わせて変更してください。
 */
function my_is_contact_page() {
	return is_page( 'contact' );
}

// Contact Form 7 の JS・CSS をお問い合わせページだけで読み込む
add_filter( 'wpcf7_load_js', 'my_is_contact_page' );
add_filter( 'wpcf7_load_css', 'my_is_contact_page' );

// スパム対策のスクリプトを、お問い合わせページ以外では読み込まない
function my_limit_spam_protection_scripts() {
	if ( my_is_contact_page() ) {
		return;
	}

	$handles = array(
		'cloudflare-turnstile', // Cloudflare Turnstile
		'google-recaptcha',     // reCAPTCHA
		'wpcf7-recaptcha',      // Contact Form 7 の reCAPTCHA 連携
		'contact-form-7',       // Contact Form 7 本体
		'swv',                  // Contact Form 7 の入力チェック
	);

	foreach ( $handles as $handle ) {
		wp_dequeue_script( $handle );
		wp_deregister_script( $handle );
	}
	wp_dequeue_style( 'contact-form-7' );
}
add_action( 'wp_enqueue_scripts', 'my_limit_spam_protection_scripts', 999 );

確認画面があるフォームはテストしておく

確認画面を挟むフォームでは、送信までの流れの中でTurnstileの判定が正しく行われるか、テストしておくと安心です。

まとめ

reCAPTCHAからTurnstileへの切り替えは、設定自体は10分ほどで終わります。そのうえで、デザイン・表示速度・運用の手間の面でメリットがありました。
お問い合わせフォームのスパム対策を見直したい方や、reCAPTCHAのバッジや料金体系の変更が気になっている方は、検討してみてはいかがでしょうか。
Calmaでは、フォームのスパム対策やWordPressの保守・運用のご相談も承っています。お気軽にお問い合わせください。