Building a CDN with Nginx and purging cache with ngx_cache_purge

Publish: 2017-11-15 | Modify: 2017-11-15

Nginx's self-built CDN has been introduced in "Smart Parsing + Nginx Reverse Proxy, Self-built CDN Acceleration Node". Interested users can refer to it, but you can continue to improve it based on this article, such as adding the ngx_cache_purge module to clear the cache.

cache_500

Compiling the ngx_cache_purge module

To clear the Nginx cache, you need the help of the ngx_cache_purge module. You can enter the command nginx -V to view the compiled modules. If there is no ngx_cache_purge, it means the module is not installed, so you need to recompile Nginx.

snipaste_20171115_164407

The module download address is ngx_cache_purge-2.3.tar.gz. For how to compile Nginx, please refer to: "Nginx Compilation and Installation of Fancy Index Module to Achieve a Beautiful Index Directory"

Configuring ngx_cache_purge

Add the following configuration in the server block and reload Nginx. Here, xiaoz was trapped for a long time. Please make sure that the value of cache_one below is consistent with the value defined by keys_zone, otherwise Nginx will not start.

location ~ /purge(/.*) {
allow all;
proxy_cache_purge cache_one $proxy_host$1$is_args$args;
error_page 405 =200 /purge$1;
}

If you want to clear the cache, just add the purge parameter, such as https://blog.xiaoz.org/purge/xxx.png. If the file exists in the cache, it will prompt as shown in the screenshot below. If the cache does not exist, it will return 404. If it returns 404 regardless of the situation, the configuration may not be successful.

snipaste_20171115_180215

Automatic Cache Refresh in WordPress

The XiaoZ blog uses the WordPress program. After enabling the CDN, the page is cached and the submitted comments cannot be displayed immediately. You can use Ajax to asynchronously request the ngx_cache_purge interface to clear the cache when users submit comments. Just add the following JavaScript code to footer.php.

<script>
    $(document).ready(function(){
        $("#submit").click(function(){
            var uri = "https://blog.xiaoz.org/purge" + window.location.pathname;
            $.get(uri,function(data,status){
                return true;
            });
        });
    });
</script>

Replace https://blog.xiaoz.org in the code with your own domain name. The following is the complete configuration of the XiaoZ blog's CDN for reference:

proxy_cache_path /data/caches levels=1:2 keys_zone=xiaozcdn:100m inactive=30m max_size=100m;
server
    {
    listen 443 ssl http2;
    listen [::]:443 ssl http2;
    ssl on;
    ssl_certificate /xxx/www_xiaoz_me.crt;
    ssl_certificate_key /xxx/www_xiaoz_me.key;
    ssl_session_timeout 1d;
    ssl_session_cache shared:SSL:50m;
    ssl_session_tickets off;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers 'ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-AES128-SHA256:ECDHE-RSA-AES128-SHA256:ECDHE-ECDSA-AES128-SHA:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES128-SHA:ECDHE-ECDSA-AES256-SHA384:ECDHE-ECDSA-AES256-SHA:ECDHE-RSA-AES256-SHA:DHE-RSA-AES128-SHA256:DHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-RSA-AES256-SHA:ECDHE-ECDSA-DES-CBC3-SHA:ECDHE-RSA-DES-CBC3-SHA:EDH-RSA-DES-CBC3-SHA:AES128-GCM-SHA256:AES256-GCM-SHA384:AES128-SHA256:AES256-SHA256:AES128-SHA:AES256-SHA:DES-CBC3-SHA:!DSS';
    ssl_prefer_server_ciphers on;
    ssl_stapling on;
    ssl_stapling_verify on;

    server_name     www.xiaoz.me;
    charset utf-8,gbk;

    #Delete cache
    location ~ /dcache(/.*) {
    allow all;
    proxy_cache_purge xiaozcdn $proxy_host$1$is_args$args;
    error_page 405 =200 /purge$1;
    }

       location / {
       #proxy_set_header Accept-Encoding "";
       proxy_pass https://blog.xiaoz.org;
       proxy_redirect off;
       proxy_set_header X-Real-IP $remote_addr;
       proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
       proxy_cache xiaozcdn;
       proxy_cache_valid  200 304  30m;
       proxy_cache_valid  301 24h;
       proxy_cache_valid  500 502 503 504 0s;
       proxy_cache_valid any 1s;
       #How many times has it been cached?
       proxy_cache_min_uses 1;
       expires 12h;
       proxy_cache_key    $uri$is_args$args;
    }
}
server
{
    listen 80;
    server_name www.xiaoz.me;
    rewrite ^(.*) https://blog.xiaoz.org$1 permanent;
}

Summary

Nginx is widely used and has powerful features, but it has many parameters. XiaoZ only knows a little about it. The above solution has been applied to the XiaoZ blog, and the specific effect needs to be observed and improved. If there are any problems, please provide feedback.


Comments