# Cloudflare Turnstile でフォームを保護する
> Formspree Docs · フォームとプロジェクトの設定 · 2026年4月14日
[**Cloudflare Turnstile**](https://www.cloudflare.com/products/turnstile/) は、プライバシーを重視した最新の CAPTCHA 代替手段です。ユーザーへの問題提示なしに摩擦のないボット検出を提供し、アクセシビリティとフォームセキュリティの両方を向上させます。
Formspree は Turnstile をすぐに使える形でサポートしています。キーを設定してフォーム設定で CAPTCHA を有効にするだけです。
## ステップ 1: Turnstile サイトを作成する
まず [**Cloudflare Turnstile ダッシュボード**](https://dash.cloudflare.com/login) にアクセスします。
**Add widget** をクリックして新しい Turnstile サイトを作成します。
1. サイトの **name**（名前）を入力します。
2. _Allowed Domains_ にあなたの **domain**（例：`example.com`）を追加します。開発目的には [localhost](http://localhost) を使用してください。
3. **widget mode**（ウィジェットモード）を選択します。
設定を保存します。作成完了後、新しいウィジェットキーが表示されます。
この **Site Key と Secret Key** をコピーします。HTML フォームと Formspree の設定で使用します。
## ステップ 2: Formspree で CAPTCHA を設定する
[**Formspree ダッシュボード**](https://formspree.io/dashboard) でフォームの設定ページに移動します。
**CAPTCHA** セクションで CAPTCHA 保護が **enabled**（有効）になっていることを確認します。
**Adjust settings** をクリックし、**Cloudflare Turnstile** を選択して、提供されたフィールドに **Secret Key** を貼り付けます。
変更を保存します。
## ステップ 3: フォーム HTML に Turnstile を追加する
次に、フォームに Turnstile を追加します。HTML コードに **Turnstile スクリプト**と **Site Key** を含めます。
基本的な例を以下に示します。
```html
Turnstile Demo
```
ユーザーがフォームを送信すると、Turnstile ウィジェットが自動的にトークン（`cf-turnstile-response`）を生成し、Formspree があなたの Secret Key を使って検証します。
## AJAX の使用（オプション）
AJAX でフォームを送信する場合、リクエストに Turnstile トークンを手動で含めることができます。
以下は **Vanilla JS** を使用した例です。
```html
Turnstile AJAX Demo
```
または [Turnstile API](https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#widget-lifecycle-management) を使用することもできます。
```html
```