Parsing request body (JSON and form data) in Node.js - Step-by-Step Execution

Concept Flow - Parsing request body (JSON and form data)

Client sends HTTP request

↓

Server receives request

↓

Check Content-Type header

↓

Parse JSON body

↓

Store parsed data in req.body

↓

Use req.body in route handler

↓

Send response

The server checks the request's Content-Type to decide how to parse the body, then stores the parsed data for use in the route.

Execution Sample

Node.js

import express from 'express';
const app = express();
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
app.post('/submit', (req, res) => {
  res.json(req.body);
});

This code sets up an Express server that parses JSON and form data bodies, then echoes back the parsed data.

Execution Table

Step	Action	Content-Type	Parsing Method	req.body Content	Response Sent
1	Receive POST /submit	application/json	Check Content-Type	{}	No
2	Parse body	application/json	express.json() middleware	{"name":"Alice"}	No
3	Route handler runs	application/json	Use req.body	{"name":"Alice"}	No
4	Send response	application/json	Send JSON response	{"name":"Alice"}	Yes
5	Receive POST /submit	application/x-www-form-urlencoded	Check Content-Type	{}	No
6	Parse body	application/x-www-form-urlencoded	express.urlencoded() middleware	{"name":"Bob","age":"30"}	No
7	Route handler runs	application/x-www-form-urlencoded	Use req.body	{"name":"Bob","age":"30"}	No
8	Send response	application/x-www-form-urlencoded	Send JSON response	{"name":"Bob","age":"30"}	Yes
9	Receive POST /submit	text/plain	Check Content-Type	{}	No
10	Parse body	text/plain	No parser matches	{}	No
11	Route handler runs	text/plain	req.body empty	{}	No
12	Send response	text/plain	Send JSON response	{}	Yes

💡 Parsing stops after sending response or when no matching parser is found.

Variable Tracker

Variable	Start	After Step 2	After Step 6	After Step 10	Final
req.body	{}	{"name":"Alice"}	{"name":"Bob","age":"30"}	{}	{}

Key Moments - 3 Insights

Why is req.body empty when Content-Type is text/plain?

Because express.json() and express.urlencoded() only parse JSON and form data. No parser runs for text/plain, so req.body stays empty as shown in steps 9-11.

How does the server know which parser to use?

The server checks the Content-Type header (step 1 and 5). If it is application/json, express.json() parses the body. If it is application/x-www-form-urlencoded, express.urlencoded() parses it.

Why is age a string in req.body after form data parsing?

Form data values are always strings by default, so age is "30" as a string, not a number, as seen in step 7.

Visual Quiz - 3 Questions

Look at the execution table, what is req.body content after step 6?

A {"name":"Bob","age":"30"}

B {"name":"Alice"}

C {}

D null

💡 Hint

Check the 'req.body Content' column at step 6 in the execution_table.

At which step does the server send the response for a JSON request?

A Step 3

B Step 4

C Step 2

D Step 1

💡 Hint

Look for 'Response Sent' marked 'Yes' for application/json in the execution_table.

If the Content-Type was missing, what would req.body be?

A null

B {"name":"Alice"}

C {}

D undefined

💡 Hint

Refer to steps where no matching parser runs and req.body remains empty.

Concept Snapshot

Parsing request body in Node.js with Express:
- Use express.json() to parse JSON bodies.
- Use express.urlencoded({ extended: true }) to parse form data.
- Server checks Content-Type header to pick parser.
- Parsed data is stored in req.body.
- If Content-Type is unsupported, req.body is empty.
- Use req.body in route handlers to access client data.

Full Transcript

When a client sends a POST request, the server first checks the Content-Type header to decide how to parse the body. If the Content-Type is application/json, the express.json() middleware parses the JSON string into a JavaScript object and stores it in req.body. If the Content-Type is application/x-www-form-urlencoded, the express.urlencoded() middleware parses the form data string into an object with string values and stores it in req.body. If the Content-Type is unsupported, no parser runs and req.body remains empty. The route handler then uses req.body to access the parsed data and sends it back as a JSON response. This process ensures the server understands the client's data format and can work with it easily.

Practice

1. What does express.json() middleware do in a Node.js Express app?

easy

A. It serves static JSON files from the server.

B. It parses URL query parameters and stores them in req.query.

C. It encrypts JSON data before sending it to the client.

D. It parses incoming JSON request bodies and makes the data available in req.body.

Solution

1. Step 1: Understand express.json() purpose

   This middleware parses JSON data sent in the request body, converting it into a JavaScript object.

2. Step 2: Know where parsed data is stored

   The parsed object is assigned to req.body so route handlers can access it easily.

3. Final Answer:

   It parses incoming JSON request bodies and makes the data available in req.body. -> Option D

4. Quick Check:

   express.json() parses JSON body = C [OK]

Hint: express.json() parses JSON body into req.body [OK]

Common Mistakes:

• Confusing express.json() with parsing URL query parameters
• Thinking it serves static files
• Assuming it encrypts data

2. Which middleware correctly parses URL-encoded form data in Express?

easy

A. app.use(express.urlencoded({ extended: true }))

B. app.use(express.json())

C. app.use(express.static('public'))

D. app.use(bodyParser.raw())

Solution

1. Step 1: Identify middleware for form data

   express.urlencoded() parses URL-encoded form data sent by HTML forms.

2. Step 2: Check correct usage

   Using { extended: true } allows rich objects and arrays to be encoded.

3. Final Answer:

   app.use(express.urlencoded({ extended: true })) -> Option A

4. Quick Check:

   express.urlencoded() parses form data = A [OK]

Hint: Use express.urlencoded() for form data parsing [OK]

Common Mistakes:

• Using express.json() for form data
• Confusing static file serving with parsing
• Using bodyParser.raw() instead of urlencoded

3. Given this Express route, what will console.log(req.body) output if the client sends JSON {"name":"Alice"}?

app.use(express.json());
app.post('/user', (req, res) => {
  console.log(req.body);
  res.send('Received');
});

medium

A. { name: 'Alice' }

B. undefined

C. An empty object {}

D. A string '{"name":"Alice"}'

Solution

1. Step 1: Middleware parses JSON body

   express.json() converts JSON string into a JavaScript object and assigns it to req.body.

2. Step 2: Logging req.body shows parsed object

   console.log prints the object { name: 'Alice' }.

3. Final Answer:

   { name: 'Alice' } -> Option A

4. Quick Check:

   express.json() parses JSON to object = B [OK]

Hint: express.json() parses JSON string to object in req.body [OK]

Common Mistakes:

• Expecting req.body to be a string
• Not using express.json() middleware
• Assuming req.body is undefined

4. Why does req.body remain undefined in this Express app?

const express = require('express');
const app = express();

app.post('/submit', (req, res) => {
  console.log(req.body);
  res.send('Done');
});

app.listen(3000);

medium

A. Because the server is not listening on port 3000.

B. Because the route path is incorrect.

C. Because the app is missing middleware to parse the request body.

D. Because console.log cannot print req.body.

Solution

1. Step 1: Check middleware usage

   The app does not use express.json() or express.urlencoded(), so request bodies are not parsed.

2. Step 2: Understand req.body behavior

   Without parsing middleware, req.body is undefined because Express does not parse request bodies by default.

3. Final Answer:

   Because the app is missing middleware to parse the request body. -> Option C

4. Quick Check:

   Missing body parser middleware = D [OK]

Hint: Always add body parser middleware to access req.body [OK]

Common Mistakes:

• Assuming req.body is always available
• Blaming route path or console.log
• Ignoring middleware setup

5. You want to accept both JSON and URL-encoded form data in your Express app. Which setup correctly parses both types so req.body works for all POST requests?

hard

A. app.use(express.urlencoded({ extended: false })); app.use(express.json());

B. app.use(express.json()); app.use(express.urlencoded({ extended: true }));

C. app.use(express.json()); app.use(express.urlencoded({ extended: false }));

D. app.use(bodyParser.json()); app.use(bodyParser.urlencoded());

Solution

1. Step 1: Identify middleware for both data types

   express.json() parses JSON bodies; express.urlencoded({ extended: true }) parses form data with rich objects.

2. Step 2: Confirm correct order and options

   Both middlewares should be used; extended: true allows nested objects in form data.

3. Final Answer:

   app.use(express.json()); app.use(express.urlencoded({ extended: true })); -> Option B

4. Quick Check:

   Use both express.json() and express.urlencoded({ extended: true }) = A [OK]

Hint: Use both express.json() and express.urlencoded({ extended: true }) [OK]

Common Mistakes:

• Using extended: false limits form data parsing
• Using deprecated bodyParser package
• Not including both middlewares