Static Forms no es un servicio completo de formularios
El plugin analiza y llama a tu controlador. Tú programas almacenamiento, avisos, spam y errores. Ese es el trabajo real y el plugin no lo hace.
integraciones · hosting platform
Cloudflare sirve tu sitio desde cientos de ciudades, pero no recibe formularios. Su tutorial remite a terceros. Static Forms para Pages Functions solo intercepta POST y lo pasa a una función que debes programar y conectar a KV.
Un action dirigido a mailcontact elimina esa capa: sin Functions, KV, wrangler ni Worker. Los mensajes llegan a la bandeja y avisan por Discord, Slack, email o webhook.
configuración recomendada
Añade este HTML a tu sitio o utiliza el generador de formularios. Sustituye el enlace por el de tu formulario. El script alojado inserta la comprobación oculta, gestiona el envío y la verificación automática y conserva el borrador si hay errores. Tú controlas el HTML y el CSS. Los formularios Free muestran un enlace visible «Processed by mailcontact.app»; Pro y Plus no. Los avisos siguen el idioma del navegador; configura data-mailcontact-language="fr" en el formulario para forzar el francés.
<form action="https://mailcontact.app/api/forms/your-form-id" method="POST" data-mailcontact-form lang="es" data-mailcontact-language="es">
<input type="hidden" name="_language" value="es" />
<fieldset>
<legend>Contáctanos</legend>
<label>
Nombre (opcional)
<input name="name" type="text" autocomplete="name" maxlength="200" />
</label>
<label>
Correo electrónico
<input name="email" type="email" autocomplete="email" maxlength="320" required />
</label>
<label>
Mensaje
<textarea name="message" rows="5" maxlength="5000" required></textarea>
</label>
<noscript>
<div aria-hidden="true" style="position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden;">
<label>Sitio web
<input name="company_website" type="text" tabindex="-1" autocomplete="off" />
</label>
</div>
</noscript>
<button type="submit">Enviar mensaje</button>
</fieldset>
<p data-contact-status role="status" aria-live="polite" aria-atomic="true"></p>
</form>
<script defer src="https://mailcontact.app/forms/v1.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>Para un componente con su propio controlador de envío, carga el mismo script y utiliza MailContact.prepare(form) y MailContact.send() en lugar del marcador automático. Consulta la referencia de interfaces personalizadas para carga, avisos y atribución de Free.
el código
Este ejemplo envía directamente a la API. Mantén el campo obligatorio company_website presente y vacío. Los envíos nativos abren JSON si tienen éxito o una página de verificación si hace falta. Los scripts sin verificación envían los mensajes sospechosos a Spam; el spam claro también se retiene sin alertas ni consumo de cuota. Una respuesta de éxito confirma recepción, incluida revisión, o el descarte silencioso de una trampa rellenada. Consulta protección contra spam para conocer todo el funcionamiento.
<!-- No functions/ directory. No KV namespace. No wrangler.toml. -->
<form action="https://mailcontact.app/api/forms/your-form-id" method="POST">
<input type="text" name="name" placeholder="Your name" required />
<input type="email" name="email" placeholder="[email protected]" required />
<textarea name="message" placeholder="What's on your mind?" required></textarea>
<!-- Bots fill this in. Humans never see it. -->
<input type="text" name="company_website" type="text" tabindex="-1" autocomplete="off"
style="position:absolute;left:-10000px" aria-hidden="true" />
<button type="submit">Send</button>
</form>cómo funciona
Una bandeja por proyecto Pages con endpoint y email al instante.
HTML, Astro o React: el formulario es código en la página. No cambia tu compilación.
git push o wrangler pages deploy. Funciona en vistas previas, ramas y dominio propio sin ajustes por entorno.
por qué mailcontact
El plugin analiza y llama a tu controlador. Tú programas almacenamiento, avisos, spam y errores. Ese es el trabajo real y el plugin no lo hace.
Workers cobra peticiones y CPU; un formulario con email añade API y clave. Un endpoint externo evita presupuestos de invocación y depuración nocturna.
Cloudflare orienta nuevos proyectos a Workers. Un formulario con URL externa no depende del producto y no necesita migrar integraciones.
preguntas frecuentes
No. Netlify detecta un atributo al desplegar y guarda los envíos; Cloudflare no tiene esa función. Propone Static Forms, donde programas el controlador y el almacenamiento, o un servicio externo. No hay opción sin código en la plataforma.
Es una base técnica, no un producto completo. El plugin captura el POST de formularios con data-static-form-name y lo pasa a un respondWith que debes programar. Guardar mensajes, avisar y filtrar spam sigue siendo tu responsabilidad. Si quieres programarlo, ayuda; si quieres evitarlo, un endpoint es más directo.
Sí. No hay conflicto: action apunta a otro origen y no cambia functions/, middleware ni bindings. Solo sustituye la función que harías para contacto.
Sí. *.pages.dev, ramas y dominio propio envían a la misma bandeja sin configurar cada entorno ni mantener autorizaciones.
relacionado
Formularios y una dirección de email real, juntos, con avisos en tus herramientas. Empieza con una cuenta gratuita.
Crear formulario gratisSin tarjeta de crédito. Free incluye un proyecto y 50 mensajes de formulario al mes.