It’s possible to get an iPhone, iPad, or Android device to access a local web server running on your development machine. All you need is an HTTP proxy such as Charles Proxy running on your development machine. Once that’s running:
Make sure your device is connected to the same network as your development machine. Go into the Settings -> Wi-Fi menu and find the HTTP proxy settings. On Android, this means a long-press on your Wi-Fi network (Modify Settings, then Show advanced settings). On iOS this means pressing the (i) icon next to your Wi-Fi network.
Switch your proxy over to ‘Manual’ and enter your development environment machine’s network IP address (eg. 192.168.0.4) as the server, and 8888 as the port (Charles’ default port unless you’ve changed it).
Voila. All your HTTP traffic from your device will now route through your host machine (Charles will prompt you to allow access first) and you’ll have access to your local development server. Awesome!
Pro Tip: Are you still editing your hosts file in order to manage the host name mapping for sites on your development environment? Stop it. Just use the Tools -> DNS Spoofing menu in Charles and make life easier for yourself.
Good tips! It’s worth noting that if you’re on Windows and want a free alternative to Charles there is Fiddler. The interface isn’t as pretty but it’s just as powerful (if not more so) and it’s much faster (i.e. it’s not Java like Charles).
Re: Android – it’s easy enough to get devices working through Fiddler or Charles. You can install the ‘HTTP Proxy Settings’ app (see here for details). As of Android 3.1 it doesn’t even require this app as the setting as built-in.
Thanks for the tutorial. Its working great for my ‘normal’ site but my other one requires SSL. How can I set this up? So I need to change the port number and do I need to configure the SSL proxy settings in Charles?
The proxy settings on your mobile device don’t need to be changed, but you need to enabled SSL proxying in Charles. Info here: http://www.charlesproxy.com/documentation/using-charles/ssl-certificates/