Juggling HTTP requests with nginx — Part 1 Error Pages

Introduction

Nginx is a high performance web server capable of serving content with flexibility and power.

Here i am going to talk about how you can protect and handle the load on your services well with a simple set of configuration that will allow you to serve your http request from multiple upstream servers.

In extreme conditions, you can use the same to protect your app servers from going completely down and still salvage to serve 200’s to most of your users.

I will divide this configuration into three different parts for making it easier for us.

Assumptions
Here the upstream app servers are simple Rest API Services.

Part 1: Basic error page

This part is applicable for most of the web services.

What happens when your upstream service is not running or cannot accept any more request and starts rejecting requests. In such cases, what you will see is default 50x error page which is served via nginx.

This is typical 502 error page which your users will see.

Your users seeing this is bad, they will be lost at this point not knowing where to go and possibly drop off.
Your loss.

Now nginx provides you a way to show override these pages with your own custom error pages where you provide link to navigate to Home Page or other pages, hoping that they are not down as well. Something is better than nothing. Hopefully they continue using your product.

And this all is done at nginx itself with no change of logic to your application server.

Here i have tried to setup a live example with the following configuration .

upstream your_app{
    server unix:/absolute/path/to/unix/socket.sock fail_timeout=0;
}
server{
    listen   80;
    server_name juggler.bipuljain.com;
 
    location /no_error_pages {
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_pass http://your_app;
    }
    
    location /error_page_handled {
        error_page 500 502 503 504 /custom_50x.html;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_pass http://your_app;
    }
    
    location = /custom_50x.html {
        root /usr/share/nginx/html;
        internal;
    }
}

Here the upstream server is a random path and is not running.

So, If you go to http://juggler.bipuljain.com/no_error_pages you will see the default nginx page with 502 error.
And if you go to http://juggler.bipuljain.com/error_page_handled which is the custom error page defined via HTML specified in the folder.

This is something better than nothing and user have a few links to navigate to.

How:

Here if you see in the location block for /error_page_handled you will see error_page
Defines the URI that will be shown for the specified errors. A uri value can contain variables. More here
http://nginx.org/en/docs/http/ngx_http_core_module.html#error_page

tag where you can specify the pages to be served for i.e. 500 502 503 504 and serves the html file custom_50x.html inside /usr/share/nginx/html folder

We are going to leverage this tag and few other tags to show how can you handle any load over the next posts.

Part 2 : Location Blocks

In the next part i will be talking name location block and tag and how to setup fallbacks in case where your service is failing.

here is the link https://medium.com/@_bipul/juggling-http-requests-with-nginx-part-2-location-directive-480d9f8abfc0