iPhone HTTP Connection Debugging

Nearly all iPhone applications take advantage of the device’s amazing internet connectivity. Whether its checking the balance of your bank account or using an interactive web application in Safari, there is a tangible level of connectedness. Wouldn’t it be great if you could watch, log, and edit the HTTP requests live as they happen from the comfort of your desktop? Not only is it possible, it is easier than you might think and doesn’t require jailbreaking your device! This article shows you how in just a few easy steps.

<soapbox>

May I take this opportunity to offer my highest recommendation for a wonderful piece of software called the Charles debugging proxy. The software allows you to view and edit HTTP requests that filter through its proxy server. It is secure, easy to install and configure, and runs on both Windows and OS X. Charles has become an essential tool in my web developer bag of tricks and I use it everyday.

You can download a free trial, but you won’t regret purchasing a license for only US $50.

http://www.charlesproxy.com

</soapbox>

This tutorial will focus on connecting iPhone applications with the Charles debugger

Prerequisites

  • A wireless LAN subnet to which your iPhone has access and is connected
  • A laptop or desktop machine on the same LAN subnet as your iPhone
  • Charles debugging proxy installed

There are two main areas of setup, the Charles proxy host, and the iPhone device.

Part 1 – Charles Proxy Host Setup

  1. Run Charles and verify that you have sufficiently enabled access through your system’s local firewall. Often this simply involves disabling the software firewall on your operating system. Charles needs to be listening on your LAN IP address and its default port is 8888. See your Operating System’s documentation for this specific procedure.
  2. Note your system’s IP address. In my case it is 10.45.200.127

Part 2 – iPhone Setup

  1. Download the charles SSL intermediate certificate

    http://www.charlesproxy.com/charles_ca_certificate.zip

  2. Extract the charles.cer file from the zip archive.

    At this point you have two ways you can install the charles.cer file on your device. You can either email it to yourself and open the attachment from the device. Or, you can post the file on a web server and request the certificate in Safari on the device. Either method will raise an Install prompt that looks like the one below:

    Charles Certificate Install

  3. Configure your iPhone to use a proxy server

    This step involves going to the Settings application and into the Wi-Fi section. There you will hopefully see an option for the Wireless AP name you are connected to.

    Go to: Settings -> Wi-Fi -> “Your Wireless AP Name”

    Once there, scroll to the bottom of the window and you should see settings options to configure a proxy host as below:

    Proxy Config

    Enter your Charles proxy host address and port in the inputs provided

    NOTE: Once you are done using the Proxy, you will have to set your HTTP Proxy setting to “Off” for your phone to return to normal function.

  4. Test the configuration

    Open Safari and visit a website. You should see a prompt on your Charles machine to authorize the connection (this keeps unauthorized users from using your Proxy server):

    Charles Authorization

    Once the connection has been authorized, voilá! You should now see your phone’s HTTP requests live in Charles. For even more detail, you can click on the “Sequence” view.

Several useful things you can do with Charles at this point:

  1. Save file requests to disk by right clicking and choosing “Save Response…”
  2. Edit and resend HTTP requests by clicking the “Edit” icon on the toolbar with a request selected
  3. Debug SSL connections
  4. Throttle and simulate 3G network speeds in order to view how your app may respond. See “Throttle Settings” under the Proxy menu option.

Charles Preview

Take a look at the Charles Documentation for other tips and tricks:

http://www.charlesproxy.com/documentation/using-charles/

Enjoy, and happy hacking!!

By: garyr Categories: debugging / iPhone

15 Responses to iPhone HTTP Connection Debugging

  1. Pingback: uberVU - social comments

  2. rashed says:

    thanks

  3. Sagi says:

    Very useful article. Any day this tool is worth $50.

  4. Samuh says:

    Can’t download the certificate archive: am getting “Requested Page not found” error.
    Is the following resource same: http://www.charlesproxy.com/ssl.zip ?

  5. ssfdesign says:

    can this be done on a droid x?

  6. Jakub says:

    This is great post . Unfortunately Images do not work anymore and seem like they contain some important info….

  7. Pingback: Toolkit for web developers. « Juan Anzaldo

  8. Brian says:

    I have a similar question as above.Can I use this to debug in Android?

  9. Pingback: Listening to your HTTP request | inspIRe

  10. Arindam says:

    Awesome post. But my problem is that I am connected to a proxied internet connection on my mac(or PC) on which the charles proxy is running. Say my computer is going through http://proxyserver.com:3128.
    Now when I connect my iphone to the wireless adoc network , I have to provide the proxy address of the proxy server (http://proxyserver.com:3128.) and not my computer’s IP and Charles proxy(8888). With this configuration the internet on my iphone runs fine, however I cannot capture any data from the iphone on charles. I am able to see the data on my local machine only in charles.

    Any help will be appreciated.

    Thanks,
    Arindam

  11. garyr says:

    I think what you’ll want to do is set an “external proxy” in Charles (see the “Proxy” menu). This will allow Charles to act as a local proxy and forward your machine and iPhone connections to your external proxy you mentioned in your post. Hope that works!

  12. Great post!

    Thanx….

  13. Pingback: CuriousFind » Blog Archive » Using Charles Proxy to Inspect Mobile Device Traffic

  14. Deep says:

    Great post… Could you please help me how to use for IOS Simulator???

  15. Pingback: 3 essential debugging tools for mobile applications | marcelkalveram.com

Leave a Reply