How to serve static assets with Nginx in maintenance mode (503)

Question

I'm using Nginx as front proxy on my server for my website. I want to use it to redirect users to my web application when it's live or a maintenance php page when I'm in maintenance mode.

Here is my server directive :

server {
    listen               443;

    return 503;
    error_page           503 @maintenance;
    root                /usr/maintenance;
    location @maintenance {
        fastcgi_pass     php-fpm;
        fastcgi_index    index.php;
        fastcgi_param    SCRIPT_FILENAME  $document_root$fastcgi_script_name;
        include          /etc/nginx/fastcgi_params;
    }

    location / {
        proxy_pass       https://webapp;
    }
}

If I uncomment return 503, a 503 response is sent to the client, otherwise, the web app is sent.

My PHP 503 error page is displayed as expected but the problem is that it has static assets (css, images, js) and I get 503 return code when Chrome tries to load them. The assets are in the root directory.

How can I fix this ? Is there a better way than comment/uncomment return 503 to handle maintenance and live modes ?

Thank you

Answer 1

After some research, I've found an elegant way to do it. Source : http://blog.mythictechnologies.com/2011/02/10/setting-a-maintenance-page-with-nginx/

So here is my new config

server {
    listen               443;

    error_page           503 @maintenance;
    root                /usr/maintenance;
    location @maintenance {
        fastcgi_pass     php-fpm;
        fastcgi_index    index.php;
        fastcgi_param    SCRIPT_FILENAME  $document_root$fastcgi_script_name;
        include          /etc/nginx/fastcgi_params;
    }

    location ~* \.(css|png|js|jpg|jpeg) {
        # The file will be returned
    }

    location / {
        return           503;
        proxy_pass       https://webapp;
    }
}

You're free to adjust the regex \.(css|png|js|jpg|jpeg) as you want but whitelisting files seems a good idea.