I'm using Node.js with Express to make web applications which I run on a server in the cloud. Express apps typically listen on a specific port (3000 by default, but you can specify a port). So if I have multiple applications running on the server they will each listen on a unique port number, all well and good. But you don't want to reach the app with a port number in the URL, that's ugly.
I use Nginx on the server to perform a reverse-proxy. It can forward a path in a URL to a port where the appropriate application is listening.
So if "myApp" is listening on port 3010, it can be reached via the URL "https://myserver/myApp", which Nginx will route to port 3010 on the server. However on my local machine, which is where I do my development and testing, the app must be reached at "localhost:3010" because there is no proxy.
So here's the problem. When an index.html page loads up in a browser it pulls in CSS and JavaScript files from the server. The typical syntax is;
<link rel="stylesheet" href="/stylesheets/myStyle.css">
That pathname is supposed to be relative to the base directory of the app, and the appropriate prefix should get prepended to the request URL. This works when running on the local machine with "localhost:3010", the stylesheets and scripts get pulled in. But running on the remote server with the URL "https://myserver/myApp" the files won't load, I get a 404. I'm having to prepend the URL route name to the file pathnames in order for the requests to be proxy-routed properly like so;
<link rel="stylesheet" href="/myApp/stylesheets/myStyle.css"">
Unfortunately that pathname doesn't work on localhost where there is no myApp directory. This means that I don't have portable code. It has to be different when running locally or on the server, and the code has to know what the route name is on the server. That's bad.
Maybe I am configuring something incorrectly? This is what the routing clause looks like in Nginx;
location /myApp {
proxy_pass http://localhost:3010/;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-NginX-Proxy true;
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;
}
