What is NGINX & Reverse Proxy and How to configure Routing and LoadBalancing in NGINX for HTTP and HTTPS

In this article we are going to see what is NGINX and ReverseProxy. NGINX is a webserver serves static files like HTML, Javascript and CSS. NGINX acts as gateway for your Http Request and sends the request to backend servers. 

In simple words it sits infront of your backend servers. Your backend servers may be in any technology like Nodejs, Java, .Net etc.

What are the functionalities NGINX will do ?

1. Routing

2. Load Balancer

3. SSL.

4. Headers Manipulation

First Let we see how to use the NGINX, download the NGINX from the online. then unzip the folder in the C: drive. now go inside the nginx folder, and open the conf folder, inside you may find the nginx.conf file. open it.

you will see two things namely 

server name is the localhost which is listen in 80 port, that means when ever any one browse http://localhost:80, nginx will get executed or process the request.

Routing:

We can route the request to different backend based on url, For Example when you request http://localhost:80/ we will route to Angular App internally, when we request http://localhost:80/react we will route to someother application. to do that so below is the sample configuration.

If you see above configuration you can notice that after location / or /react are the path, for which it routes to backend server map at proxy_pass  directive.

Load Balancer:

It will acts as Load Balancer. For example if you configure multiple backend servers for same application then that multiple servers are receive the request from NGINX, based on weightage, IP etc. Not all request are sent to same server, Request is distributed equally to all servers.

To do that we have to use the configuration section upstream. Give the upstream name with hypen.

Note: Now pass the name of upstream in proxy_pass directive. Here we declare the two servers with weight 1.

SSL:

NGINX will process the Https request, for that we have to configure Https section with SSL. To create a SSL we can use the OpenSSL tool to create a testing certificate with private key.

Download OpenSSL and run the below command which will give the SSL Certificate with Private Key.

openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout private.key -out certificate.crt

Then configure the SSL, paste the two files crt and private key in a folder inside nginx folder and refer it in conf file.

  ssl_certificate      ../cert/certificate.crt;
  ssl_certificate_key  ../cert/private.key;

Headers Manipulation:

You can see that Headers are manipulated in config file, that means we can set the headers

Below is the example configuration file.

Example of Config section for Https

  upstream backend-servers {
        server localhost:4200 weight=1;
        server localhost:4201 weight=1;
    }

    server {
       listen       443 ssl;
       server_name  localhost;

       ssl_certificate      ../cert/certificate.crt;
       ssl_certificate_key  ../cert/private.key;
       
        location / {
            proxy_pass http://backend-servers;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }

        location /react {
            proxy_pass http://localhost:4202/;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }
        
    }

Example of Config section for Http

 upstream backend-servers {
        server localhost:4200 weight=1;
        server localhost:4201 weight=1;
    }

    server {
       listen       80;
       server_name  localhost;
       
        location / {
            proxy_pass http://backend-servers;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }

        location /react {
            proxy_pass http://localhost:4202/;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }
        
  }

From this article you may find the some basics of NGINX.