Nginx cache cleaning configuration, optimize website static resource update

Nginx cache cleaning configuration, optimize website static resource update

Introduction:
During the website development process, there are often updates to static resources, such as CSS, JavaScript, and images. However, due to the browser's caching mechanism, visitors may not be able to immediately obtain the latest version of the static resource. In order to solve this problem, we can use Nginx for cache cleaning configuration to optimize the update of website static resources.

1. Nginx cache configuration
First, we need to add the following instructions to the Nginx configuration file nginx.conf to configure cache-related settings:

http {
    ...
    proxy_cache_path /path/to/cache levels=1:2 keys_zone=cache_zone:10m max_size=10g inactive=60m;
    ...

    server {
        ...
        location ~* .(css|js|png|jpg|jpeg|gif|ico)$ {
            expires 30d;
            add_header Pragma public;
            add_header Cache-Control "public";
            proxy_cache cache_zone;
            proxy_cache_key $scheme$proxy_host$uri$is_args$args;
            proxy_cache_valid 200 301 302 404 1d;
        }
        ...
    }
    ...
}

1. proxy_cache_path: Settings The path to the cache directory. levels=1:2 means using two-level subdirectories in the cache directory to store cache files, which can improve file search speed. keys_zone is the name of the cache area, 10m means allocating 10MB of memory for cache index. max_size indicates the maximum size of the cache file, and inactive indicates that the cache file will be deleted if it is not accessed within the specified time.
2. location: used to match static resource files that need to be cached. In this example, regular expressions are used to match CSS, JavaScript, images and other files, and the cache expiration time is set to 30 days.
3. add_header: Add HTTP response header information, set Pragma to public and Cache-Control to public to ensure that the cache can be cached by public cache servers and browsers.

2. Nginx cache cleaning configuration
When we update the static resource files of the website, we need to clear the old version files in the cache so that visitors can obtain the latest static resources. . In order to achieve this, we can add the following code to the Nginx configuration file:

http {
    ...
    proxy_cache_path /path/to/cache levels=1:2 keys_zone=cache_zone:10m max_size=10g inactive=60m;
    ...

    server {
        ...
        location /purge-cache {
            internal;
            proxy_cache_purge cache_zone "$scheme$proxy_host$uri$is_args$args";
        }
        ...
    }
    ...
}

1. location: Define a /purge-cache URL to trigger the cache cleaning operation. Internal means that this URL is only valid for internal access.
2. proxy_cache_purge: Clear the cache file corresponding to the specified URL.

3. Code Example
Assuming that the CSS file in our website is located at http://example.com/static/css/style.css, we can use the following code to clear the cache. This file:

curl -X PURGE http://example.com/purge-cache/static/css/style.css

This request will cause nginx to clear the cache file corresponding to the URL in the cache, and the cache will be regenerated the next time the URL is accessed.

Conclusion:
By configuring Nginx cache cleaning, we can optimize the update of static resources on the website. When we update static resources, we only need to send a request to clear the cache, so that visitors can obtain the latest resource files and improve website performance and user experience.

Reference materials:

• Nginx official documentation: https://nginx.org/en/docs/http/ngx_http_proxy_module.html#proxy_cache_purge

The above is the detailed content of Nginx cache cleaning configuration, optimize website static resource update. For more information, please follow other related articles on the PHP Chinese website!