Setting Up Virtual Hosts With Apache on macOS Sierra

Jason Amador
3 min readOct 31, 2017

--

In the previous post we set up Apache to host a single site locally and access it in the browser at http://localhost. This is great, but there will inevitably be cases in which we will want to host multiple sites using different URLs locally. This is where virtual hosts come in. I like to keep my different projects easily accessible from the browser with URLs like http://local.coolsite or whatever. Our first step is to make some changes to the httpd.conf file that we looked at in the last article.

Creating a Home for Your Sites

First we will create a directory to put our new sites in. I read somewhere on the web that there was once a default folder for this in macOS located at ~/Sites/. This doesn’t exist in Sierra, but we can create it with mkdir ~/Sites. For this little tutorial we’re going to create a virtual host called local.test whose document root will be ~/Sites/test, so we need to create another directory with mkdir ~/Sites/test. Let’s go ahead and create a test file in that directory so we can make sure everything is working:

cd ~/Sites/test && echo "<html><body><h1>Testing, testing</h1></body></html>" > index.html

Configuring Apache for Virtual Hosts

If we search in httpd.conf for “Virtual hosts”, we’ll find a line that looks like this:

#Include /private/etc/apache2/extra/httpd-vhosts.conf

You will want to remove the # from that line, which will basically concatenate the base httpd.conf file to the one referenced above, thus adding whatever configuration is described in httpd-vhosts.conf. In this case we can add some virtual host definitions to our Apache server. This basically means that our single web server can serve multiple sites on different URLs, so we can make a directory called coolsite or whatever and associate that with a “host” (URL) to access the document root for that site.

Now that that file is being included, we should take a look at it. If you open up /private/etc/apache2/extra/httpd-vhosts.conf you should find a file full of commented out instructions and an example at the bottom. Find that example and uncomment it. Restructure it to look like this:

<VirtualHost *:80>
DocumentRoot "/Users/username/Sites/test"
ServerName local.test
</VirtualHost>

There are other attributes to a VirtualHost, but for our purposes this will do the trick.

Adding the Domain to Your Local Hosts List

We need to register the domain that we want to use with your system and make it point to the localhost. To do this you will need to open up /etc/hosts and make some changes. When you open up /etc/hosts you should see something like this:

127.0.0.1         localhost
255.255.255.255 broadcasthost
::1 localhost

127.0.0.1 is your local ‘home’ IP address, and currently the only host associated is localhost. We’ve created a server name called local.test in the httpd-vhosts.conf file, so we can add that to the first line of the /etc/hosts file as follows: 127.0.0.1 localhost local.test

Restart Apache

Everything should be in line now, so let’s try restarting our Apache server and see if we can access our new DocumentRoot via http://local.test by running sudo apachectl restart and navigating to local.test in the browser. We should see “Testing, testing” on the page. Success? Now you can repeat that process with new document roots to manage multiple sites locally on your machine. Failure? Please comment below so I can fix my bad instructions or explain better. Thanks!

--

--

Jason Amador

I’m a software engineer, musician and avid pool player.