LowEndBox - Cheap VPS, Hosting and Dedicated Server Deals

How to Configure Reverse Proxy with NGINX

Tags: , , , Date/Time: October 5, 2020 @ 10:07 am, by Jon Biloh

NGINX is a light-weight web server first released in 2004 which can also be used as a reverse proxy. We have made many tutorials over NGINX at LowEndBox, and recently setup a Node.js Application, it also used NGINX as its reverse proxy, but it used an NPM package to generate the app-specific configurations.

In this tutorial, we’ll configure NGINX to Reverse Proxy from an Apache backend hosted on a local port just for an example. In general, Reverse Proxy is helpful if you have a hard-coded application (like Plex, Webmin, etc) which listens on a non-default default port (i.e. not on port 80 / 443), or you are already using the HTTP ports with NGINX web server and cannot assign those ports to another application.

Sometimes, these kinds of configurations are also done where the web application is only compatible with a specific webserver like Apache due to custom rewrites support, and NGINX is used in front-end for its low memory footprint and ability to cache static content. This kind of setup is seen in VestaCP’s default installation too.

Requirements:

  1. We will use Ubuntu 18.04 for this tutorial, but it can also be done similarly in Debian or CentOS.
  2. A domain name or subdomain’s A record pointing to the IP of the VPS.
  3. We will use nano text editor, you can also use vim or choose to edit the configurations via SFTP on a local editor like Notepad++.

Step 1: Install Apache as a Backend

Again, we are installing Apache only as an example, your backend can be any application as per the requirement.

Let’s install apache2 with apt

apt install apache2 -y

After installing, the apache webserver should now listen on port 80, we can verify it by going to our server IP or the domain we pointed to our server’s IP.

https://cdn.diamondzxd.com/index.php/s/8qeebdjmq4m88kr/preview

Changing Apache’s Ports

Since the HTTP ports will be taken over by NGINX server in the future, we’ll change apache’s ports, we can change apache’s ports by editing the Apache’s ports.conf file :

nano /etc/apache2/ports.conf

We’ll change the default HTTP port to 8080 and 8443

Listen 8080

<IfModule ssl_module>

Listen 8443

</IfModule>

<IfModule mod_gnutls.c>

Listen 8443

</IfModule>

Now, let’s restart the apache web-server to see changes.

service apache2 restart

As you can see, apache now listens on port 8080

https://cdn.diamondzxd.com/index.php/s/swk87TWYb56dfFT/preview

Step 2: Installing NGINX webserver

apt install nginx -y

When you install NGINX and go to your Server’s IP, you will see default Apache’s page again. But don’t worry, that’s due to the fact that both webservers are sharing the /var/www/html directory as we can verify from the NGINX’s config file /etc/nginx/sites-enabled/default :

root /var/www/html;

https://cdn.diamondzxd.com/index.php/s/JdpSryAACbGd2M8/preview

Instead of displaying index.nginx-debian.html, it is displaying index.html because it is first in the config’s directory index.

Step 3: Adding Additional Headers to Apache

Although this is not necessary and not required to achieve what we’re doing, but just for a demonstration, we will add an Additional “Serverd-By : Backend” header to see that the content is actually being served by our Backend, and even after reverse proxies the original header will show.

To do that, simply add the following lines to the apache2.conf

nano /etc/apache2/apache2.conf

<IfModule mod_headers.c>

<Directory />

Header always set Served-By “Backend”

</Directory>

</IfModule>

Activate the apache’s headers mod and restart apache webserver.

a2enmod headers

service apache2 restart

Let’s go to SERVER_IP:8080 and verify those headers.

https://cdn.diamondzxd.com/index.php/s/YBcBLBKHJ2EjBtD/preview

As you can see, the Served-By : Backend header is present.

Step 4 : Configuring Reverse Proxy

Now that the backend is setup, it’s time to finally configure reverse proxy.

First, we’ll remove the default configuration file.

unlink /etc/nginx/sites-enabled/default

Then, add our new config to the /etc/nginx/sites-enabled directory

nano /etc/nginx/sites-enabled/reverse_proxy

 

server {

listen   80;

server_name  DOMAIN_NAME;

location / {

proxy_pass      http://YOUR_SERVER_IP:8080;

}

}

 

Replace the DOMAIN_NAME with the actual FQDN you wish to use and YOUR_SERVER_IP with the server IP:PORT or location to your backend.

Then, finally restart NGINX webserver.

service nginx restart

 

Verifying the Proxy

Let’s go to our intended domain name, we’ll find the index.html file being served which was in /var/www/html directory: https://cdn.diamondzxd.com/index.php/s/T4WG6RNsgq9E7DB/preview

 

Okay, we see the index.html, but is it really being served by Our Backend? To verify that, lets inspect the headers: https://cdn.diamondzxd.com/index.php/s/pmBCxZWe8sFDeyQ/preview

 

Indeed, the Served-By : Backend header we set in Apache, is now being displayed through NGINX, which can confirm that the Reverse Proxy is working!

You can also try to stop Apache (Backend), and see what follows

service apache2 stop

https://cdn.diamondzxd.com/index.php/s/RRJBf75atX8NgFf/preview

 

As expected, since the backend is now down, we get a 502 Bad Gateway error, which further verifies that the content is serving through Reverse Proxy J

Let’s restart the backend,

service apache2 start

https://cdn.diamondzxd.com/index.php/s/BN7w3nFfEtBgbjw/preview

And the site comes back up!

 

Conclusion

We have shown your how to configure Reverse Proxy with NGINX over Apache (or any Backend) on a Ubuntu 18.04 VPS. You can do this parallel with your Other NGINX websites on your VPS.

We hope you like this tutorial!

I'm Jon Biloh and I own LowEndBox and LowEndTalk. I've spent my nearly 20 year career in IT building companies and now I'm excited to focus on building and enhancing the community at LowEndBox and LowEndTalk.

No Comments

    Leave a Reply

    Some notes on commenting on LowEndBox:

    • Do not use LowEndBox for support issues. Go to your hosting provider and issue a ticket there. Coming here saying "my VPS is down, what do I do?!" will only have your comments removed.
    • Akismet is used for spam detection. Some comments may be held temporarily for manual approval.
    • Use <pre>...</pre> to quote the output from your terminal/console, or consider using a pastebin service.

    Your email address will not be published. Required fields are marked *