2

I have a nginx virtual server with a custom 503 used for maintenance. The html page uses some fonts from google fonts, bootstrap, but also a css and an image from the local server.

When the page is loaded, the linked css is not loaded. Using Firefox web tools I can see for the Error 503. Trying direclty the css URL, the css is loaded by the browser.

The image is correclty displayed even if has an error 503.

This is my nginx configuration:

  if (-f /home/user-site/www/MainWebSite/releases/current/.maintenance) {
    return 503;
  }

  if (!-d /home/user-site/www/MainWebSite/releases/current) {
    return 503;
  }

#  error_page 503 /maintenance.html;
#  location = /maintenance.html {
#    root    /home/user-site/www/MainWebSite/htdocs;
#  }

  error_page 503 @maintenance;
  location @maintenance {
    root    /home/user-site/www/MainWebSite/htdocs;
    #rewrite ^(/css)/(.+?)(\.[^.]*$|$) /stuff/css/$2$3 break;
    rewrite ^(/img)/(.+?)(\.[^.]*$|$) /stuff/img/$2$3 break;
    rewrite ^(.*)$ /maintenance.html break;
  }

I suppose that the css cannot be loaded because of the error 503 returned by the server even if the rewrite roule correctly retunr the css.

How I can prevent error 503 on css and images of landing pages?

tanks.

Update!! Following this solution the configuration works!

  if (-f /home/user-site/www/MainWebSite/releases/current/.maintenance) {
    set $err503 1;
  }

  if (!-d /home/user-site/www/MainWebSite/releases/current) {
    set $err503 1;
  }

  error_page 503 @maintenance;
  location @maintenance {
    root    /home/user-site/www/MainWebSite/htdocs/error503;
    try_files $uri /maintenance.html =503;
  }


  location /static {
    root /home/user-site/www/MainWebSite;
  }
  location /media {
    root /home/user-site/www/MainWebSite;
  }
  location /robots.txt {
    root /home/user-site/www/MainWebSite/htdocs/robots.txt;
  }
  location /sitemap.xml {
    root /home/user-site/www/MainWebSite/htdocs/sitemap.xml.txt;
  }

  location ~* \.(css) {
    root    /home/user-site/www/MainWebSite/htdocs/error503;
        # The file will be returned
  }

  location ~* \.(png|jpg|jpeg) {
      root    /home/user-site/www/MainWebSite/htdocs/error503;
      # The file will be returned
  }

  location / {
     if ($err503 = 1) {
        return 503;
     }

     uwsgi_pass unix:/tmp/uwsgi_MainWebSite.sock;
     include /etc/nginx/uwsgi_params;

  }
IU1JVO Giuliano Favro
  • 21
  • 1
  • 5
  • I'm not sure if this may [help](https://stackoverflow.com/questions/27610979/nginx-custom-error-page-502-with-css-and-image-files). I haven't tried it myself but they placed all of the files for the custom error page in its own folder. – markybb41 Jul 18 '19 at 12:55
  • I've tried this other solution [on github](https://gist.github.com/rjha/2943725). But css and img always return error 503, even if the image is correclty displayed by the browser. The css still not usable. – IU1JVO Giuliano Favro Jul 18 '19 at 15:53
  • @markybb41 I've tried but don't work. – IU1JVO Giuliano Favro Jul 18 '19 at 16:06

0 Answers0