Nginx Failing to Load CSS and Js Files (Mime Type Error)

Nginx fails to load css files

I found an workaround on the web. I added to /etc/nginx/conf.d/default.conf the following:

location ~ \.css {
    add_header  Content-Type    text/css;
}
location ~ \.js {
    add_header  Content-Type    application/x-javascript;
}

The problem now is that a request to my css file isn't redirected well, as if root is not correctly set.
In error.log I see

2012/04/11 14:01:23 [error] 7260#0: *2 open() "/etc/nginx//html/style.css"

So as a second workaround I added the root to each defined location.
Now it works, but seems a little redundant. Isn't root inherited from / location ?

CSS was not loaded because its MIME type

It is usual to place include mime.types; inside the outer http { ... } block, rather than inside a location { ... } block, so that it is system-wide and inherited by all server { ... } blocks and all locations.

Your href="../static/css/ statement is relative, so from the information you provide, we cannot tell whether the URI is being processed by the location /static/ block or the location / block.

You do not have a root (or alias) defined for the location / block, so the false condition of the if (!-f $request_filename) statement will probably always fail with 404.

You may want to set root /var/www/test/my-example in the server { ... } block and allow it to be inherited by some location blocks. The use of alias where a root can be used is discouraged - see this document.

If your CSS files are being served through the proxy_pass http://test_server; then this is the wrong place to be fixing the MIME type.

Related Topics