htmlcssnginxuwsgi

nginx custom error page 502 with css and image files

I'm trying to add a custom error page for 503. I added these lines to server conf in nginx.conf file:

error_page 500 502 503 504 /50x.html;
location = /50x.html {
    root  /home/username/sites/myProject/current/errorPages;
    internal;
}

It displays the custom page when uwsgi is down, however this doesn't show any images. I tried many different configurations I can think of, but no luck. How I can display image file and enable css for a custom error page?

I put my custom error page into /home/username/sites/myProject/current/errorPages and the file structure is:

errorPages/50x.html
errorPages/50x_files/50x.css
errorPages/50x_files/50x.js
errorPages/50x_files/image.png
Solution

  • I just had the same problem, and what did work is setting the nginx conf like this :

    error_page 500 502 503 504 /50x.html;
location = /50x.html {
  root  /home/username/sites/myProject/current/errorPages;
}
location = /image.png {
  root /home/username/sites/myProject/current/errorPages/50x_files;
}

    And then reference the image simply as src="image.png". The same should apply to your css and js!

    Edit : I find a way to make it work for a bunch of file:

    error_page 500 502 503 504 /errorPages/50x.html;
location /errorPages/ {
  root  /home/username/sites/myProject/current/;
}

    This way all the files in the errorPages folder will be available (e.g. src="/errorPages/image.png"), as nginx will try to match all "/errorPages/...". It is necessary to remove both the "=" after "location" (as it's not an exact match anymore) and the "internal;" in it (as the other resources will be called from the html and not internally by nginx).