Conditional requests handling in Express - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to check if the request has an 'If-None-Match' header.

Express

if (req.headers['[1]']) {
  res.status(304).end();
}

Drag options to blanks, or click blank then click option'

Aif-match

Betag

Ccache-control

Dif-none-match

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'etag' header instead of 'if-none-match'.

Checking 'if-match' which is for a different condition.

The 'If-None-Match' header is used to make conditional requests based on ETag values.

2fill in blank

medium

Complete the code to set the ETag header in the response.

Express

res.set('[1]', '12345');

Drag options to blanks, or click blank then click option'

ACache-Control

BLast-Modified

CETag

DContent-Type

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'Cache-Control' instead of 'ETag'.

Setting 'Last-Modified' when ETag is needed.

The 'ETag' header is used to identify a specific version of a resource.

3fill in blank

hard

Fix the error in the code to properly send a 304 Not Modified response.

Express

if (req.headers['if-none-match'] === etag) {
  res.[1](304).end();
}

Drag options to blanks, or click blank then click option'

Astatus

Bwrite

CwriteHead

Dsend

Attempts:

3 left

💡 Hint

Common Mistakes

Using send(304) which sends 304 as body, not status.

Using write() without ending the response.

Use res.status(304).end() to set the status code and end the response.

4fill in blank

hard

Fill both blanks to create a middleware that checks ETag and sends 304 if matched.

Express

app.use((req, res, next) => {
  const etag = 'abc123';
  if (req.headers['[1]'] === etag) {
    res.[2](304).end();
  } else {
    res.set('ETag', etag);
    next();
  }
});

Drag options to blanks, or click blank then click option'

Aif-none-match

Betag

Cstatus

Dsend

Attempts:

3 left

💡 Hint

Common Mistakes

Checking 'etag' header instead of 'if-none-match'.

Using 'send' instead of 'status' to set the status code.

The middleware checks the 'If-None-Match' header and uses res.status(304).end() to respond.

5fill in blank

hard

Fill all three blanks to create a route that handles conditional GET with ETag and Last-Modified.

Express

app.get('/resource', (req, res) => {
  const etag = 'xyz789';
  const lastModified = new Date('2024-01-01');
  res.set('[1]', etag);
  res.set('[2]', lastModified.toUTCString());
  if (req.headers['if-none-match'] === etag || (req.headers['if-modified-since'] && new Date(req.headers['if-modified-since']) >= lastModified)) {
    res.[3](304).end();
  } else {
    res.send('Resource content');
  }
});

Drag options to blanks, or click blank then click option'

AETag

BLast-Modified

Cstatus

Dsend

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up header names or casing.

Using 'send' instead of 'status' to set the status code.

The route sets both 'ETag' and 'Last-Modified' headers and uses res.status(304).end() to respond if the resource is unchanged.