SiteTidy
Home /Tools /Nginx Cache Header Generator

Nginx Cache Header Generator

Leverage browser caching by generating optimal expires directives for your Nginx configuration.

Nginx Cache Gen

Instantly generate robust Nginx block configurations for static asset caching, performance, and log optimization.

Cache Durations

Behavior Flags

nginx.conf
"text-emerald-400 font-bold">location ~* \.(jpg|jpeg|gif|png|ico|webp|svg|svgz|mp4|webm|ogg|mp3|wav|mov)$ {
    "text-emerald-400 font-bold">expires 1y;
    "text-emerald-400 font-bold">access_log off;
    "text-emerald-400 font-bold">add_header Cache-Control "public";
}

"text-emerald-400 font-bold">location ~* \.(css|js)$ {
    "text-emerald-400 font-bold">expires 1M;
    "text-emerald-400 font-bold">access_log off;
    "text-emerald-400 font-bold">add_header Cache-Control "public";
    "text-emerald-400 font-bold">add_header Vary "Accept-Encoding";
}

"text-emerald-400 font-bold">location ~* \.(eot|otf|ttf|ttc|woff|woff2)$ {
    "text-emerald-400 font-bold">expires 1y;
    "text-emerald-400 font-bold">access_log off;
    "text-emerald-400 font-bold">add_header Cache-Control "public";
    "text-emerald-400 font-bold">add_header Vary "Accept-Encoding";
}

"text-emerald-400 font-bold">location ~* \.(html|htm)$ {
    "text-emerald-400 font-bold">expires -1;
    "text-emerald-400 font-bold">access_log off;
    "text-emerald-400 font-bold">add_header Cache-Control "no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0";
}

How to configure Nginx Caching

Every time a user visits your website, their browser has to download all the assets (HTML, CSS, JS, Images). By adding expires directives to your Nginx configuration, you tell the browser to store certain files locally for a specific amount of time.

Paste the generated code inside your server { ... } block in your Nginx config file (usually located at /etc/nginx/sites-available/default or /etc/nginx/nginx.conf).

What is "Cache Busting"?

If you set your CSS to cache for 1 Year, returning visitors won't see your design updates for a whole year! To solve this, you use Cache Busting. When you update your CSS file, you change its name in the HTML link (e.g. from style.css to style.v2.css or style.css?v=2). The browser sees a "new" URL, fetches the fresh file, and then caches it for another year. If you use cache busting, it's highly recommended to set CSS/JS caches to 1 Year.

Nginx Time Formats

Nginx uses strict abbreviations for time:s (seconds), m (minutes), h (hours), d (days), w (weeks), M (months, 30 days), y (years, 365 days). Setting it to -1 tells Nginx not to cache the file.

Related Guides

Deepen your understanding with our expert articles.