Skip to content

How can you serve a folder of files with Nginx?

I’m trying to serve a folder that contains HTML, JS, PHP, Java, and a couple of other different file types with Ngnix. I plan to then import two JS files from that folder into my index.html like so :

<script src="/scripts/jmol/jsmol/JSmol.min.js"></script>
<script src="/scripts/jmol/jsmol/js/Jmol2.js"></script>

The problem is, I am getting a 404 Not Found error :

nginx_1     | - - [14/Jan/2021:00:39:01 +0000] "GET /scripts/jmol/jsmol/JSmol.min.js HTTP/1.1" 404 162 "http://localhost/" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.121 Safari/537.36"
nginx_1     | - - [14/Jan/2021:00:39:01 +0000] "GET /scripts/jmol/jsmol/js/Jmol2.js HTTP/1.1" 404 161 "http://localhost/" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.121 Safari/537.36"

Below is my nginx.conf file.

worker_processes 2;
events { worker_connections 1024; }
http {
  server {
    listen 80;
    proxy_buffering ${BUFFERING};
    location /__webpack_hmr {
      proxy_pass http://vue:8080;
      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection “upgrade”;
    location /scripts/ {
      alias  "/home/user/frontend/src/assets/js";
    location / {
      try_files $uri $uri/ @proxy_to_frontend;
      proxy_pass         http://vue:8080;
    location /api {
      proxy_pass         http://django:8082;
    location @proxy_to_frontend {
         proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
         proxy_set_header Host $http_host;
         proxy_redirect off;
         proxy_pass   http://vue:8080;

Any help would be appreciated.


I figured out my problem. I failed to mention that I am using Docker as well and had to first move my desired files to /usr/share/nginx/html/ within the Nginx docker container and then put that file location as the location for alias.