Nginx Reverse Proxy. Multiple Applications on One Domain

Written by
Date: 2015-03-29 16:00:00 00:00


Usually when you install a Web Application you assign its own domain for it, but there are a handful times when you want to install two or even more applications under the same domain. For example, let's say you have a Wordpress blog, and you want to use ZenPhoto for your photo album, and just to complicate it a little more you want to have a forum managed by Discourse. Sure you can just use Wordpress plugins to make Wordpress manage all of these, or use Drupal or any other thing, but for this example let's suppose you want to do it this way.

Let's suppose the structure will have this form:

/wordpress/ -> Wordpress /photoblog/ -> ZenPhoto /forum/ -> Discourse

This post will not cover how to install ZenPhoto, Wordpress or Discourse.

Installing applications

I have seen two ways the web applications are installed, PHP/MySQL applications that usually are powered by Apache or Nginx, and you can just install them in different folders and run as virtual servers, and those that are build with Ruby on rails or Node.js, like Discourse or the blogging platform Ghost, that have their own web server and usually run on a non-standart port.

In our example we are going to install Wordpress and ZenPhoto in their own folders or you can even install them on their own servers, just make sure they "know" they are running on a sub-folder. Discourse will be installed as adviced using Docker and responding on an specific port. This is going to be our scenario.

Wordpress, running on 192.168.1.2 port 8080 ZenPhoto, running on 192.168.1.3 port 8080 Discourse, running on 192.168.1.4 port 8080

Installing and configuring Nginx

Our Nginx and front server will be running on 192.168.1.1 and responding to port 80, it will act as a reverse proxy, it can have micro-cache enabled, which configuration is different for each application of the example, here will not be used, in future posts I will be showing different specific combinations.

sudo apt-get install nginx

Once installed we will configure the default virtual server to serve as our reverse proxy.

server {
    listen 80 default_server;
    listen [::]:80 default_server ipv6only=on;

    root /usr/share/nginx/html;
    index index.html index.htm;

    server_name www.example.com;

    location / {
        try_files $uri $uri/ =404;
    }

    location /wordpress/ {
       proxy_set_header X-Real-IP  $remote_addr;
       proxy_set_header X-Forwarded-For $remote_addr;
       proxy_set_header Host $host;
       proxy_pass http://192.168.1.2:8080;
       }

    location /photoblog/ {
       proxy_set_header X-Real-IP  $remote_addr;
       proxy_set_header X-Forwarded-For $remote_addr;
       proxy_set_header Host $host;
       proxy_pass http://192.168.1.3:8080;
    }

       location /forum/ {
       proxy_set_header X-Real-IP  $remote_addr;
       proxy_set_header X-Forwarded-For $remote_addr;
       proxy_set_header Host $host;
       proxy_pass http://192.168.1.4:8080;
       }
}

As it can be seen, Nginx is forwarding the everything back to the appropriate application depending on the folder, behind the scenes each application working to serve the users, the frontpage might be any other application or just a static web page with links to the applications behind.