URLs Breaking When Hosting Remote Servers Front-End Website on Nginx Proxy - linux

We built an Nginx Server for acting as Edge Proxy for all the ligth weight front-end websites built on different small VMware instances.
The idea is to access the remote server's website like so:
https://nginxserver.mydomain.com/dev/marketing/
And the remote server is configured as upstream in Nginx's config directories:
upstream marketing-dev {
zone marketing-dev-service 64k;
server someserver.mydomain.com:8443;
sticky cookie srv_id expires=1h;
}
And the remote server's dev-marketing.conf file looks like this:
location /dev/marketing/ {
access_log /var/log/nginx/marketing-dev-access.log main;
error_log /var/log/nginx/marketing-dev-debug.log debug;
proxy_pass https://marketing-dev/;
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;
}
When I access the URL, site loads fine, and I can browse to almost all locations and pages within.
Except for few!!
It is dropping the location /dev/marketing/ in the URL and takes me directly to https://nginxserver.mydomain.com/ or takes me to locations by skipping the path.
For example, https://nginxserver.mydomain.com/aboutus instead of https://nginxserver.mydomain.com/dev/marketing/aboutus
Anyway to overcome this?

Related

How do i configure nginx (and strapis) to correctly serve two strapi instances on the same server?

i want to host two small websites, both made with strapi backend and react frontend, on my server which is a digital ocean droplet.
I already configured nginx in order to work for one of the websites and everything is working correctly. I can access strapi from site1.com/dashboard and my queries point to site1.com/api/graphql. I followed some tutorials for that.
Here are the nginx files i added:
/etc/nginx/sites-available/site1.com:
server {
listen 80;
listen [::]:80;
root /var/www/site1.com/react;
# Add index.php to the list if you are using PHP
index index.html index.htm index.nginx-debian.html;
server_name site1.com www.site1.com;
location /api/ {
rewrite ^/api/(.*)$ /$1 break;
proxy_pass http://strapi;
proxy_http_version 1.1;
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Server $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_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_pass_request_headers on;
}
location /dashboard {
proxy_pass http://strapi/dashboard;
proxy_http_version 1.1;
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Server $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_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_pass_request_headers on;
}
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
try_files $uri $uri/ /index.html;
}
}
file /etc/nginx/conf.d/upstream.conf:
upstream strapi {
server 127.0.0.1:1337;
}
What i now want to do is to deploy another website to the same server and configure nginx to serve it as well (on another domain, for example site2.com).
So i added the nginx virtual server file for the second website, copying the first one and changing the domain name and root directory.
The site 2 frontend is now working correctly and accessible on its domain.
However when i start the site 2 strapi instance it says the port 1337 is already in use (obviously, it is used by site 1 strapi instance that is running with pm2). So i changed the port in strapi config to be 1338 (is it ok?) but now i don't know what do to in nginx in order to serve the two different strapi instances on different domains.
The hostname you are using for the proxy_pass directive is the upstream name you defined in the separate config file. This is basically an indirection to one or more real backends. In your case that's the application running on port 1337 on the same machine. It could also be a list of external domains where nginx takes care to distribute the load to.
Your approach with additional virtual hosts already looks good. The frontend that already "works" under site2 is probably the old instance served under the new domain if your proxy_pass directive still points to http://strapi for site2 (which probably still resolves to `localhost:1337).
As you already mentioned, a second instance of the backend needs to run on a different port. The port number you use is not really important as you will control this with your upstream configuration. Just make sure to not use a port number below 1024 (which requires root permissions), don't conflict with other processes on the system (you will notice) and as best practice, don't use port numbers that are default for some other protocols (maybe check this list).
To fix your setup, just define a second upstream like the first one but pointing to the new url e.g. localhost:1338 and then reference this new name in the proxy_pass directive of site2.
Technically, with just one backend per upstream, you could also skip the upstream part completely and reference the URL directly in the proxy_pass directives, but using a shorthand name can also support readability of your configuration.

Nginx - Reverse proxy to an already reverse proxied location or double reverse proxy?

I am using nginx on centos 7.
I am reverse proxying a remote nodejs server on the same LAN to the nginx root / as per the below:
location / {
proxy_pass http://192.168.1.104:3000/;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
This works fine for serving my website - all external requests on port 80 are rewritten to use https which has been configured in nginx e.g nginx forwards any incoming http requests to https and deals with rewrites and forwarding so that the nodejs content is served over ssl even though ssl hasn't been configured within the node application.
e.g my site can be accessed at https://example.com
I now want to reverse proxy another nodejs app so that it appears at a location which is prefixed with https://example.com e.g: https://example.com/node2/
I've tried using the below config for the second node server...
location /node2/ {
proxy_pass http://192.168.1.100:3000/;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
When I load the https://example.com/node2/ url, the html of the root page of the second node server is displayed but none of the css, js or images are loaded so the page doesn't look or work as it should and I see the following in the browser console...
Mixed Content: The page at 'https://example.com/node2/' was loaded
over HTTPS, but requested an insecure image
'http://192.168.1.100:3000/assets/graphics/logo.png'. This content
should also be served over HTTPS.
and
Failed to load resource: net::ERR_CONNECTION_CLOSED https://192.168.1.100:3000/assets/css/styles.min.css
for css and js assets... so it seems that no redirection is taking place for assets and also any links on the html page do not show the /node2/ suffix when hovered over or when clicked as the page tries to load the resource from https://example.com instead of https://example.com/node2/
Is it possible to actually do what I want in terms of reverse proxy two locations and can anyone point me in the right direction on how I can get this work as need?
The application being loaded is set up to load assets from the server root, not with server root + /node2/

Node+Express+NGINX application returning localhost instead of domain

I have a node+express website running on my ubuntu server on port 10000 with nginx on port 80 using a proxy_pass to localhost:10000. My issue is that when I ask for the host in express it returns localhost instead of my domain name. I use the nginx proxy so I can manage several domains on the machine pointing to different applications.
Is there a way to keep the original host name on my node+express server while still using proxy_pass in nginx?
By default, nginx sets the Host header in the upstream request to the hostname appearing in the proxy_pass statement. In this case localhost.
You need to set the Host header explicitly using the proxy_set_header directive.
For example, I always set this group:
proxy_set_header Host $host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Accept-Encoding "";
proxy_set_header Proxy "";
See this document for more.

Hosting two logically separate apps on one node.js server?

Currently I have two apps each with their own node.js server, that means there is a lot of duplication, the node_modules are similar, the configuration is similar.
One app is served on the main domain, and the other is served on a sub domain.
The biggest thing is the sessions are separate, so I can't log into one and be logged into both.
How do I create one server to work for app.example.com and example.com so that they share common node_modules and configuration, but I can tailor specific needs for each app in that server?
You may want to look into Nginx, it will allow you to proxy_pass both subdomains to different ports. Here's the sort of setup you will need.
server {
listen 80;
server_name app.example.com;
access_log off;
location / {
proxy_pass http://localhost:8080;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-for $remote_addr;
proxy_connect_timeout 300;
}
}

nginx manage local servers depends on income domain name

I have a few applications that are running localy in defferents ports, how can I configure NGINX server for forwarding request from port 80 to my application depends on income domain name. For example 2 local apps named 'app1' on port 8181 , and if request comes from http://app1.com - nginx forwards to http://localhost:8181
I've looked at nginx docs, I ask for your examples if someone did this.
Thanks
Assuming you want to create a reverse proxy, my method is to first configure the following reverse proxy settings in a new file called /etc/nginx/reverse-proxy.conf:
# Serve / from local http server.
# Just add the following to individual vhost configs:
# proxy_pass http://localhost:3001/;
proxy_pass_header Server;
proxy_set_header Host $http_host;
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Scheme $scheme;
proxy_connect_timeout 10;
proxy_read_timeout 10;
Then, for each reverse proxy I'm configuring, I add an appropriately-named configuration file in /etc/nginx/sites-enabled with the following:
server {
server_name app1.com;
server_name www.app1.com;
location / {
include /etc/nginx/reverse-proxy.conf;
proxy_pass http://localhost:8181/;
}
}
You can create as many server blocks as you like and point them at different local (or even remote) application servers. You can also add location blocks to serve different URLs within the same domain statically, or from different local application servers.
(You can also just roll all the configuration into /etc/nginx/nginx.conf, but I find it easier to separate configuration out into multiple files.)
I managed to do this easily by following this tutorial.
Create a new file in /etc/nginx/conf.d/ called your-domain.com.conf and put this in it:
server {
listen 80;
server_name your-domain.conf.com;
location / {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $http_host;
proxy_pass http://127.0.0.1:2368;
}
}
Then restart nginx
sudo service nginx restart

Resources