Javascript/CSS files don't load on website while hosting

September 20, 2019 207 views
Initial Server Setup JavaScript Nginx API

when I try running my server (with the domain being my ip address),
It loads the base index.html but all of the files I reference (other CSS files, javascript files) in my directory aren’t loaded.

  • When I run on the Chrome browser, interestingly, it reads all of the css/js files in the directory of my index.html file as that index.html file:
    https://imgur.com/a/6ibcKLj

  • In My Default file (in /etc/nginx/sites-enabled[available]/default), my code looks like this:

server {
        listen 80 default_server;
        listen [::]:80 default_server;

root /usr/share/nginx/html;

        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        server_name <ip-address-here>;

        location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                try_files $uri /index.html;
                autoindex on; (I've tried with and w/o this)
                # proxy_pass http://localhost:8080;
                # proxy_http_version 1.1;
                # proxy_set_header Upgrade $http_upgrade;
                # proxy_set_header Connection 'upgrade';
                # proxy_set_header Host $host;
                # proxy_cache_bypass $http_upgrade;
        }
}

the rest is just comments


before, my files were in a folder called /srv/www/abc.me. Now I moved to /usr/share/nginx/html. Before and after the move my problem still existed.

This is my first time using DigitalOcean. I’ve followed tutorials to host my website and things like that but I don’t understand the ins and outs of nginx.

1 Answer

HI @MoGb1,

Is that your whole Nginx configuration?

Additionally, can you try to add the following to the configuration file :

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

You can also try and add it to /etc/nginx/conf.d/default.conf

Kind regards,
Kalin

Have another answer? Share your knowledge.