We’re beavering away on the next version of Typeform. If you’re a v2 Beta Tester, use the tabs below to switch articles. Learn more about v2.

?

We’re beavering away on the next version of Typeform. If you’re a v2 Beta Tester, use the tabs on the left to switch articles.

Webhooks

¿Dónde quieres que se envíen los datos de tu typeform? Haz que cada respuesta llegue al momento a una aplicación web compatible o una URL.

Salta a:

¿Qué es un webhook?

En términos generales, un webhook es simplemente una notificación automática que se envía a través de la web cuando sucede un evento determinado.

En este caso, el evento es un nueva respuesta a un typeform. Cuando tus usuarios hacen click en Enviar, sus respuestas se envían a través de una notificación automática al destino que hayas escogido — el Webhook URL que hayas determinado en el panel Configurar.

Las notificaciones webhook de Typeform se envían en una petición HTTP POST, y su contenido (que contiene los datos de la respuesta) está en formato JSON.


Guía de configuración

Puedes probar Webhooks estando en cualquier plan, pero para poder utilizarlos tienes que ser PRO+. Si necesitas generar una URL de prueba, puedes hacerlo en https://requestb.in/. Configurar webhooks para cualquiera de tus typeforms es fácil.

  1. Abre el typeform desde tu Workspace
  2. Ve al panel Configurar
  3. Escoge la sección Webhooks en el menú de la izquierda

  4. Añade una Webhook URL. (Esta es la dirección a la que realizaremos las peticiones HTTP POST).
  5. Comprueba que tu URL funciona.
  6. Puedes comprobar tu test y ver si ha funcionado en el panel “Recent Requests”. Puedes hacer clic en “Request ID” para abrirlo en otra pestaña.
    Nota: Si, por alguna razón, no se puede acceder tu URL, verás el icono de la rueda “Cargando” y ningún resultado en el panel de “Recent Requests”. Tus webhooks se enviarán cuando la URL esté disponible de nuevo.

  7. Haz click en “Save Changes” para guardar los cambios.

Si quieres empezar a usar Webhooks simplemente tienes que activar el interruptor “Webhook not live” a “ON”. Así que, ¡felicidades! Los Webhooks están ahora activos en tu typeform y cualquier respuesta nueva será enviada automáticamente a tu Webhook URL.


Ejemplo del contenido (JSON)

{
  "event_id": "4fdb9fbb3b0f0dd34730621e4e0b38c6",
  "event_type": "form_response",
  "form_response": {
    "form_id": "abc123",
    "token": "4fdb9fbb3b0f0dd34730621e4e0b38c6",
    "submitted_at": "2016-03-23T13:37:00Z",
    "hidden": {
      "name": "Linus",
      "team": "Design",
      "beard_status": "epic"
    },
    "answers": [
      {
        "type": "text",
        "text": "Beef.",
        "field": { 
          "id": "9048084",
          "type": "short_text"
        }
      },
      {
        "type": "choice",
        "choice": {
          "label": "Roasted"
        },
        "field": {
          "id": "12447898",
          "type": "multiple_choice"
        }
      },
      {
        "type": "number",
        "number": 5,
        "field": {
          "id": "12511545",
          "type": "rating"
        }
      },
      {
        "type": "text",
        "text": "Can't explain, just so tasty.",
        "field": {
          "id": "9422804",
          "type": "long_text"
        }
      },
      {
        "type": "choices",
        "choices": {
          "labels": ["Breakfast", "Lunch", "Dinner"],
          "other": "Brunch too. Who cares when? Just feed it to me."
        },
        "field": {
          "id": "12823744",
          "type": "picture_choice"
        }
      }
    ]
  }
}

Definición

La definición de las preguntas en tu formulario se presenta de forma resumida. La definición del formulario se puede utilizar para hacer coincidir sus respuestas a las preguntas originales.

  • Id: el identificador del campo , que se correlaciona con answers/field/id.
  • Title : El texto que ha escogido para encabezar el formulario.
  • Type : El tipo de campo que ha definido.

El orden de los campos va a coincidir con el orden de los campos en el objeto answers.

Tipos de pregunta

  • Respuesta corta short_text
  • Respuesta corta long_text
{
  "type": "text",
  "text": "A big juicy steak.",
  "field": {
    "id": "12345",
    "type": "short_text"
  }
}
  • Email email
{
  "type": "email",
  "email": "somebody@somewhere.com",
  "field": {
    "id": "12345",
    "type": "email"
  }
}
  • Dirección web website
{
  "type": "url",
  "url": "https://theinter.net/great-page",
  "field": {
    "id": "12345",
    "type": "website"
  }
}
  • Varias respuestas (Selección única) multiple_choice
  • Varias imágenes (Selección única) picture_choice
  • Grupo de preguntas dropdown
{
  "type": "choice",
  "choice": { 
    "label": "Medium rare"
  },
  "field": {
    "id": "12345",
    "type": "multiple_choice"
  }
}
  • Para preguntas de selección única, “choice” es un objeto que contiene o bien “label” o bien “other”.
  • Si la opción Otro se deshabilita, “choice” simplemente contendrá “label”.
  • Varias respuestas (Selección múltiple) multiple_choice
  • Varias imágenes (Selección múltiple) picture_choice
{
  "type": "choices",
  "choices": {
    "labels": ["Breakfast", "Lunch", "Dinner"],
    "other": "Brunch"
  },
  "field": {
    "id": "12345",
    "type": "picture_choice"
  }
}
  • Para preguntas de selección múltiple, “choices” contendrá tanto “labels” como “other” si el usuario usa la opción Otro en su respuesta.
  • Si la opción Otro o, a) no es usada por el usuario, o b) está deshabilitada, “choices” contendrá solo “labels”.
  • Fecha date
{
  "type": "date",
  "date": "2016-12-25",
  "field": {
    "id": "12345",
    "type": "date"
  }
}
  • ATENCIÓN: las fechas siempre están en formato ISO 8601 (YYYY-MM-DD), independientemente del formato que tengas configurado en tu pregunta de Fecha en el typeform.
  • Archivo file_upload
{
  "type": "file_url",
  "file_url": "https://api.typeform.com/v1/form/abc123/fields/16843266/blob/aadd6592adb8-image.jpg",
  "field": {
    "id": "12345",
    "type": "file_upload"
  }
}
  • Número number
  • Puntuación rating
  • Escala de opinión opinion_scale
{
  "type": "number",
  "number": 5,
  "field": {
    "id": "12345",
    "type": "rating"
  }
}
  • Sí/No yes_no
  • Legal legal
{
  "type": "boolean",
  "boolean": true,
  "field": {
    "id": "12345",
    "type": "yes_no"
  }
}
  • Pago payment
{
  "type": "payment",
  "payment": {
    "amount": "25",
    "last4": "4242",
    "name": "William Gates"
  },
  "field": {
    "id": "12345",
    "type": "payment"
  }
}

Puntuación

Si has agregado Puntuación a tu formulario, tendrás un objeto de “calculations/score”. Si no hay ningún cálculo de la puntuación añadida al formulario, este campo/objeto no se incluirá en la petición para el webhook.

{
...
"form_response": {
  // Definition, answers, etc
  "calculated":{
    "score": 0
  }
}


Preguntas sin contestar (o respuestas “vacías”)

La lista “answers” se rellena solo con las preguntas contestadas. Si alguna pregunta no ha sido contestada o bien porque, a) no es obligatoria, o b) se ha omitido por un Salto Lógico, ésta no aparecerá en el contenido del webhook. Así mismo, si no se ha añadido un cálculo de puntuación a tu typeform, esta puntuación tampoco será incluída en el contenido del webhook.

Errores

Si la petición del webhook falla por cualquier motivo, intentaremos volver a realizar una petición a tu dirección en intervalos de 20 minutos, como mínimo durante un día entero (72 intentos).

Comprobamos el éxito de las peticiones mirando el código de estado de la respuesta HTTP. Si la dirección contesta con un código que no es 2XX, seguiremos probando.

Cualquier mensaje de error aparecerá en el Registro de errores dentro de la sección Webhooks, en el panel Configurar.

Seguridad

Tu Webhook URL puede usar tanto http como https.

Por favor ten en cuenta que tu certificado SSL debe ser válido para poder usar https — los certificados auto-firmados no funcionarán. Quizás los introduzcamos en un futuro, así que si es algo que te interesa, por favor háznoslo saber contactando nuestro equipo de Soporte.

¿Te pareció útil este artículo?
¡Gracias!