Q.Studioから静的サイトへ移した場合、FormspreeやCloudflare Workersでお問い合わせフォームを作れますか？

「Studioのときのように、画面の設定だけで問い合わせを受けたい」という人には、Formspreeのほうが近い使い心地です。HTMLのformタグにあるaction属性へ専用のエンドポイントを記載し、各入力項目にname属性を割り当てるだけでフォームが完成します。バックエンドのコードを書く必要がなく、受信したデータは専用ダッシュボードで一覧管理できます。

無料で使える範囲は次のとおりです。

登録できるメールが2件あっても、1件の問い合わせを2人に同時に届けられるわけではありません。複数人に同時に届けたいなら、Personal以上が必要です（Formspreeの料金表）。

一方、Cloudflare Pages Functionsを利用する場合、受信用の関数（functions/api/submit.jsなど）を作成し、POST送信されたフォームデータを受け取る仕組みを自前で実装します。ただし、Cloudflareの公式サンプルコードは受け取った値をJSON形式で返す処理が中心で、データベースへ履歴を自動保存する仕組みまでは含まれていません。なお、Cloudflareでは、あらかじめアカウント内で検証を済ませた宛先へのメール送信であれば、Workersの無料プラン・有料プランを問わず追加料金なしで利用できます。

コードを書いて直せる人が身近にいればWorkers、いなければFormspreeで決めてよいでしょう。

Cloudflare Workersを使って、フォームから送信されたメッセージをメールとして受け取るにはどのような準備を行えばよいのでしょうか。

基本となる流れは、Wranglerの設定ファイルにメール送信用のバインディングを追加し、Workerのスクリプトからメール送信処理を呼び出す形です。つまり、設定ファイル内でsend_emailバインディングを定義したうえで、コード側からsend()メソッドを実行します。このとき、Workersのメール送信設定でdestination_addressを指定しておくと、そのバインディングから送信できる宛先をあらかじめ決めた単一のアドレスに固定できます。指定したアドレス1件にしか送れなくなるので、コードに不具合があってもほかの人へ届く心配がありません。

料金は、宛先がアカウントで確認済みのアドレスかで変わります。

• 確認済みの宛先へ送る：Workers FreeでもPaidでも無料。Email Routingだけを設定している場合も対象
• 確認していない任意の宛先へ送る：Workers Paidが必要

担当者への通知は前者、入力した人への控えは後者に当たるため、同じ無料条件では考えられませんね。

もうひとつ、メールを送る処理とは別に書くものがあります。入力欄が空でないか、メールアドレスの形になっているかといった確認と、送信後に完了ページへ移す処理です。Turnstileでスパムを防ぐ場合は、メールを送る前にサーバー側でトークンを確かめる処理も加えます。

たとえば、歪んだ英数字の入力や信号機の写真を選ぶテストを訪問者に強いることなく、機械的なスパム送信だけを静かに遮断したい場面はよくあります。Cloudflare Turnstileは、利用者に面倒な課題を解かせずにボットを検出できるCAPTCHAの代替サービスです。

Workersで自分で検証する場合の流れは、3段階です。

1. Cloudflareの管理画面でウィジェットを作り、HTMLに書く公開のサイトキーと、サーバーで使う秘密キーを受け取る（Turnstileの始め方）
2. フォームのHTMLで公式のapi.jsを読み込み、cf-turnstileクラスとdata-sitekeyを持つ要素を置く。送信時にはcf-turnstile-responseという隠し入力でトークンが届く（ウィジェットの置き方）
3. Workers側でTurnstileの検証用エンドポイント（siteverify）へPOSTし、secretに秘密キー、responseに受け取ったトークンを渡す。結果を見て送信を通すか断るかを決める（サーバー側の検証）

3つ目を省くと、画面に確認欄が出ていてもフォームは守られません。また、秘密キーはHTMLなどブラウザで見えるコードに書かないでください。トークンは作られてから300秒で切れ、検証できるのも1回だけです。入力に時間がかかった人には、新しいトークンを取り直してもらいます。

Formspreeを使うなら、もっと手軽です。フォーム設定でCAPTCHA保護を有効にし、Cloudflare Turnstileを選んで秘密キーを登録します。あとはHTMLにウィジェットを足すだけで、トークンの検証はFormspreeが引き受けます。

「フォームの設定も、これまでの回答も一緒に持っていける」と考えていると、移した後で困ります。Studioのフォームではダッシュボード上での一覧確認に加えて、メール通知やスプレッドシート連携が用意されていました。この受け取り方は移行先に自動では移らないので、今どの経路で回答を見ているかを書き出してから作り直してください。

特にファイルの添付機能については、管理画面からダウンロードする形式をとっており、通知メール本文にファイルの実体やダウンロード用リンクは届かない仕組みでした。過去の添付が必要なら、プロジェクトを閉じる前に手元へ保存しておきます。静的サイトへ移る際は、添付ファイルをメールに直接添付して受信するのか、外部ストレージに保存するのかをあらかじめ決めておく必要があります。

スプレッドシート連携は、解除してから連携し直すまで回答がシートに入りません。その間はStudioへの保存が有効なら管理画面に残り、無効なら設定済みの通知先メールにしか届きません。切り替え作業の前に、通知先がいまも読まれているアドレスか見直してください。

さらに、個人情報の取り扱い方針も見直しておきたいところです。2026年10月に公表されたStudioの不正アクセス事案では、保存されていたフォームの送信内容が、暗号化していた分も含めて知られた可能性があるとされています。添付はファイル名だけが対象で、ファイル本体は含まれていません。あわせて、Formspreeの無料プランを利用する場合、通知先の登録上限は2件までで、回答履歴が保管される期間は30日間に制限されます。回答を残す場所は少ないほうが、何かあったときに確かめる範囲も狭くて済みますね。静的サイトへ切り替えるタイミングで、回答内容を外部サーバーに残し続けるのか、通知メールの送受信のみに絞って履歴を保持しない設計にするのか、運用体制に合わせて方針を定めておきましょう。