ETag and conditional requests in Node.js - Mini Project: Build & Apply

ETag and Conditional Requests in Node.js

📖 Scenario: You are building a simple Node.js server that serves a text file. To improve efficiency, you want to use ETag headers so the server can tell the browser if the file has changed. If the file is unchanged, the server will respond with a 304 status, telling the browser to use its cached copy.

🎯 Goal: Build a Node.js server that sends an ETag header with the file content. The server should check the If-None-Match header from the request and respond with 304 Not Modified if the ETag matches, or send the file content with a 200 OK status if it does not.

📋 What You'll Learn

Create a variable with the file content string exactly as specified

Create a variable that stores the ETag string for the file content

Write a server request handler that checks the If-None-Match header

Send a 304 status if the ETag matches, otherwise send the file content with the ETag header

💡 Why This Matters

🌍 Real World

ETags help browsers cache files efficiently by letting servers tell if a file has changed. This reduces data usage and speeds up page loads.

💼 Career

Understanding ETags and conditional requests is important for backend developers working on web servers and APIs to optimize performance and bandwidth.

1

DATA SETUP: Create the file content variable

Create a variable called fileContent and set it to the string 'Hello, this is the file content.'

Node.js

# Create a variable called fileContent with the exact string
# Your code here

Hint

Use const fileContent = 'Hello, this is the file content.'; to create the variable.

2

CONFIGURATION: Create the ETag variable

Create a variable called etag and set it to the string '"12345"' (including the quotes inside the string)

Node.js

const fileContent = 'Hello, this is the file content.';
# Create a variable called etag with the string '"12345"'
# Your code here

Hint

Remember to include the double quotes inside the string for the ETag value.

3

CORE LOGIC: Write the request handler to check If-None-Match

Write a function called requestHandler that takes req and res as parameters. Inside it, get the If-None-Match header from req.headers and store it in a variable called ifNoneMatch. Then use an if statement to check if ifNoneMatch equals the etag variable.

Node.js

const fileContent = 'Hello, this is the file content.';
const etag = '"12345"';

// Write the requestHandler function
// Your code here

Hint

Use req.headers['if-none-match'] to get the header value.

4

COMPLETION: Complete the response logic with 304 or 200 and ETag

Inside the requestHandler function, complete the if block to send a 304 status with res.statusCode = 304 and res.end(). In the else block, set res.statusCode = 200, set the ETag header to the etag variable using res.setHeader, and send the fileContent with res.end(fileContent).

Node.js

const fileContent = 'Hello, this is the file content.';
const etag = '"12345"';

function requestHandler(req, res) {
    const ifNoneMatch = req.headers['if-none-match'];
    if (ifNoneMatch === etag) {
        // Send 304 status and end response
        // Your code here
    } else {
        // Send 200 status, set ETag header, and send fileContent
        // Your code here
    }
}

Hint

Use res.statusCode, res.setHeader, and res.end() to send the response.

Practice

1. What is the main purpose of using an ETag in HTTP responses in Node.js?

easy

A. To set the cache expiration time

B. To encrypt the response data for security

C. To specify the content type of the response

D. To help browsers check if the content has changed and avoid re-downloading unchanged data

Solution

1. Step 1: Understand what ETag represents

   ETag is a unique identifier for a specific version of a resource, used to detect changes.

2. Step 2: Identify its role in HTTP caching

   Browsers use ETag to check if the resource changed since last download, avoiding unnecessary data transfer.

3. Final Answer:

   To help browsers check if the content has changed and avoid re-downloading unchanged data -> Option D

4. Quick Check:

   ETag purpose = avoid re-download [OK]

Hint: ETag means "same content? skip download" [OK]

Common Mistakes:

• Confusing ETag with encryption
• Thinking ETag sets content type
• Mixing ETag with cache expiration headers

2. Which of the following is the correct way to set an ETag header in a Node.js HTTP response?

easy

A. res.setHeader('ETag', '12345')

B. res.header('etag', 12345)

C. res.etag = '12345'

D. res.set('ETag', 12345)

Solution

1. Step 1: Recall Node.js HTTP response header syntax

   Use res.setHeader(name, value) to set headers correctly.

2. Step 2: Check the correct header name and value type

   Header name is case-insensitive but usually 'ETag', and value must be a string.

3. Final Answer:

   res.setHeader('ETag', '12345') -> Option A

4. Quick Check:

   Set header with res.setHeader('ETag', value) [OK]

Hint: Use res.setHeader('ETag', 'value') to set ETag [OK]

Common Mistakes:

• Using incorrect method names like res.header or res.set
• Passing number instead of string as header value
• Trying to assign ETag directly as a property

3. Consider this Node.js code snippet handling a request with an ETag check:

const etag = 'abc123';
if (req.headers['if-none-match'] === etag) {
  res.statusCode = 304;
  res.end();
} else {
  res.setHeader('ETag', etag);
  res.end('Hello World');
}

What will the server respond if the client sends header If-None-Match: abc123?

medium

A. Respond with status 200 and body 'Hello World'

B. Respond with status 500 Internal Server Error

C. Respond with status 304 and no body

D. Respond with status 404 Not Found

Solution

1. Step 1: Check the condition comparing If-None-Match header

   The code compares req.headers['if-none-match'] to etag which is 'abc123'. If equal, it sets status 304.

2. Step 2: Understand HTTP 304 meaning

   Status 304 means Not Modified, so no body is sent and client uses cached content.

3. Final Answer:

   Respond with status 304 and no body -> Option C

4. Quick Check:

   If-None-Match matches ETag = 304 no body [OK]

Hint: If-None-Match equals ETag means 304 Not Modified [OK]

Common Mistakes:

• Thinking 304 responses include body content
• Confusing 304 with 200 OK
• Ignoring the If-None-Match header check

4. This Node.js code tries to handle ETag conditional requests but has a bug:

const etag = 'xyz789';
if (req.headers['If-None-Match'] === etag) {
  res.statusCode = 304;
  res.end();
} else {
  res.setHeader('etag', etag);
  res.end('Content');
}

What is the bug causing the ETag check to fail?

medium

A. ETag value should be a number, not a string

B. Header name case mismatch: 'If-None-Match' vs 'if-none-match'

C. res.end() is missing a callback function

D. res.statusCode must be set after res.end()

Solution

1. Step 1: Check header name case sensitivity in Node.js

   Node.js lowercases all incoming header names, so req.headers['If-None-Match'] is undefined; correct is req.headers['if-none-match'].

2. Step 2: Confirm impact on ETag comparison

   Because the header is undefined, the condition never matches, so 304 is never sent.

3. Final Answer:

   Header name case mismatch: 'If-None-Match' vs 'if-none-match' -> Option B

4. Quick Check:

   Headers lowercase in Node.js = use 'if-none-match' [OK]

Hint: Node.js headers are lowercase keys [OK]

Common Mistakes:

• Using wrong case for header keys
• Thinking ETag must be numeric
• Misordering res.statusCode and res.end()

5. You want to optimize your Node.js server to use ETags and respond with 304 when content is unchanged. Which approach correctly combines generating an ETag and handling conditional requests?

hard

A. Generate a hash of the response body, set it as ETag header, then compare with req.headers['if-none-match'] to decide 304 or 200

B. Always send status 200 with ETag header, ignoring If-None-Match header

C. Set ETag header only on POST requests and ignore GET requests

D. Use res.setHeader('Cache-Control', 'no-store') to disable caching instead of ETags

Solution

1. Step 1: Understand ETag generation

   ETags should uniquely represent the current content, often by hashing the response body.

2. Step 2: Use conditional request header to decide response

   Compare req.headers['if-none-match'] with generated ETag; if equal, respond 304, else send content with new ETag.

3. Final Answer:

   Generate a hash of the response body, set it as ETag header, then compare with req.headers['if-none-match'] to decide 304 or 200 -> Option A

4. Quick Check:

   Hash body -> set ETag -> compare If-None-Match -> 304 or 200 [OK]

Hint: Hash content, set ETag, compare If-None-Match for 304 [OK]

Common Mistakes:

• Ignoring If-None-Match header
• Sending 200 always without checking ETag
• Misusing Cache-Control to replace ETag logic