nginx - custom 404 - css / js not found

Question

I have an nginx server running with

error_page 404 /404.html;
location = /404.html {
        root /usr/share/nginx/html;
        internal;
}

error_page   500 502 503 504  /50x.html;
location = /50x.html {
        root   /usr/share/nginx/html;
        internal;
}

The error pages are well displayed as long as the url is "http://domain/not_existing_page.html". However if it is like "http://domain/subpath/not_existing_page.html", my CSS and JS are not retrieved.

Indeed, in my 404.html the link

<link href="css/custom.css" rel="stylesheet">

doesn't work as the browser looks for "http://domain/subpath/css/custom.css".

Is there a way to configure nginx so that my 404.html always gets my css and js from / ?

Thanks for your help !

T. Kuther · Accepted Answer · 2016-06-16 13:37:32Z

4

You need to design your error pages with absolute paths to the resources, and optionally prefix it with something unique so you can set the correct root path for them, too.

Example:

In the 404.html

<link href="/error-pages/css/custom.css" rel="stylesheet">

In nginx config

location ~ "^/error-pages" {
        root   /usr/share/nginx/html;
        internal;
}

If your css/js resources for the error pages are placed in the global document root, then it's enough to use an absolute path like

<link href="/css/custom.css" rel="stylesheet">

edited Jun 16, 2016 at 13:37

answered Jun 16, 2016 at 13:32

T. Kuther

6203 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

David John Coleman II Over a year ago

Thanks, I had this same problem, I could not yet find a solution, and so I followed your second idea ("If your css/js resources for the error pages are placed in the global document root, then it's enough to use an absolute path like") and placed all subdirectories with css and js in the root directory

Collectives™ on Stack Overflow

nginx - custom 404 - css / js not found

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related