Nginx cannot serve css files because of MIME type error

15,566

Silly me. I forgot to put include /etc/nginx/mime.types in the configuration file. So I put it in location /static {} block and now it works.

Share:
15,566

Related videos on Youtube

khajvah
Author by

khajvah

Updated on September 18, 2022

Comments

  • khajvah
    khajvah almost 2 years

    My Setup:

    It is a nginx/gunicorn setup for django webapp.

    Here is my nginx config file:

    worker_processes 1;
    
    user ubuntu nogroup; # for systems with a "nogroup"
    # user nobody nobody; # for systems with "nobody" as a group instead
    
    # Feel free to change all paths to suit your needs here, of course
    pid /tmp/nginx.pid;
    error_log /tmp/nginx.error.log;
    
    events {
      worker_connections 1024; # increase if you have lots of clients
      accept_mutex off; # "on" if nginx worker_processes > 1
      use epoll; # enable for Linux 2.6+
      # use kqueue; # enable for FreeBSD, OSX
    }
    
    http {
    
      # fallback in case we can't determine a type
      default_type application/octet-stream;
    
      # click tracking!
      access_log /tmp/nginx.access.log combined;
    
      # you generally want to serve static files with nginx since neither
      # Unicorn nor Rainbows! is optimized for it at the moment
      sendfile off;
    
      tcp_nopush off; # off may be better for *some* Comet/long-poll stuff
      tcp_nodelay off; # on may be better for some Comet/long-poll stuff
    
    
      # this can be any application server, not just Unicorn/Rainbows!
      upstream app_server {
    
        # for UNIX domain socket setups:
        server localhost:8080;
    
      }
    
      server {
        listen 8000;
    
    #    client_max_body_size 4G;
        server_name _;
    
        proxy_connect_timeout 75s;
        proxy_send_timeout 75s;
        proxy_read_timeout 75s;
    
        expires -1;
        location /static {
            autoindex on;
            alias /home/ubuntu/mira_website/manageDb/static/;
        }
    
    
        location / {
    
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    
          proxy_set_header Host $http_host;
    
          proxy_redirect off;
    
          proxy_buffering off;
    
          proxy_pass http://app_server;
    
        }
    
        # Error pages
        error_page 500 502 503 504 /500.html;
        location = /500.html {
          root /path/to/app/current/public;
        }
      }
    }
    

    Errors I am getting

    I am getting errors from the browser. Here are those:

    /static/rest_framework_swagger/css/highlight.default.css was not loaded because its MIME type, "application/octet-stream", is not "text/css".
    

    What's interesting is that .js files are successfully served. One more thing to note is that both .js and .css files were generated by django by doing python manage.py collectstatic.

    Another interesting thing is that when I put /static/rest_framework_swagger/css/highlight.default.css directly in the url, it serves me the file for download.