DEV Community

Shubham Kumar
Shubham Kumar

Posted on

Understanding Reverse Proxy with Nginx - Step By Step Guide

Introduction:

In the realm of web servers and networking, the concept of a reverse proxy is a powerful and versatile tool. Among the myriad of choices, Nginx stands out as a robust solution for implementing reverse proxy functionality. In this blog post, we'll explore what a reverse proxy is, why it's beneficial, and how to set up and configure one using Nginx.

What is a Reverse Proxy?

A reverse proxy is a server that sits between client devices (such as web browsers) and a web server, forwarding client requests to the server and returning the server's responses back to the clients. Unlike a forward proxy, which handles requests from clients to the internet, a reverse proxy manages requests from clients to one or more backend servers.

Why Use a Reverse Proxy?

Port Forwarding:
A reverse proxy is an excellent tool for simplifying and securing port forwarding scenarios. Instead of exposing internal services directly to the internet, you can use a reverse proxy to manage access to these services.

Load Balancing:
One of the primary benefits of using a reverse proxy is load balancing. When multiple backend servers are available, a reverse proxy distributes incoming requests among them, ensuring optimal resource utilization and preventing any single server from being overwhelmed.

Increased Security:
A reverse proxy acts as an additional layer of security for your web applications. It can hide the identity and characteristics of your backend servers from external clients. This adds a level of obscurity, making it more challenging for potential attackers to gather information about your infrastructure.

SSL Termination:
Handling SSL/TLS encryption can be resource-intensive for backend servers. A reverse proxy can offload the SSL termination process, freeing up resources on the backend and simplifying certificate management.

Web Acceleration:
Reverse proxies can cache static assets, such as images and CSS files, and serve them directly to clients. This reduces the load on backend servers, speeds up content delivery, and enhances overall web performance.

Setting up Reverse Proxy with Nginx:

Step 1: Install Nginx. I am using Ubuntu OS.

sudo apt-get update
sudo apt-get install nginx
Enter fullscreen mode Exit fullscreen mode

Step 2: Configure Nginx as a Reverse Proxy
Edit the Nginx configuration file, usually located at /etc/nginx/nginx.conf or /etc/nginx/sites-available/default. Add a location block for the backend server:

server {
    listen 80;

    server_name example.com;

    location /serviceA/ {
        proxy_pass http://backend-server:8080/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }

    location /serviceB/ {
        proxy_pass http://backend-server:8081/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }

    # Add more location blocks for additional services as needed
}

Enter fullscreen mode Exit fullscreen mode

Let's say you have multiple services running on your backend servers, each on a different port (e.g., service A on port 8080, service B on port 8081, and so on). Instead of exposing each service individually, you can leverage Nginx as a reverse proxy for port forwarding.

Replace example.com with your domain and backend-server with the address of your backend server.

proxy_pass http is the parameter where you have to mentioned where really you want to forward or proxy to. So, as per the configuration of the above file if you hit example.com/serviceA --> it will proxy you to the backend service with name backend-server and port 8080 and likewise for serviceB.

Step 3: Test and Reload Nginx
Test the configuration for syntax errors:

sudo nginx -t
Enter fullscreen mode Exit fullscreen mode

If no errors are reported, restart Nginx to apply the changes:

sudo service nginx restart
Enter fullscreen mode Exit fullscreen mode

Step 4: Test the Reverse Proxy if it is working

Incase you don't have any backend services currently running on the server, you can test it by the following approach

Create a file named index.html with some basic content. For example:

<!DOCTYPE html>
<html>
<head>
    <title>Port Forwarding Test</title>
</head>
<body>
    <h1>Hello, this is a test page!</h1>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Use Python to Serve the HTML File on Port 8080:

Open a terminal and navigate to the directory containing index.html. Run the following Python command to start a simple HTTP server on port 8080:

cd /path/to/test/
python3 -m http.server 8080
Enter fullscreen mode Exit fullscreen mode

Update Nginx Configuration with the following configuration by following all the steps mentioned above:

server {
    listen 80;
    server_name localhost;

    location / {
        proxy_pass http://127.0.0.1:8080;
        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;
    }

    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
        root /usr/share/nginx/html;
    }
}
Enter fullscreen mode Exit fullscreen mode

Access Your Application:
Now, you should be able to access your application on port 80, and Nginx will forward the traffic to port 8080.

Visit http://localhost (or Server IP) in your web browser, and it should display the content served by the application running on port 8080.

Adjust the Nginx configuration as needed based on your specific requirements and the structure of your application.

Thank you for reading our guide! We hope it proves valuable for your web server setup. If you have any questions or suggestions, feel free to reach out on kumarshubham1807@gmail.com. Happy coding!

Top comments (0)