As I write this, I’ve been working on an iPhone application that is very reliant on Internet connectivity. One of the challenges I encountered early in the development of this application was debugging the HTTP requests I was making and the responses I was getting back from the server. One of the requirements is that all communication was performed over HTTPS which clouded my debugging even further.
Meet Chuck, or Charles as the more formal and official name goes. Chuck is my new best friend. Yup, we’re so close that I can call him Chuck. We’re tight.
Charles is a web proxy, HTTP Proxy, and HTTP Monitor that runs on your Mac. Your web browser (or any other Internet application) is then configured to access the Internet through Charles, and Charles is then able to record and display all of the data that is sent and received.
In Web and Internet development you are unable to see what is being sent and received between your web browser / client and the server. Without this visibility it is difficult and time-consuming to determine exactly where the fault is. Charles makes it easy to see what is happening, so you can quickly diagnose and fix problems.
This is great for running your application on the iPhone simulator on your Mac. You can download a free-trial, but trust me on this, you’ll be buying the full version for $50 and thanking me later.
I was curious to know how some of the competing applications worked. While I can build and run my application in the iPhone simulator and use Charles to debug it, I couldn’t help but long for that same insight into other competing applications that I had on my actual iPhone.
Was there some way to have Charles work with my physical iPhone instead of the simulator so I could monitor it’s HTTP traffic?
Oh, hells yes!
It’s actually very easy to configure. Here’s all that you need to make this happen:
- Your Mac with Charles installed and running
- Your iPhone with the applications you’d like to monitor
- Both your iPhone and Mac with Charles must both be on the same WiFi network
That’s it! Got that? Good, let’s configure it. First, we’ll configure Charles:
- From the Help menu, choose Install Charles CA SSL Certificate… This will allow you to debug and monitor HTTPS traffic.
- If you are debugging or monitoring an SSL connection (or HTTPS request), you will need to configure this in Charles. From the Proxy menu, choose Client SSL Certificates…
- Ensure that Enable SSL Proxying is selected. One of the great things about Charles is that you can use wildcards when choosing what SSL sites you would like to monitor. In the above screenshot, I am monitoring all HTTPS traffic on any .com domain.
- Run the Network Utility application and make note of your AirPort wireless IP address:
Now that your Mac is setup with Charles and the HTTP proxy, we need to configure your iPhone to use that Mac as it’s Web Proxy. But first, we need to install the Charles CA certificate on your iPhone.
- Open up Safari and navigate to (iOS 4) http://charlesproxy.com/charles.crt or (iOS 3) http://charlesproxy/iphoneconf. When you are prompted to install the Charles certificate, tap on the Install button.
- Open up your iPhone Settings application and tap on Wi-Fi settings. Tap on the blue disclosure indicator of your local Wi-Fi network
- Scroll down to the bottom of your Wi-Fi settings and tap on the Manual segment control in the HTTP Proxy settings.
- Enter in the IP address you wrote down from your Mac running Charles. In my case, when I ran Network Utility I had the AirPort IP address of 10.0.1.33. I put that IP address in my proxy settings as well as the default port Charles runs on, 8888:
- To verify your settings, open up Safari on your iPhone. As soon as you make an Internet request, Charles will prompt you on your Mac with a mesage box like the following. You want to click on the Allow button.
That’s it! Now fire up that application you’ve always wondered about.
About the author
I don’t even know how I ended up right here, but I believed this put up was good. I do not know who you are however definitely you’re going to a well-known blogger if you aren’t already 😉 Cheers!
I knew there had to be a way to do this, but I didn’t know how to get the Charles cert on my iTouch. Never occurred to me I could just go get it in Safari. :} Thanks for the very useful post.
This article and Charles helped me find a critical bug in a client´s server setup. Thanks a bunch!
I’d been banging my head against a wall trying to get my iOS device to be validated with Charles. I had been able to get the proxy setup over the network, but had no idea you needed to install the Charles cert on the iOS device. Thank you SO much, this has been incredibly helpful!
Super helpful. Thanks