Mulitple Virtual Hosts in WampServer

 Many PHP developers working on web sites use a local server on their PC to develop web sites.  This involves installing a LAMP stack, or integrated Apache, PHP, phpMyAdmin, and MySQL.  Each of these pieces can be loaded independently, but it's quicker to load one application that integrates all the software pieces, and gives you a menu system to interact with the various components.  One of the most popular LAMP stacks on Windows is WampServer, which is what I use, mostly because of its easy to use menu system.

Web developers work on multiple web site projects over time.  In WampServer, you normally make a folder in the c:\wamp\www directory for each project, but as that folder expands, and customers want to see your progress, you want to put your projects in another folder, besides www.  This is accomplished by making a "virtual host", or a locally defined domain or domains in another directory to bring up a web site by name.

To make virtual hosts, you need to modify three files: hosts, httpd.conf, and httpd-vhosts.conf.  In addition, if you would like to have virtual hosts show up under the Virtual Hosts menu in the WampServer menu, we have a little more work to do.  Let's take each in turn.

Before we start, a word to the wise, I would like to recommend that you create a backup copy of each file before you make any changes.  Apache is sensitive to any syntax or incorrect content errors, and will shut down, leaving you scratching your head as to why.  I even go as far to suggest that with every change you make, to restart apache to make sure your change did not shut it down. It is very easy to have Apache not work.  Do yourself a favor, and make a copy of the good file, before you make any edits, enough said.

Let's start with the "hosts" file.  This is a Windows file located at C:\windows\system32\drivers\etc\hosts.  The purpose of the hosts file is to translate a hostname into an IP address that Windows will use to bring up the web site with that hostname.  It matches a name with an IP address.  If that name is typed in a browser window, Windows will call the IP address in the hosts file, and bring up the web site.  In the case of localhost, your local server, that IP address is 127.0.0.1.  You need to tell Windows, any names you want to use as a virtual host  with the 127.0.0.1 address.  You can have as many virtual hosts as you want.  Let's take a look at my hosts file.

To edit this file, you need to first bring up Notepad by right-clicking your mouse on the Notepad icon and clicking on "Run as admistrator," otherwise Windows will not let you save the file, then open the file with notepad.  In addition, you will not see the file in the etc directory until you tell the pop-up explorer window to show all files, instead of just the txt files.  If you use any other editor, beside notepad, you may not even see an etc directory.

I have created a c:\mysites directory, and in it I placed three subfolders called: "TestWamp", "ProjectOne", and "ProjectTwo" which will be three virtual hosts.  In another folder, I created another virtual host called "navigate".   In each folder I created an index.html file so I could test that the site came up in my browser.  In addition, all my wamp\www projects still run, because the "localhost" name also is mapped in my hosts file.

Now to the two Apache files.  Apache uses the httpd.conf file as its configuration file.  In Wamp it is located at: C:\wamp\bin\apache\apache2.2.22\conf.  We keep all our virtual host settings in another file httpd-vhosts.conf.  That file is one directory down from httpd.conf in the /extra directory.

First, we want to tell Apache that we have virtual hosts and to look in the virtual hosts file.  httpd.conf has about 490 lines, around line 467 at the bottom uncomment or take out the # sign to the virtual hosts directive.  Here's what it should look like.

Lastly, the httpd-vhosts.conf file. After the comments at the top of the file.  My vhosts file looks like this:

I will not explain all these setting, except to point some things out.  You'll notice at the top, I need to include a localhost server name.  If you don't, you won't get the Wamp localhost menu to show.  The WampServer knows where Apache is located, so you only need to include where the folder is you want to be your domain root, and the name for that folder.

For the rest of the virtual hosts, you need to tell Apache the permissions to use for your virtual directories.  I suggest you just copy the format shown here.  You can tell Apache other things like where log files are located and error logs, but for now I'll keep it simple.  You can look at the commented out lines at the start of the file for additional directives.  Quotes are important, and you'll notice the slashes are forward slashes, /, not Window's backslashes.  And finally, if you make any typos, Apache will not start.  The quickest way to check this out is to comment out the file in the httpd.conf file, and see if Apache starts.

A couple of gotchas, around line 19 you need to tell Apache to use names for virtual hosts.  This is not shown in above picture.  The needed line should read:

NameVirtualHost *

If you virtual hosts don't work, check that the name in the Windows hosts file matches exactly the Server name in httpd-vhosts.

Now, if I type "projecttwo" in my browser URL window, I get the index.html file in the mysites/projecttwo directory loaded into my browser.

Lastly, something I have not seen anywhere else.  The WampServer localhost menu has a section for Your Virtual Hosts, but there currently is not any documentation on how to populate this menu in the WampServer menu.  Like here:

If you click on any of the virtual hosts in the Your Virtual Hosts menu, the site will launch.  If you don't have a virtual host menu displayed on your localhost screen, see my article on "Missing Your Virtual Host Menu".   If you do, here's what you do.

Create a folder in wamp called vhosts. It should be in c:\wamp\vhosts, not in www.  For each of your virtual hosts create a conf file. Here's my vhosts folder.

Finally, let's look at what's inside the projecttwo.conf file, here:

Keep the syntax along with the /'s and you're all set.  Each virtual host in the menu will direct you to the virtual host directory.  Restart wamp, click on a virtual host, and it will load your index.html file into your browser.  Enjoy.

Comments

Mulitple Virtual Hosts in WampServer — 7 Comments

  1. I did everything in this article but my site still won’t come up in the browser unless it’s preceded by localhost as in localhost/mysite. Doesn’t matter if I click the link under My Projects or Virtual Hosts.

    • I suspect that you haven’t put your virtual site in the Windows host file. I would check the file, if you edited the file with anything but the Windows notepad editor, it will not save, and you must have admin rights by clicking right clicking on the notepad name and selecting “Run as Administrator”.

  2. MY GOD SIR! Thank you! I was searching for a couple days for why my site was not appearing on the virtual hosts section on the wampserver index page. Like Koen Peperman mentioned, I was also able to get page to show up without anything in the mysite.conf file, however I worry this will lead to problems later that I was wondering if you would know about? Also, I was wondering if you know what the intent of having both a ‘your projects’ and ‘your virtual hosts’ section was on the index page? I am new to setting up a local development environment and am unsure of the purpose and/or difference between the ‘your projects’ and ‘your virtual hosts’ sections.

    • The only real difference is that with “Your Virtual Hosts” you have to set up a virtual host yourself, while “Your Projects” are any sites you put in the www directory, and they are set up automatically for you without you having to mess around with Windows or Apache.

  3. Hi. Thanks for the very clear instructions. As you say the last part is not documented. On my system it is enough to create an empty file in the folder vhosts with the name of the virtual host. The virtual host is shown and usable.

    • Yes, after the article I found out the same thing. You don’t have to have anything in the file, just the correct file name of the file in the folder. Thanks

  4. Hello there I am so delighted I found your blog page, I really found you by mistake, while I was researching for something else,

    Regardless I am here now and would just like to say many thanks for a remarkable post and a all round enjoyable blog

    I don’t have time to go through it all at the moment but I have bookmarked it and also included your RSS feeds, so when I have time I will be back to read more, Please do keep up the excellent work.
    php web development