Show Buttons
Share On Facebook
Share On Twitter
Share On Google Plus
Share On Linkdin
Share On Reddit
Share On Stumbleupon
Contact us
Hide Buttons

Setup nginx with multi domain websites running on nodejs

It’s quite com­mon to use NGINX in com­bi­na­tion with sev­eral nodejs servers for host­ing dif­fer­ent appli­ca­tions. In this tuto­r­ial, I am going to show you how setup 2 or more web­sites on a sin­gle host using NGINX.

The fol­low­ing is what we want to achieve at the end
Using a sin­gle host (you can use a vps like dig­i­talo­cean), we will be able to serve 2 websites

  • my-new-website.com
  • blog.my-new-website.com

Assump­tions

  • You have ssh access to a server, such as a vps pro­vided by DigitalOcean.
  • For sake of this tuto­r­ial, we also assume that the con­tent of each of the web­sites men­tioned above is its own nodejs process.
  • You have setup your A and CNAME records cor­rectly for the dif­fer­ent web­sites through your host­ing provider. If you don’t know what those two terms are, take a look at this visu­al­iza­tion which will help you under­stand them.

I have used Ubuntu for this tuto­r­ial but you can most likely use the same com­mands with other *nix systems.


The con­cept

The trick to set­ting up NGINX to serve mul­ti­ple web­sites is pretty straightforward.

  • You install NGINX.
  • You allow it to lis­ten on port 80.
  • You setup other websites(or nodejs processes) to lis­ten on other ports(always choose a port > 1024)
  • You con­fig­ure NGINX to for­ward incom­ing traf­fic on port 80 to the processes lis­ten­ing on the other ports depend­ing on the URL that is being requested.

The setup

Step 1. Installing NGINX

You first need to install nginx. If you are on an ubuntu OS, you can do the following

sudo apt-get install nginx

Start nginx

sudo service nginx start

Now, if you access your ip address/hostname, you should be get the default NGINX page.

The inter­face to your sys­tem now looks like the following

nginx only

TIP
To check your ip-address on an ubuntu os, you can run

ifconfig eth0 | grep inet | awk '{ print $2 }'

Step 2. Start­ing your applications

Now that NGINX is lis­ten­ing on port 80, we need to start our nodejs processes(or any other appli­ca­tions processes) and make them lis­ten on dif­fer­ent ports.

For the sake of this exam­ple, lets say we use the fol­low­ing ports for our applications.

  • my-new-website.com : Port 300
  • blog.my-new-website.com : Port 5000

The inter­face to your sys­tem now looks like the following

nginx and two other servers

Step 3. Con­fig­ure NGINX to for­ward requests to the dif­fer­ent applications

This part is the meat of the mat­ter so fol­low closely.

NGINX has a notion of ‘avail­able sites’ and ‘enabled sites’. Con­cep­tu­ally you can think of ‘avail­able sites’ as a list of all sites that nginx server is aware of that are present locally. And ‘enabled sites’ rep­re­sents a sub­set of the avail­able sites that NGINX can for­ward to.

To define my-new-website.com as an avail­able site, you need to do the fol­low­ing
– Cre­ate a new file, of any name you wish to, but prefer­ably name it related to the name of the web app, in the direc­tory /etc/nginx/sites-available. In our case, I will sim­ply call the file my-new-website.

cd /etc/nginx/sites-available
touch my-new-website
vi my-new-website
  • Place the fol­low­ing con­tents in that file
server {
    listen 0.0.0.0:80;
    server_name my-new-website.com;
    access_log /var/log/nginx/my-new-website.com.log;
    location / {
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header HOST $http_host;
        proxy_set_header X-NginX-Proxy true;
        proxy_pass http://127.0.0.1:3000;
        proxy_redirect off;
    }
}

Notice the places where I used my-new-website in the con­fig­u­ra­tion file above as well the the port num­ber of 3000.

The above con­fig­u­ra­tion file can be read as : For all incom­ing requests on port 80 with the host­name — my-new-website.com, re-route the request to port 3000.

Now, lets also make the blog.my-new-website avail­able to NGINX. I will call this file — my-blog.

cd /etc/nginx/sites-available
touch my-blog
vi my-blog

Place the fol­low­ing con­tents in that file

server {
    listen 0.0.0.0:80;
    server_name blog.my-new-website.com;
    access_log /var/log/nginx/blog.my-new-website.com.log;
    location / {
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header HOST $http_host;
        proxy_set_header X-NginX-Proxy true;
        proxy_pass http://127.0.0.1:5000;
        proxy_redirect off;
    }
}

Now that we have defined the avail­able sites, we can tell NGINX to use the avail­able sites con­figua­tions by sim­ply cre­at­ing cor­re­spond­ing soft links in the sites-enabled directory.

NOTE: When cre­at­ing soft links, make sure to use the full path for the source file else nginx will not be able to serve the enabled sites.

cd /etc/nginx
sudo ln -s /etc/nginx/sites-available/my-new-website sites-enabled/my-new-website
sudo ln -s /etc/nginx/sites-available/my-blog sites-enabled/my-blog

Restart­ing NGINX

Once all the above setup is done, simpy restart NGINX as follows

sudo service nginx restart

Now, you can directly access my-new-site and blog.my-new-website.com with­out hav­ing to enter their respec­tive port numbers.

nginx configured to proxy requests


Glos­sary

Starting/stopping NGINX

sudo service nginx start
sudo service nginx stop
sudo service nginx restart

Remov­ing NGINX

sudo apt-get remove nginx
apt-get purge nginx nginx-common nginx-full

Installing NGINX

sudo apt-get nginx-common # If you removed the nginx-common, you will have to reinstall it
sudo apt-get install nginx

Ryan Sukale

Ryan is a UX engineer living in San Francisco, California.

  • enbits

    Per­fect tuto­r­ial, thanks.

  • Michał Wój­cik

    When i should paste the code website?

    • tuto­ri­al­hori­zon

      Hi Michal, I am not clear on the question.