tg-z / web-clip

26 stars 5 forks source link

Handling Node.js Request Bodies with Vercel - Vercel Guides #1061

Open tg-z opened 4 years ago

tg-z commented 4 years ago

In this guide, we will show you how to parse a Node.js request body, for use inside a Serverless Function deployed to Vercel, without requiring a framework such as Express.

This guide assumes the request is sent with a Content-Type of application/json. However, many more content types can be parsed if required.

Step 1: Creating the Function

To get started, create a project directory with an /api directory inside and cd into it:

mkdir req-body && mkdir req-body/api

Creating an /api directory inside of a /req-body project.

Moving into the /req-body project directory.

To illustrate the parsing of a request body, create an index.js file inside your /api directory with the following code:

module.exports = async (req, res) => {
  const { body } = req
  res.end(`Hello ${body.name}, you just parsed the request body!`)
}

An example of how to parse a request body using Node.js with a Helper property.

This function takes a POST request, parses the body, and uses data from the body in the response.

The key part here is line 2. Vercel adds a number of Express like helper properties to make wording with Node.js even easier.

With the req.body helper, the incoming request is parsed automatically, removing the need for third-party libraries or further code to handle the ReadableStream format the request normally arrives in.

Step 2: Deploying the Function

Deploying your function to Vercel can be done with a single command:

Deploying the app with the vercel command.

You have now created and deployed your project, all that's left to do is test that it works.

Step 3: Sending the Request

To verify that the JSON is being parsed correctly, make a POST request to your new deployment using curl by executing the below code inside your terminal:

curl -X POST "https://your-deployments-url.now.sh/api" \
  -H "Content-Type: application/json" \
  -d '{
  "name": "Reader"
}'

Making a POST request using curl.

Note: You should change the URL to match the one for your deployment given to you in the Vercel CLI.

You will receive a response similar to the following:

Hello Reader, you just parsed the request body!

An example response from making a POST request.

Congratulations, now you know how to parse request bodies with Vercel in Node.js!

Bonus: Understanding Why this Works

When Node.js receives a request, the body is in the format of a ReadableStream.

To get the data from the stream, you need to listen to its data and end events. To do this requires a few lines of code which you would much rather not have to repeat.

By using helper properties, the request is already parsed for you, allowing you to access the data immediately. https://vercel.com/guides/handling-node-request-body https://vercel.com/guides/handling-node-request-body