Nginx 502 user error page with css and image files

Question

I am trying to add a custom error page for 503. I did this. adding the following lines to the server conf file in the nginx.conf file.

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

}

It displays a custom page when uwsgi is not working, however it does not show any images. I tried many different configurations, but I could not. Does anyone know how I can display an image file and enable CSS for a custom error page?

I placed my error page in / home / username / sites / myProject / current / errorPages and the file structure ..

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

Answer 1

, nginx :

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;
}

src= "image.png". css js!

: :

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

, errorPages (, src= "/errorPages/image.png" ), nginx "/errorPages/...". "=" "location" ( ) "internal"; ( html, nginx).

Answer 2

, /css /, , internal. internal , (.. http://mysite/errorPages/500.html). , 404.

:

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

• css inline styles . , , , .
• css errorPages html- , -.

Answer 3

, - :

• inline CSS
• Base64

After that, you can embed the generated Base64 string in the CSS rule background-imageas follows:

background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEADI.....==)

You can also use a tag string <img>, just pass it to the attribute srcas follows:

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEADI.....==" />

This way you can save the internalnginx rule .