Why reverse proxying serves backend applications in Nginx - Visual Breakdown

Process Flow - Why reverse proxying serves backend applications

Client sends request

↓

Reverse Proxy receives request

↓

Reverse Proxy forwards request to Backend

↓

Backend processes request

↓

Backend sends response to Reverse Proxy

↓

Reverse Proxy sends response to Client

The client sends a request to the reverse proxy, which forwards it to the backend server. The backend processes it and sends the response back through the proxy to the client.

Execution Sample

Nginx

server {
  listen 80;
  location / {
    proxy_pass http://backend_server;
  }
}

This nginx config sets up a reverse proxy that forwards all client requests to a backend server.

Process Table

Step	Action	Request State	Backend State	Response State
1	Client sends HTTP request to nginx reverse proxy	Request received by proxy	No action yet	No response yet
2	nginx reverse proxy forwards request to backend server	Request forwarded	Request received by backend	No response yet
3	Backend processes request	Request forwarded	Processing request	No response yet
4	Backend sends response to nginx reverse proxy	Request forwarded	Response sent	Response received by proxy
5	nginx reverse proxy sends response to client	Request completed	Response sent	Response sent to client
6	Connection ends	No active request	Idle	Client received response

💡 Request cycle completes when response is sent back to client and connection closes.

Status Tracker

Variable	Start	After Step 2	After Step 4	Final
Request State	Not received	Received and forwarded	Forwarded, waiting response	Completed
Backend State	Idle	Request received	Response sent	Idle
Response State	No response	No response	Received by proxy	Sent to client

Key Moments - 3 Insights

Why does the client not communicate directly with the backend?

The client sends requests to the reverse proxy, which forwards them to the backend. This is shown in execution_table steps 1 and 2 where the proxy receives and forwards the request.

What happens if the backend is slow or down?

The reverse proxy can handle retries, caching, or show error pages. This is implied in step 3 and 4 where the backend processes or fails to respond, but the proxy manages the client connection.

Why is the response sent back through the reverse proxy?

The proxy controls the client connection and can modify or secure responses. Execution_table steps 4 and 5 show the backend sending response to proxy, which then sends it to client.

Visual Quiz - 3 Questions

Look at the execution table, at which step does the backend first receive the client request?

A Step 3

B Step 1

C Step 2

D Step 4

💡 Hint

Check the 'Backend State' column to see when the backend receives the request.

At which step does the reverse proxy send the response back to the client?

A Step 5

B Step 3

C Step 4

D Step 6

💡 Hint

Look for when 'Response sent to client' appears in the 'Response State' column.

If the backend is down and does not respond, which step would be delayed or missing?

A Step 2

B Step 4

C Step 3

D Step 5

💡 Hint

Step 4 shows backend sending response; if backend is down, this step won't happen.

Concept Snapshot

Reverse proxy acts as a middleman between clients and backend servers.
Clients send requests to the proxy, not directly to backend.
Proxy forwards requests, receives backend responses, then sends them to clients.
Benefits include security, load balancing, caching, and hiding backend details.
Nginx config example: proxy_pass directive forwards requests to backend.

Full Transcript

When a client wants to access a backend application, it sends a request to the reverse proxy server instead of directly contacting the backend. The reverse proxy receives the request and forwards it to the backend server. The backend processes the request and sends the response back to the reverse proxy. Finally, the reverse proxy sends the response to the client. This setup helps protect the backend, balance load, and manage traffic efficiently. The nginx configuration uses the proxy_pass directive to forward requests to the backend server.

Practice

1. What is the main purpose of using a reverse proxy like nginx for backend applications?

easy

A. To store user data permanently

B. To replace the backend application entirely

C. To act as a middleman between users and backend servers

D. To directly expose backend servers to the internet

Solution

1. Step 1: Understand the role of a reverse proxy

   A reverse proxy sits between users and backend servers, forwarding requests and responses.

2. Step 2: Identify the main purpose

   It improves security and performance by hiding backend details and managing traffic.

3. Final Answer:

   To act as a middleman between users and backend servers -> Option C

4. Quick Check:

   Reverse proxy = Middleman [OK]

Hint: Reverse proxy = middleman between user and backend [OK]

Common Mistakes:

• Thinking reverse proxy replaces backend apps
• Assuming it stores user data
• Believing it exposes backend directly

2. Which nginx directive is used to forward client requests to a backend server in reverse proxy setup?

easy

A. proxy_pass

B. server_name

C. listen

D. root

Solution

1. Step 1: Identify nginx directives related to proxying

   The directive that forwards requests to backend servers is proxy_pass.

2. Step 2: Differentiate from other directives

   server_name sets domain, listen sets port, root sets file path.

3. Final Answer:

   proxy_pass -> Option A

4. Quick Check:

   Forward requests = proxy_pass [OK]

Hint: proxy_pass forwards requests to backend [OK]

Common Mistakes:

• Confusing proxy_pass with server_name
• Using listen to forward requests
• Mistaking root for proxying

3. Given this nginx config snippet, what happens when a user accesses http://example.com/api/?

location /api/ {
    proxy_pass http://backend_server/;
}

medium

A. Requests to /api/ are forwarded to http://backend_server/

B. Requests to /api/ are forwarded to http://backend_server/api/

C. Requests to /api/ are served from nginx root directory

D. Requests to /api/ cause a 404 error

Solution

1. Step 1: Understand proxy_pass behavior with trailing slash

   When proxy_pass URL ends with a slash, nginx replaces the matching part of the request URI.

2. Step 2: Apply to given config

   Request to /api/ is forwarded to backend_server root /, so /api/ is replaced by /.

3. Final Answer:

   Requests to /api/ are forwarded to http://backend_server/ -> Option A

4. Quick Check:

   proxy_pass with trailing slash replaces matching URI [OK]

Hint: Trailing slash in proxy_pass replaces matching URI part [OK]

Common Mistakes:

• Assuming URI is appended instead of replaced
• Thinking nginx serves files locally
• Expecting 404 without backend

4. You configured nginx as a reverse proxy but get a 502 Bad Gateway error. Which is the most likely cause?

medium

A. server_name directive is incorrect

B. proxy_pass directive is missing a semicolon

C. nginx is listening on the wrong port

D. Backend server is down or unreachable

Solution

1. Step 1: Understand 502 Bad Gateway meaning

   502 means nginx cannot connect to the backend server to get a valid response.

2. Step 2: Identify common causes

   The backend server being down or unreachable is the most common cause of 502 errors.

3. Final Answer:

   Backend server is down or unreachable -> Option D

4. Quick Check:

   502 error = backend unreachable [OK]

Hint: 502 error usually means backend server unreachable [OK]

Common Mistakes:

• Blaming missing semicolon for 502 error
• Confusing port listen issues with backend errors
• Assuming server_name causes 502

5. You want nginx to serve static files directly but forward API requests to a backend app. Which config snippet correctly achieves this?

hard

A. location / { proxy_pass http://backend/; } location /api/ { root /var/www/html; }

B. location /api/ { proxy_pass http://backend/; } location / { root /var/www/html; }

C. location /api/ { root /var/www/html; } location / { proxy_pass http://backend/; }

D. location / { root /var/www/html; proxy_pass http://backend/; }

Solution

1. Step 1: Separate static and API requests

   Static files should be served from nginx root for /, API requests proxied under /api/.

2. Step 2: Check config snippet correctness

   location /api/ { proxy_pass http://backend/; } location / { root /var/www/html; } correctly proxies /api/ to backend and serves / from local files.

3. Final Answer:

   location /api/ { proxy_pass http://backend/; } location / { root /var/www/html; } -> Option B

4. Quick Check:

   Static on /, API on /api/ with proxy_pass [OK]

Hint: Proxy API path, serve static root separately [OK]

Common Mistakes:

• Reversing proxy and root locations
• Combining proxy_pass and root in same block
• Serving API requests from root directory