Expires directive in Nginx - Step-by-Step Execution

Process Flow - Expires directive

Client requests resource

↓

Nginx checks Expires directive

↓

Calculate expiration time

↓

Add Expires header to response

↓

Send response with Expires header

↓

Client caches resource until expiration

↓

After expiration, client requests resource again

This flow shows how nginx uses the Expires directive to tell browsers when a resource should be considered fresh or stale.

Execution Sample

Nginx

location /images/ {
    expires 30d;
}

This configuration tells nginx to add an Expires header to resources under /images/ that makes browsers cache them for 30 days.

Process Table

Step	Action	Expires Directive Value	Expires Header Sent	Effect on Client
1	Client requests /images/logo.png	30d	Expires: current_time + 30 days	Client caches resource for 30 days
2	Client requests /images/banner.jpg before 30 days	30d	Expires header still valid	Client uses cached resource, no new request sent
3	Client requests /images/banner.jpg after 30 days	30d	Expires header expired	Client sends new request to server
4	Server responds with new Expires header	30d	Expires: current_time + 30 days	Client caches updated resource again

💡 Client stops using cached resource after expiration time passes, triggering a new request

Status Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	After Step 4
Expires Header	None	current_time + 30 days	current_time + 30 days (still valid)	Expired	current_time + 30 days (new)
Client Cache State	Empty	Cached resource valid	Cached resource valid	Cache expired	Cached resource valid

Key Moments - 2 Insights

Why does the client not request the resource again before the expiration time?

Because the Expires header tells the client the resource is still fresh, so it uses the cached copy without asking the server again, as shown in execution_table row 2.

What happens when the expiration time passes?

The client considers the cached resource stale and sends a new request to the server, as shown in execution_table row 3.

Visual Quiz - 3 Questions

Look at the execution table, what is the Expires header value sent at step 1?

A Expires: current_time + 30 days

B Expires: current_time + 1 day

C Expires: current_time + 1 hour

D No Expires header sent

💡 Hint

Check the 'Expires Header Sent' column in execution_table row 1

At which step does the client send a new request because the cached resource expired?

A Step 1

B Step 3

C Step 2

D Step 4

💡 Hint

Look at the 'Effect on Client' column in execution_table row 3

If the expires directive was changed to '10d', how would the client's cache state change after step 2?

A Cache would never expire

B Cache would expire after 30 days

C Cache would expire after 10 days instead of 30

D Cache would expire immediately

💡 Hint

Refer to variable_tracker for 'Client Cache State' and how expiration time affects caching

Concept Snapshot

Expires directive in nginx sets how long browsers cache resources.
Syntax: expires <time>;
Example: expires 30d; caches for 30 days.
Nginx adds Expires header with future date.
Browsers use this to avoid re-requesting until expired.
Helps improve site speed by reducing server load.

Full Transcript

The Expires directive in nginx tells browsers how long to keep a resource cached. When a client requests a resource, nginx adds an Expires header with a date in the future based on the directive value. The client then caches the resource and uses it without asking the server again until the expiration date passes. After expiration, the client requests the resource again, and nginx sends a new Expires header to refresh the cache. This process helps reduce server load and speeds up page loading by avoiding unnecessary requests.

Practice

1. What is the main purpose of the expires directive in an nginx configuration?

easy

A. To specify the file upload size limit

B. To control how long browsers cache files before requesting them again

C. To limit the number of simultaneous connections

D. To set the server's time zone

Solution

1. Step 1: Understand the role of expires in nginx

   The expires directive tells browsers how long to keep files cached before checking for updates.

2. Step 2: Compare options with this function

   Only To control how long browsers cache files before requesting them again matches this purpose; others relate to different server settings.

3. Final Answer:

   To control how long browsers cache files before requesting them again -> Option B

4. Quick Check:

   Expires directive = browser cache time [OK]

Hint: Expires controls browser cache duration for files [OK]

Common Mistakes:

• Confusing expires with server timezone settings
• Thinking expires limits connections
• Mixing expires with upload size limits

2. Which of the following is the correct syntax to set the expires directive to 1 day in nginx?

easy

A. expires = 1 day;

B. expires 1 day

C. expires 24hours;

D. expires 1d;

Solution

1. Step 1: Recall nginx expires syntax

   The correct syntax uses a time value followed by a semicolon, e.g., expires 1d; for one day.

2. Step 2: Check each option for syntax correctness

   expires = 1 day; uses invalid '=' and full word 'day'; expires 1 day lacks semicolon; expires 24hours; uses invalid time unit '24hours'. Only B matches correct syntax: expires 1d;.

3. Final Answer:

   expires 1d; -> Option D

4. Quick Check:

   Correct syntax ends with semicolon and uses short time unit [OK]

Hint: Use short time units with semicolon, like 'expires 1d;' [OK]

Common Mistakes:

• Omitting semicolon at the end
• Using spaces in time value
• Writing full words like 'day' instead of 'd'

3. Given this nginx config snippet:

location ~* \.(jpg|jpeg|png)$ {
  expires 30d;
}

What will the browser do when accessing a PNG file?

medium

A. Cache the PNG file for 30 seconds

B. Never cache the PNG file

C. Cache the PNG file for 30 days before re-requesting

D. Immediately re-request the PNG file every time

Solution

1. Step 1: Analyze the regex and expires directive

   The location matches .jpg, .jpeg, and .png files and sets expires 30d;, meaning 30 days caching.

2. Step 2: Understand browser caching behavior

   Browsers will keep the PNG file cached for 30 days before checking for updates.

3. Final Answer:

   Cache the PNG file for 30 days before re-requesting -> Option C

4. Quick Check:

   Expires 30d means 30 days cache [OK]

Hint: Regex matches file types; expires sets cache time [OK]

Common Mistakes:

• Confusing days with seconds
• Ignoring regex file matching
• Assuming no caching without explicit 'no-cache'

4. Identify the error in this nginx config:

location /static/ {
  expires 10days;
}

medium

A. The time unit '10days' is invalid; should be '10d'

B. Missing semicolon after expires directive

C. Location block syntax is incorrect

D. Expires directive cannot be used inside location

Solution

1. Step 1: Check the expires time unit

   The correct time unit uses short forms like 'd' for days. '10days' is invalid syntax.

2. Step 2: Verify other syntax elements

   Semicolon is present, location syntax is correct, and expires can be used inside location.

3. Final Answer:

   The time unit '10days' is invalid; should be '10d' -> Option A

4. Quick Check:

   Use short time units like 'd' not full words [OK]

Hint: Use short units like 'd' for days, not full words [OK]

Common Mistakes:

• Writing full words for time units
• Forgetting semicolon (not the case here)
• Thinking expires can't be in location block

5. You want to set caching so that CSS files are cached for 7 days, but HTML files are never cached. Which nginx config snippet achieves this?

hard

A. location ~* \.css$ { expires 7d; } location ~* \.html$ { expires -1; }

B. location ~* \.css$ { expires 7d; } location ~* \.html$ { expires 0; }

C. location ~* \.css$ { expires 7d; } location ~* \.html$ { expires off; }

D. location ~* \.css$ { expires 7d; } location ~* \.html$ { expires never; }

Solution

1. Step 1: Recall how to disable caching in nginx

   Setting expires -1; disables caching (forces no cache) for files.

2. Step 2: Check each option for correct disables and enables

   location ~* \.css$ { expires 7d; } location ~* \.html$ { expires -1; } uses expires 7d; for CSS and expires -1; for HTML, which is correct. Others use invalid or incorrect values.

3. Final Answer:

   location ~* \.css$ { expires 7d; } location ~* \.html$ { expires -1; } -> Option A

4. Quick Check:

   Use 'expires -1;' to disable caching [OK]

Hint: Use 'expires -1;' to disable caching for files [OK]

Common Mistakes:

• Using 'expires off;' which is invalid
• Using 'expires 0;' which sets immediate expiry but not no-cache
• Using 'expires never;' which is not valid syntax