API de backend de formularios: reciba envíos de formularios sin un servidor

Una API de backend de formularios elimina la necesidad de código del lado del servidor para manejar los envíos de formularios. En lugar de escribir scripts PHP, rutas Node.js o funciones sin servidor, apunta su formulario HTML a un endpoint alojado que recibe, valida y entrega los datos.

Esta guía explica cómo funcionan las API de backend y cómo integrarlas con cualquier sitio web o aplicación.

Cómo funciona una API de backend de formularios

El flujo es simple:

1. Your HTML form has an action attribute pointing to the form backend URL
2. El formulario incluye una clave de acceso público para identificar su formulario
3. Cuando se envía, el navegador envía una solicitud POST al endpoint
4. El servicio valida los datos, ejecuta comprobaciones antispam y entrega el envío

1
Browser → POST /submit → Form Backend → Email / Webhook / Sheets / Slack

Integración básica

Formulario HTML estándar

1
<form action="https://api.formsfort.com/submit" method="POST">
2
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY" />
3
  <input type="email" name="email" required />
4
  <textarea name="message" required></textarea>
5
  <button type="submit">Send</button>
6
</form>

El navegador se encarga de todo. No se requiere JavaScript.

Envío AJAX

para aplicaciones de una sola página o una experiencia de usuario más fluida:

1
const response = await fetch("https://api.formsfort.com/submit", {
2
  method: "POST",
3
  body: new FormData(formElement),
4
});
5

6
if (response.ok) {
7
  console.log("Submission received");
8
}

Envío JSON

Para aplicaciones API-first:

1
const response = await fetch("https://api.formsfort.com/submit", {
2
  method: "POST",
3
  headers: { "Content-Type": "application/json" },
4
  body: JSON.stringify({
5
    access_key: "YOUR_ACCESS_KEY",
6
    email: "[email protected]",
7
    message: "Hello from JSON",
8
  }),
9
});

Formato de solicitud

Tipos de contenido

Las API de backend de formularios normalmente aceptan:

Campos requeridos

Todos los demás campos son datos de su formulario. Nómbralos como necesites.

Campos especiales

Muchos servidores de formulario reconocen nombres de campos especiales para la configuración:

Formato de respuesta

Respuesta exitosa

1
{
2
  "success": true,
3
  "requestId": "req_abc123",
4
  "message": "Submission received"
5
}

The requestId is useful for debugging delivery issues. Include it when contacting support.

Respuesta de error

1
{
2
  "success": false,
3
  "message": "Invalid access key",
4
  "code": "INVALID_ACCESS_KEY"
5
}

Códigos de error comunes:

Modelo de seguridad

Claves de acceso público

La clave de acceso es intencionalmente pública. Va en su código fuente HTML donde cualquiera puede verlo. La seguridad no se basa en el secreto de la clave sino en:

• Restricción de dominio: acepte solo envíos de su sitio web
• Limitación de velocidad: evite el abuso desde una sola IP
• Detección de spam: Honeypot, CAPTCHA, filtrado de contenido
• Validación de campo: comprobaciones de longitud y tipo del lado del servidor

Qué no incluir nunca en el código de interfaz

• Secretos de API o tokens de administrador
• Tokens de OAuth
• Claves secretas CAPTCHA
• Credenciales de la base de datos
• Claves privadas

Estos pertenecen a un servidor, nunca a un código accesible al navegador.

Configuración de CORS

Form backend APIs set CORS headers to allow browser submissions. The Access-Control-Allow-Origin header is typically set to * (all origins) or restricted to your configured domains.

Si ve errores de CORS en la consola del navegador:

1. Verifique que su dominio esté en la lista de dominios permitidos
2. Asegúrese de que la URL del backend de formularios sea correcta (incluido https://)
3. Busque extensiones del navegador que bloqueen solicitudes entre orígenes

Reenvío de webhook

Configure el backend de su formulario para reenviar envíos a sus propios endpoints:

1
POST https://your-server.com/webhook
2
{
3
  "name": "Ada Lovelace",
4
  "email": "[email protected]",
5
  "message": "Hello",
6
  "_metadata": {
7
    "requestId": "req_abc123",
8
    "submittedAt": "2026-05-28T14:32:00Z",
9
    "origin": "https://yoursite.com"
10
  }
11
}

Los webhooks permiten integraciones en tiempo real con CRM, herramientas de gestión de proyectos, bases de datos personalizadas y plataformas de automatización.

Carga de archivos

Para envíos de varias partes con archivos:

1
<form action="https://api.formsfort.com/submit" method="POST" enctype="multipart/form-data">
2
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY" />
3
  <input type="file" name="attachment" accept=".pdf,.png,.jpg" />
4
  <button type="submit">Upload</button>
5
</form>

El backend de formularios:

1. Valida el tipo MIME frente a los tipos permitidos
2. Comprueba el tamaño del archivo con respecto a los límites configurados
3. Escanea el archivo en busca de malware
4. Almacena el archivo e incluye un enlace de descarga en la entrega

Limitación de velocidad

Los backends de formulario imponen límites de velocidad para evitar abusos:

When rate limited, the API returns a 429 Too Many Requests response. Implement retry logic with exponential backoff in AJAX handlers.

Prueba de tu integración

Prueba con curl

1
curl -X POST https://api.formsfort.com/submit \
2
  -F "access_key=YOUR_ACCESS_KEY" \
3
  -F "[email protected]" \
4
  -F "message=Testing from curl"

Prueba con un probador de endpoint de formulario

Utilice FormsFort Probador de endpoint de formulario para enviar datos de prueba desde el navegador e inspeccionar la respuesta.

Verificar la entrega

Después de enviar, verifique:

1. Bandeja de entrada de correo electrónico (incluida la carpeta de correo no deseado)
2. Registros de endpoint de webhook
3. Google Sheets para nuevas filas
4. Slack/Discord/Telegram para notificaciones
5. Registros de entrega de backend de formularioss para el ID de solicitud

Resumen

Una API de backend de formularios recibe envíos de formularios HTML a través de HTTP POST, valida los datos, ejecuta comprobaciones antispam y entrega el envío a correo electrónico, webhooks, hojas de cálculo o plataformas de mensajería. La integración solo requiere configurar la acción del formulario en la URL del endpoint e incluir una clave de acceso pública. Funciona con cualquier marco, cualquier generador de sitios estáticos y cualquier cliente HTTP. No se requiere código del lado del servidor.