#302 · Herramienta para desarrolladores

API Request Example Generator

Genera un ejemplo de petición `fetch` a partir de una descripción JSON estructurada. Puedes indicar método, URL, cabeceras, parámetros de consulta y cuerpo; el generador compone la URL con `URLSearchParams` y serializa el body cuando corresponde. El resultado evita añadir un cuerpo a GET o HEAD y muestra de forma explícita las cabeceras utilizadas. Es útil para convertir rápidamente una ficha técnica de una API en un fragmento de JavaScript que después puedes adaptar al entorno real.

Datos de entrada

Descripción JSON de la petición
Espacio publicitario

Cómo usar esta herramienta para desarrolladores

  1. Introduce un objeto JSON con `url` y, si hace falta, `method`, `headers`, `query` y `body`.
  2. Ejecuta el generador para producir código JavaScript con `fetch`.
  3. Comprueba tokens, secretos y cabeceras antes de copiar el resultado.
  4. Adapta el tratamiento de la respuesta si la API no devuelve JSON.

Qué hace esta herramienta para desarrolladores

Convierte una descripción neutral de una petición HTTP en un fragmento `fetch` legible y reproducible.

Los parámetros `query` se añaden a la URL; las cabeceras se pasan en `headers`; el cuerpo se omite en GET y HEAD y se serializa si no es una cadena.

Los valores sensibles se reproducen tal como se introducen. Sustituye tokens reales por variables de entorno o placeholders antes de compartir el código.

Ejemplo

Entrada

{"method":"POST","url":"https://api.example.com/users","headers":{"Content-Type":"application/json","Authorization":"Bearer TOKEN"},"query":{"active":true},"body":{"name":"Ana"}}

Salida esperada

const response = await fetch("https://api.example.com/users?active=true", {
  "method": "POST",
  "headers": { ... },
  "body": "{\"name\":\"Ana\"}"
});

Casos de uso

  • Crear un ejemplo de integración para documentación interna.
  • Pasar una especificación JSON a código de prueba en navegador o runtime compatible.
  • Verificar rápidamente cómo quedan los query params y cabeceras.
  • Preparar un punto de partida para SDKs o snippets de soporte.

Consejos para obtener resultados fiables

  • No pegues secretos reales en ejemplos destinados a documentación pública.
  • Indica `Content-Type` cuando el servidor lo requiera.
  • Revisa si la API devuelve JSON antes de usar `response.json()`.
  • Para cuerpos binarios o multipart, adapta el fragmento manualmente.
  • Mantén separados parámetros query y cuerpo para evitar duplicaciones.

Detalles del procesamiento

El generador utiliza `URL` cuando la URL es absoluta y `URLSearchParams` como alternativa para rutas relativas. Después crea opciones compatibles con `fetch`.

No ejecuta la petición ni comprueba CORS, autenticación o disponibilidad. Los cuerpos multipart, streams y archivos necesitan adaptación manual.

Preguntas frecuentes

¿Qué propiedades JSON reconoce el generador de ejemplos de API?

Reconoce `method`, `url`, `headers`, `query` y `body`; solo `url` es imprescindible.

¿Cómo se añaden arrays en los parámetros query?

Cada valor del array se añade como una ocurrencia adicional del mismo parámetro.

¿El generador añade body a una petición GET?

No. GET y HEAD se generan sin body aunque la entrada incluya esa propiedad.

¿Puedo usar una URL relativa en lugar de https://...?

Sí. Si no se puede construir un objeto `URL`, los query params se concatenan usando `URLSearchParams`.

¿El código generado prueba la petición contra el servidor?

No. Solo genera el snippet; no realiza conexiones de red ni valida credenciales.

Módulos de la herramienta

MóduloComportamiento
Entrada JSONDescribe método, URL, cabeceras, query y cuerpo.
Composición de URLAñade parámetros sin perder una query existente.
Generación fetchProduce código con control básico de `response.ok`.

Explorar la categoría

Consulta más utilidades de API y GraphQL en el hub de la categoría.

Ver API y GraphQL