send.webforms.toRead the docs →

Hosting and deploy platforms

Add a contact form to Cloudflare Pages

Cloudflare Pages Functions are excellent, and completely unnecessary for a contact form. Writing one means owning a Worker, an email API integration and your own spam filtering, all to move some form fields into an inbox. Point the form at an endpoint instead and there is no Function, no binding and no wrangler config in the loop.

Get an endpointRead the docs

Setup

  1. Copy your endpoint

    Create a form in the dashboard.

  2. Point the form at it

    A native POST or a client-side fetch. Neither needs a Function.

  3. Optionally use an env var

    Set a build-time variable in the Pages dashboard if you want different forms per environment.

Cloudflare Pages examples

Swap in your own endpoint and these run as-is.

Static, no Function involved.

public/contact.html
<form action="https://send.webforms.to/wft_your_key" method="POST">
  <input type="text" name="name" required />
  <input type="email" name="email" required />
  <textarea name="message" required></textarea>
  <input type="hidden" name="_next" value="https://example.com/thanks" />
  <button type="submit">Send</button>
</form>

Only if you specifically want the submission to pass through a Pages Function first.

functions/api/contact.ts
export const onRequestPost: PagesFunction = async ({ request }) => {
  const formData = await request.formData();

  const res = await fetch("https://send.webforms.to/wft_your_key", {
    method: "POST",
    headers: { accept: "application/json" },
    body: formData,
  });

  return new Response(await res.text(), {
    status: res.status,
    headers: { "content-type": "application/json" },
  });
};

Cloudflare Pages form FAQ

No. The browser posts straight to the endpoint. A Function is only useful if you want to add your own logic in front of it.

Ready to wire up your Cloudflare Pages form?

Free for 300 submissions a month. Endpoint in under a minute, no card required.

Start free