How to Preview Your Site ie6-8 In Vista Using Virtual PC and localhost

If you've done any slightly-complex theming, and actually have people viewing your site, you know that many people still use old versions of Microsoft's ie browser.  

As you can see, ie7, ie6, and firefox each have about 30% of the visits to one of my sites for May 2008.  Since I use firefox and chrome for my basic site building and testing, they always display properly.  But because two thirds of my users are using problematic browsers (ie6 and ie7) I need to do testing of my pages whenever I do any display changes.

I run a lot of drupal sites, and a variety of other hodgepodge php-based sites.  I host on a linux server, but (though I have a dual boot system) I usually use Vista for a lot of my development.  The question is - how can a person do testing of the web page for multiple versions of ie.  You certainly can't install multiple versions of ie on the computer - in their infinite wisdom, Microsoft didn't allow that.

The best answer is to use Microsoft's Virtual PC.  First of all, download the Virtual PC program.

Then, download the "images" of XP with ie6 and XP with ie7.  You can follow these basic instructions in a general way to setup/run Virtual PC. (The instructions are for running the ie8 disk image: since you've downloaded the ie6 or ie7 image, just use the correct one of your downloaded images.)  By the way, if you have Vista Home Premium like I do, just ignore the warning messages that VirtualPC is unsupported: it works fine.

Once you are running your virtual PC, and you start ie in that virtual PC window, you'll be pleasantly surprised how automatically your internet settings are setup and you are browsing the internet.  (If it doesn't work right away, try modifying the "Settings/Networking" options from the VirtualPc Console - you can even do this while you are running the virrual image.) However, after starting your local apache server on your Vista host PC, you'll devastated when you try to do "http://localhost/" because you'll realize that the site it's trying to find is the one on the VIRTUAL PC, not on your host PC.  

Luckily, the solution isn't hard.  You need to replace "localhost" with your IP address.  In my case, I set up my local network as 192.168.15.* and my host Vista PC has IP 192.168.15.45.  Since I have a lot of sites I test locally, I have set each one up on its own port through the apache configuration - so here's my URL "http://192.168.15.45:8086/index.php" - that is of course for port 8086.

That still isn't working?  No surprise... it's probably because you haven't set up your apache configuration file to properly accept the requests with the IP address as the hostname!  I just added in one VirtualHost entry and viola - it worked.  Here are the two VirtualHost entries (one gets the requests for "localhost" from my host pc" and the other gets the requests for the IP address from either the host pc or the virtual pc):

<VirtualHost 127.0.0.1:8086>
ServerAdmin temp [at] temp [dot] com
DocumentRoot "c:/site"
ServerName example.com
</VirtualHost>
<VirtualHost localhost:8086>
ServerAdmin temp [at] temp [dot] com
DocumentRoot "c:/site"
ServerName example.com
</VirtualHost>

Now it should be working!