Easy (and free) way to test local sites with iPads, iPhones, and other mobile devices
So you have a virtualhost set up for Apache and your local site is running at http://yoursite.local and everything is working great on your computer. Now you want to test that awesome responsive design you've been working on with some other device(s), so you try to go to yoursite.local which won't work unless you want to modify the host file on the device(s), which is something you can't even do to an iPhone/iPad without jailbreaking it. Gah.
So, then you try to access the site with your device by just using your computer's IP address + the path to your docroot (for instance 10.0.1.10/mysite/trunk/htdocs/) - great idea and now the site at least sort of loads, but all the links to the CSS/JS and image files are broken...
In my own search to avoid jailbreaking I finally figured out how to enable normal-looking-pages access to devices following a bit of trial and error. The whole setup to enable this is done on the computer your site exists on - no need to fiddle with any of your other device(s) settings:
1. Edit the /etc/host file on your computer and add you computer's IP along with the relative path to your site (relative to Apache's docroot). For example:
2. Add a virtualhost to apache like so, using your computer's IP address as the server name and this time use the absolute path for the site:
3. Restart Apache and now you should be able to access your site with any other device on your network by simply using your computer's IP address as the url.