The configuration of Apache 2 virtual hosts

Sun, 04/16/2017 - 08:56

In this post I am going to show how to set up an apache virtual host for my www.market.local web project that I am going to use afterwards. For that purpose I am going to use my laptop that runs ubuntu. Every operating system has its own hosts file that is used to map hostnames to not that human-friendly numeric IP addresses. The hosts file allows to configure the domain name system (DNS) locally. So let's go to /ets/hosts file and map our www.market.local to the loopback IP address that points to our local machine. Open /etc/hosts file in vim, nano or in whatever text editor you prefer. I like sublime.

$ sudo subl /etc/hosts

I am actually going to add the mappings for two domain names. One for www.market.local and the other one for www.backend.market.local. You can easily skip the www.backend.market.local if you want to keep it simple.

127.0.0.1	localhost
127.0.1.1	ara-Lenovo-Z50-70

127.0.0.1       www.market.local
127.0.0.1       www.backend.market.local

# The following lines are desirable for IPv6 capable hosts
::1     ip6-localhost ip6-loopback
fe00::0 ip6-localnet
ff00::0 ip6-mcastprefix
ff02::1 ip6-allnodes
ff02::2 ip6-allrouters

Save the changes and close the file. Next we make a dummy content to send as a response to the requests to our specified market hostnames. Now we go to the terminal and create two directories with empty index.html inside.

$ sudo mkdir -p /var/www/market/frontend/web/ 
$ sudo touch /var/www/market/frontend/web/index.html

$ sudo mkdir -p /var/www/market/backend/web
$ sudo touch /var/www/market/backend/web/index.html

Here again you can skip the backend lines if you skipped the backend on the previous step. Don't miss the -p option or else you will get an error. It makes the parent directories if they are needed. After this we end up having the following document structure.

market
├── backend
│   └── web
│       └── index.html
└── frontend
    └── web
        └── index.html

You can change the permissions according to your taste, but now let's just make the index.html files writable in order to echo some welcome text into them.

$ sudo chmod 766 /var/www/market/frontend/web/index.html
$ sudo echo "<h1>Welcome to www.market.local</h1>" > /var/www/market/frontend/web/index.html

$ sudo chmod 766 /var/www/market/backend/web/index.html
$ sudo echo "<h1>Welcome to www.backend.market.local</h1>" > /var/www/market/backend/web/index.html

Ok, now we have the content to show to the visitors of our two domains, but how the server knows which index.html must be shown when you type the domain names in the address bar of your browser. So far we only configured the hosts file and set the two domains to share the same 127.0.0.1 IP address. Here is where the virtual hosts are needed to tell our Apache web server how to treat different domain requests. Apache has its default configuration file /etc/apache2/sites-enabled/000-default.conf with the following content

ara@ara-Lenovo-Z50-70:~$ cat /etc/apache2/sites-enabled/000-default.conf
<VirtualHost *:80>
	# The ServerName directive sets the request scheme, hostname and port that
	# the server uses to identify itself. This is used when creating
	# redirection URLs. In the context of virtual hosts, the ServerName
	# specifies what hostname must appear in the request's Host: header to
	# match this virtual host. For the default virtual host (this file) this
	# value is not decisive as it is used as a last resort host regardless.
	# However, you must set it for any further virtual host explicitly.
	#ServerName www.example.com

	ServerAdmin webmaster@localhost
	DocumentRoot /var/www/html
	        
	# Available loglevels: trace8, ..., trace1, debug, info, notice, warn,
	# error, crit, alert, emerg.
	# It is also possible to configure the loglevel for particular
	# modules, e.g.
	#LogLevel info ssl:warn

	ErrorLog ${APACHE_LOG_DIR}/error.log
	CustomLog ${APACHE_LOG_DIR}/access.log combined

	# For most configuration files from conf-available/, which are
	# enabled or disabled at a global level, it is possible to
	# include a line for only one particular virtual host. For example the
	# following line enables the CGI configuration for this host only
	# after it has been globally disabled with "a2disconf".
	#Include conf-available/serve-cgi-bin.conf
</VirtualHost>

# vim: syntax=apache ts=4 sw=4 sts=4 sr noet

But we will make our own market.conf file in the same directory as the default one and open it in our favourite sublime editor.

sudo touch /etc/apache2/sites-available/market.conf
sudo subl /etc/apache2/sites-available/market.conf

And write two <VirtualHost> configuration entries in our market.conf, where for each domain name we specify DocumentRoot directory where the index.html files reside.

<VirtualHost *:80>
    ServerName www.market.local
    DocumentRoot /var/www/market/frontend/web
    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

<VirtualHost *:80>
    ServerName www.backend.market.local
    DocumentRoot /var/www/market/backend/web
    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Save and close the file. Now we have to enable our configuration by creating a symlink to the market.conf in the /etc/apache2/sites-enabled/ directory.

sudo ln -s /etc/apache2/sites-available/market.conf  /etc/apache2/sites-enabled/market.conf

After crating the symlink we can restart the Apache server

$ sudo service apache2 restart

That's it. Now we will get our welcome messages if we type the domain names in the browser.

Tags