Configuring Nginx for High‑Performance Static Sites: Cache, Gzip, CORS and Anti‑Hotlinking

This blog post summarizes four key Nginx configuration topics—caching, gzip compression, CORS, and anti‑hotlinking—based on real‑world production experience, providing practical guidance for developers and ops engineers.

Cache

Proper cache settings let browsers reuse previously fetched resources, reducing round‑trip time and improving user experience. The Expires header can be set with a positive or negative time value, while Cache-Control determines the caching behavior: no-cache disables caching, and max-age=time enables it.

location ~* \.(jpg|jpeg|png|gif)$ {
    expires 30d;
}
# expires 30s;   # cache 30 seconds
# expires 30m;   # cache 30 minutes
# expires 2h;    # cache 2 hours
# expires 30d;   # cache 30 days

The caching process involves the browser requesting resources, the server responding with appropriate headers, the browser storing the response, and subsequent requests either using the cached copy or revalidating it based on Expires , ETag , and Last-Modified headers.

Cache‑Control Details

Both Expires (HTTP/1.0) and Cache-Control (HTTP/1.1) control caching. Cache-Control has higher priority and avoids issues caused by client‑server clock differences.

location ~* \.(css|js)$ {
    expires 7d;
    add_header Cache-Control "public";
}

Another valid form:

location ~* \.(css|js)$ {
    expires 600;
    add_header Cache-control max-age=800;
}

Gzip Module

Enabling gzip reduces the amount of data transferred, speeding up page loads.

location ~ .*\.(jpg|gif|png|js)$ {
    gzip on;
    gzip_http_version 1.1;
    gzip_comp_level 2; # compression level (1‑9)
    gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif img/png;
}

CORS and Anti‑Hotlinking

CORS headers allow legitimate cross‑origin requests, while anti‑hotlinking checks the Referer header to block unauthorized use of static assets.

server {
    listen 80;
    server_name www.stark.com;

    location / {
        # Allow specific origins
        add_header 'Access-Control-Allow-Origin' 'http://stark1.com https://stark2.com';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'User-Agent,Keep-Alive,Content-Type';
        add_header 'Access-Control-Max-Age' 1728000;

        # Preflight request handling
        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
            add_header 'Access-Control-Allow-Headers' 'User-Agent,Keep-Alive,Content-Type';
            add_header 'Access-Control-Max-Age' 1728000;
            add_header 'Content-Type' 'text/plain charset=UTF-8';
            add_header 'Content-Length' 0;
            return 204;
        }
        # Other server config here
    }
}

Anti‑hotlinking example:

server {
    listen 80;
    server_name yourdomain.com;

    location / {
        root /path/to/your/files;
        valid_referers none blocked server_names *.yourdomain.com;
        if ($invalid_referer) {
            return 403;
        }
    }
}

These configurations help improve performance, security, and resource control for static websites served by Nginx.