Why req.headers for HTTP headers in Express? - Purpose & Use Cases

The Big Idea

Discover how a simple object can save you hours of headache parsing HTTP headers!

The Scenario

Imagine building a web server that needs to check user info from HTTP headers manually by parsing raw request data byte by byte.

The Problem

Manually parsing HTTP headers is slow, error-prone, and complicated because headers can vary in format and order, making your code fragile and hard to maintain.

The Solution

The req.headers object in Express automatically parses all HTTP headers into an easy-to-use JavaScript object, so you can access any header by name instantly.

Before vs After

✗ Before

const rawHeaders = request.rawHeaders;
// manually loop and parse headers from rawHeaders array

✓ After

const userAgent = req.headers['user-agent'];
console.log(userAgent);

What It Enables

You can quickly and reliably read any HTTP header to customize responses or handle authentication without worrying about parsing details.

Real Life Example

Checking the Authorization header to verify a user's token before allowing access to protected routes.

Key Takeaways

Manual header parsing is complex and fragile.

req.headers gives a clean, ready-to-use object of all headers.

This makes handling HTTP headers simple, fast, and reliable.

Practice

1. What does req.headers represent in an Express app?

easy

A. A function to send headers to the client

B. An object containing all HTTP headers sent by the client

C. A string with the URL path of the request

D. A number representing the HTTP status code

Solution

1. Step 1: Understand the role of req.headers

   req.headers holds all headers sent by the client in the HTTP request.

2. Step 2: Identify what req.headers contains

   It is an object with keys as header names (lowercase) and values as header values.

3. Final Answer:

   An object containing all HTTP headers sent by the client -> Option B

4. Quick Check:

   req.headers = client headers [OK]

Hint: Remember: req.headers holds client headers as an object [OK]

Common Mistakes:

• Thinking req.headers is a function
• Confusing headers with URL or status code
• Expecting headers keys to be uppercase

2. Which of the following is the correct way to access the 'content-type' header from req.headers?

easy

A. req.headers.Content-Type

B. req.headers['Content-Type']

C. req.headers.contentType

D. req.headers['content-type']

Solution

1. Step 1: Recall header key casing in req.headers

   Headers keys are always lowercase in req.headers.

2. Step 2: Choose the correct syntax to access the header

   Use bracket notation with lowercase key: req.headers['content-type'].

3. Final Answer:

   req.headers['content-type'] -> Option D

4. Quick Check:

   Headers keys are lowercase strings [OK]

Hint: Use lowercase keys with bracket notation for headers [OK]

Common Mistakes:

• Using camelCase or uppercase keys
• Using dot notation with hyphenated keys
• Assuming headers keys keep original case

3. Given this Express code snippet:

app.get('/', (req, res) => {
  const userAgent = req.headers['user-agent'];
  res.send(userAgent);
});

What will the server send back to the client?

medium

A. An error because 'user-agent' is not a valid header

B. The server's operating system name

C. The client's browser user agent string

D. An empty string

Solution

1. Step 1: Identify what req.headers['user-agent'] contains

   This header holds the client's browser and system info string.

2. Step 2: Understand the response sent

   The server sends back this string as the response body using res.send().

3. Final Answer:

   The client's browser user agent string -> Option C

4. Quick Check:

   req.headers['user-agent'] = client info [OK]

Hint: User-Agent header shows client browser info [OK]

Common Mistakes:

• Thinking it returns server info
• Assuming 'user-agent' header is invalid
• Expecting an error or empty response

4. What is wrong with this code snippet?

app.get('/data', (req, res) => {
  const auth = req.headers.Authorization;
  if (!auth) {
    res.status(401).send('Unauthorized');
  } else {
    res.send('Access granted');
  }
});

medium

A. Header keys in req.headers are lowercase, so 'Authorization' should be 'authorization'

B. Header keys in req.headers are case-sensitive and 'Authorization' is correct

C. You cannot access headers directly from req.headers

D. res.status() cannot be chained with res.send()

Solution

1. Step 1: Check header key casing in req.headers

   All header keys are lowercase, so 'Authorization' is incorrect.

2. Step 2: Correct the header key usage

   Use req.headers.authorization to access the Authorization header properly.

3. Final Answer:

   Header keys in req.headers are lowercase, so 'Authorization' should be 'authorization' -> Option A

4. Quick Check:

   Headers keys are lowercase strings [OK]

Hint: Always use lowercase keys for req.headers access [OK]

Common Mistakes:

• Using uppercase or camelCase header keys
• Thinking headers are case-sensitive as sent
• Believing res.status() and res.send() can't chain

5. You want to check if a client sent a custom header named 'X-Client-Id' and respond with 'Client ID: <id>'. Which code correctly handles this in Express?

hard

A. const clientId = req.headers['x-client-id']; if(clientId) res.send(`Client ID: ${clientId}`); else res.send('No Client ID');

B. const clientId = req.headers.xClientId; if(clientId) res.send(`Client ID: ${clientId}`); else res.send('No Client ID');

C. const clientId = req.headers['X-Client-Id']; if(clientId) res.send(`Client ID: ${clientId}`); else res.send('No Client ID');

D. const clientId = req.headers.get('X-Client-Id'); if(clientId) res.send(`Client ID: ${clientId}`); else res.send('No Client ID');

Solution

1. Step 1: Understand header key casing in req.headers

   Headers keys are lowercase, so use req.headers['x-client-id'].

2. Step 2: Verify the correct way to access custom headers

   const clientId = req.headers['x-client-id']; if(clientId) res.send(`Client ID: ${clientId}`); else res.send('No Client ID'); uses lowercase key and bracket notation correctly to get the header value.

3. Step 3: Check other options

   const clientId = req.headers['X-Client-Id']; if(clientId) res.send(`Client ID: ${clientId}`); else res.send('No Client ID'); uses uppercase keys (wrong), B uses camelCase (wrong), D uses req.headers.get('X-Client-Id') which doesn't exist on req.headers.

4. Final Answer:

   const clientId = req.headers['x-client-id']; if(clientId) res.send(`Client ID: ${clientId}`); else res.send('No Client ID'); -> Option A

5. Quick Check:

   Headers keys lowercase in req.headers [OK]

Hint: Custom headers keys are lowercase in req.headers [OK]

Common Mistakes:

• Using uppercase or camelCase keys
• Confusing req.headers with req.get()
• Accessing headers with dot notation for hyphenated names