Struggling to properly interpret the unrefined data from Typeform's webhook

Utilizing the webhook feature of Typeform to convert results to JSON when a user submits the embedded survey is working perfectly when tested with RequestBin. However, after exposing my local app using ngrok with the command

ngrok http 3000

and setting the route as the webhook target URL in Express:

app.post('/receiveWebhook', function(req, res){
    console.log(req);
    console.log(req.title);
    res.send(200);
});

The server-side output is not as expected:

IncomingMessage {
   _readableState: 
       ReadableState {
           objectMode: false,
           highWaterMark: 16384,
           buffer: [],
           length: 0,
           pipes: null,
           pipesCount: 0,
           flowing: null,
           ended: false,
           endEmitted: false,
           reading: false,
           sync: true,
           needReadable: false,
           emittedReadable: false,
           ....
      body: {},
      params: {},
      ... 
      (can post the entire contents on Dropbox if comments think it is necessary)

When testing the route with Postman, only this appears in the Raw Body:

{"title": "Test"}

This data does not match what should be logged by the console statements in the Express route provided above.

Curious why the data is correctly received through RequestBin but not on the actual server-side of the local app?

javascriptexpresspostwebhooksbody-parser

Answer №1

If you're encountering issues with your request in express, it may be because you are not handling the Typeform webhook results correctly. Make sure to utilize the body-parser module to properly access the data.

For guidance, refer to this repository: https://github.com/TypeformIO/SimpleLiveReports/blob/master/index.js

The key steps:

Import body-parser

var bodyParser = require('body-parser')

Implement it as middleware

app.use(bodyParser.json());

Retrieve data using req.body, like so:

app.post('/receive_results', function handleReceiveResults(req, res) {
    console.log('Got results!');
    var body = req.body;
    saveAnswers(body.token, body.answers, body.uid);
    res.send('Ok!');
});

Upon following this method, req.body should contain the submission results. Reach out if you encounter any further difficulties!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Monitor the completion status of all Ajax requests using only JavaScript

I am aware of the ajaxStop method in jQuery. $(document).ajaxStop(function() { //Do something }); If jQuery is not available, is there a way to achieve this with pure JavaScript instead? If so, could you please provide an example? Thanks ...

javascriptajaxrequest

Issue with handling multiple messages in WebSocket responses as Promises

In my web project using angularjs, I have the task of downloading data every second via a WebSocket. However, I encounter issues with handling multiple requests of different types. Although I utilize Promises to structure the requests, sometimes the respon ...

javascriptangularjswebsocketpromise

Utilizing MongoDB's filter method to query data with the flexibility of including

How can I create a method in node js using mongodb to filter users based on the following criteria: both batch and course only batch if course is not entered only course if batch is not entered // Filtering students by either course or batch export c ...

node.jsmongodbexpressmern

"Unraveling Vue.js: A guide to fetching JSON data one object at a time

I am facing a challenge with a large JSON file (40 MB) that includes data on countries, their IDs, and a total sum that I need to calculate. { "0": { "id": 0, "country": "usa", "sum": 201, }, ...

javascriptjsonvue.jsvuejs2

Combine filter browsing with pagination functionality

I came across a pagination and filter search online that both function well independently. However, I am looking to merge them together. My goal is to have the pagination display as << [1][2] >> upon page load, and then adjust to <<[1]> ...

javascriptjqueryfilterpagination

Convert specific form inputs into an array

I have a form that includes various inputs, but the ones I am focusing on are labeled attributes[] and options[$index][]. Here is an example of the data found in my attributes[] input: Array ( [0] => Size [1] => Color [2] => Material ) Not ...

javascriptjquery

What is the best approach to storing and retrieving special characters ('+<>$") from a textfield into a database using PHP?

I have a form where users can enter a personal message with a subject. The data entered in the textarea is passed to a Javascript/jQuery function, which then sends it to a PHP file for storage in a database. However, I am encountering issues when special c ...

javascriptphpjquerymysqlajax

Tips on using constructor functions and the new keyword in Typescript

This is a demonstration taken from the MDN documentation showcasing the usage of the new keyword function Car(make, model, year) { this.make = make; this.model = model; this.year = year; } const car1 = new Car('Eagle', 'Talon TSi&apos ...

javascripttypescriptnew-operator

Having trouble with the ionic ion-nav-buttons not working on initial load?

My table view triggers the PixCtrl controller when a cell is clicked. If the connection is successful, data is retrieved using $http.get, otherwise sqlite is used. This setup works fine. However, I am facing an issue with my ion-nav-buttons being dynamic. ...

javascriptangularjsionic-framework

Submitting HTML form data to a Java class via JavaScript, following validation with JavaScript within a JSP file

I am struggling with posting data obtained from an html form created in a jsp file using javascript and sending it to a java class after validating the form data. I was exploring alternatives to Ajax since I am not well-versed with those tools, but if you ...

javascriptajaxhtmljsp

Create an Angular directive that highlights a div if any of its child inputs have focus

I've developed an Angular directive for a repetitive section containing form elements. My aim is to have the entire section highlighted whenever any input field inside it is focused. template.html <div class="col-md-12 employee-section"> <l ...

javascriptjquerycssangularjshtml

How to personalize your Fullcalendar event tooltips with custom profile images

I recently integrated the Fullcalendar plugin by Adam Shaw with Bootstrap 3 on my website to display events created by users. Each event has a popover script that provides additional information when clicked. One feature I would like to add is displaying ...

javascriptjqueryjsonfullcalendarpopover

Unexpected behavior from Internet Explorer - Span contents remain unchanged despite valid input

I have a simple question because I'm feeling a bit lost. Check out this JSFiddle link It seems that in Internet Explorer, the contents of my span won't update even though the input is valid. However, in other browsers, the span content changes ...

javascriptjquerycsshtml

"Function.click operates successfully when no arguments are given, but encounters issues when arguments are supplied

I had a function that was functioning correctly: $('#buttFurniture').click(onFilterCLick); However, when I decided to pass arguments to the function, it stopped working: $('#buttFurniture').click(onFilterCLick(arrOutput, arrFurniture ...

javascriptjqueryhtmlarrays

What is the process for setting a personalized title for error pages in Remix?

I'm currently working on setting up the 404 page for my Remix app, but I'm facing challenges when it comes to configuring the <title> meta tag for these pages. Within my root.tsx file, I have defined a MetaFunction and a CatchBoundary: exp ...

javascriptreactjsremix.run

Error occurs when a callback is not utilized in Node.js, Express, and SQL Server Express interaction

When dealing with mssql, Nodejs, Gulp, Express, and SQL Server Express, an issue arises. While successfully logging in to SQL Server Express, the returned value becomes undefined when utilizing the bookRoute.js code snippet without callback. However, intro ...

node.jsexpresscallbackgulpsql-server-express

Is it possible to use function declaration and function expression interchangeably?

As I dive into learning about functions in Javascript, one thing that's causing confusion for me is the difference between function declaration and function expression. For example, if we take a look at this code snippet: function callFunction(fn) { ...

javascriptnode.jsfunctionfunctional-programming

Switching jQuery on various sections of a webpage

In my attempt to replicate the functionality of Facebook's Like button, I have encountered a challenge regarding where exactly to click in order to change the button state. When the button is not liked yet, users should be able to click anywhere on t ...

javascriptjquery

How can the background color of a DIV be altered based on the values of an array's minimum

Basically, I am fetching values from an array using AJAX. The background color will change from green to red based on the "aht_value". Currently, the colors are displaying correctly because I hardcoded the values in the calculation below. However, I want t ...

javascriptphpjquerycssajax

What is the best method for removing table rows with a specific class?

I have an html table with several rows, and for some of these rows the class someClass is applied. My question is: How can I delete the rows that have a specific class? <table> <tr class="someClass"> ...</tr> <tr class="someClass"> ...

javascriptjqueryhtml