Reverse proxy application and its static files with Nginx

Question

I am trying to do something that seems to me very simple but I must be stupid or miss something very obvious because I cannot figure it out.

I want to access the multiple web applications running on my server with a unique prefix for each one of them:

http://mywebserver/app1 -> localhost:9001 http://mywebserver/app2 -> localhost:9002 ... 

From what I understood, I need to configure Nginx as a reverse proxy, so I did that:

server { listen 80; server_name mywebserver; location /app1{ proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; proxy_pass http://127.0.0.1:9001/; } ... } 

This configuration allows me to access the homepage of the application at http://mywebserver/app1, but the static content is not loaded.

When I open the console of my browser, I can see that it is trying to get the resources from http://mywebserver/static/custom/index.js and not something like http://mywebserver/app1/static/custom/index.js.

I tried to add a root directive in the location block to serve the static but it is not taken into account since the static content request is made on / and not on /app1.

How to fix this? Is there something obvious I am missing or I did I completely misunderstood the concept of reverse proxy?

Thank you.

Answer 1

The suggestion from @sikian did the trick, I changed the location declaration from location /app1 { ... } to location /app1/ { ... }.

The static files were served without error in the console, and the application seems to be fully working.