Configure VirtualBox Shared Folder as Apache Virtual Host

As mentioned in the previous article, I am using a virtual machine in order to test locally a small website built with nanoc containing a couple of dynamic PHP pages. We left out with a functional VM running a LAMP stack that was setup with a shared folder between the host and the guest containing the website to test.

In this article, we’ll configure Apache on the VM in order to use this shared folder as the source for a website that can be accessed directly from the host.

Set up Apache Virtual Host

To start with, connect to the VM using SSH:

1
ssh root@IP

Once connected, create a new virtual host on Apache.

1
nano /etc/apache2/sites-available/website-article

And fill it in with the necessary information

<VirtualHost *:80>
    ServerAdmin webmaster@localhost
    ServerName article.example
    ServerAlias article
    DocumentRoot /media/sf_website

    <Directory /media/sf_websites>
        Options Indexes FollowSymLinks MultiViews
        AllowOverride All
        Order deny,allow
        Allow from all
    </Directory>
</VirtualHost>

In the configuration file above, the DocumentRoot and Directory directives are pointing to the shared folder (/media/sf_website) that was set up at the end of the previous article.

Enable the new site and reload Apache to activate the new configuration.

1
2
a2ensite website-article
/etc/init.d/apache2 reload

Configure the Host to Access New Site

On the host (i.e. your computer), edit the hosts file (/etc/hosts on Linux) in order to add the necessary mapping for the site created. To illustrate this article, I have added the following line:

192.168.1.110   article.example

The first part is the IP address of the VM and the second part is the server name that have been defined in the virtual host configuration.

If everything is set up properly, you should now be able to ping article.example from a console and get an answer from the server.

$ ping article.example
PING article.example (192.168.1.110) 56(84) bytes of data.
64 bytes from article.example (192.168.1.110): icmp_req=1 ttl=64 time=0.902 ms
64 bytes from article.example (192.168.1.110): icmp_req=2 ttl=64 time=0.234 ms
64 bytes from article.example (192.168.1.110): icmp_req=3 ttl=64 time=0.234 ms
64 bytes from article.example (192.168.1.110): icmp_req=4 ttl=64 time=0.214 ms

However, this is not over yet. If you open your browser and enter the following address http://article.example/, chances are that you will not see what you are expecting. At the moment, you are probably welcome with a forbidden error message like the following.

Load Shared Folder with Correct User / Group

As far as I can tell, this error is due to the owner and group of the shared folder. Apache expects the files to render to belong to the group www-data. By default, however, the shared folder in VirtualBox belongs to the vboxsf user. We will add this user to the www-data group. To do so, edit the group properties on the guest:

1
nano /etc/group

and edit the line that says vboxsf:x:1001: to replace it with the following:

vboxsf:x:1001:www-data

This might require a restart of the virtual appliance. But before doing that, let’s configure our shared folder a bit more. In this case, we’ll set up the shared folder so that it is permanent, but not automatically mounted. To access the shared folder properties, simply click on ‘Settings’ in the main the VirtualBox window and set it up to look like in the screenshot below.

Now is a good time to restart the guest machine. After it has restarted, and since the shared folder is not auto-mounted anymore, you’ll likely to see an empty page listing nothing.

We’ll now mount the shared folder and assign it to the www-data user and group. To check out the user and group id, you can have a look at the /etc/passwd file on the guest machine (cat /etc/passwd | grep 'www-data'). On Debian based OS, both ids are usually set to the value 33. So, simply issue the following command on the guest:

1
mount -t vboxsf -o rw,uid=33,gid=33 website /media/sf_website

Note that website is the name of the shared folder (as illustrated in the screenshot above) and /media/sf_website is where the folder will be mounted.

At this stage, congratulations, the new website should be available in your browser.

However, it would be cumbersome to have to mount the shared folder manually all the time the guest is started. So let’s fix that. Edit the /etc/fstab file on the guest:

1
nano /etc/fstab

Simply add the line below at the end of the file.

website /media/sf_website   vboxsf  rw,uid=33,gid=33    0   0

Try rebooting the appliance one last time, and open your browser to http://article.example/. The website should load properly.

Final Word

The above procedure can be repeated for the different website that need to be tested. Simply add a new shared folder, and configure the host and guest machines as illustrated in this article.

If you want to go a step further, you can use Vagrant, a VirtualBox CLI, in order to automate some of the steps above. Net Tuts has published an excellent tutorial about this.