Charles Proxy on iOS

Problem: You have an app that interacts with the cloud and you would like to know (or figure out) what type of communications occur between the client and the backend.
Entering Charles Proxy a wonderful app (free trial then buy) that allows you to monitor communications from your desktop while a native (or Safari) app is interacting outside of its container.
It should be straightforward on how to setup the whole thing but eventually, it is not, therefore, this post is for myself in the case in future I will forget how to do it or for your next you that struggles to put two and two together.

Here is how it works

  1. Install Charles on your desktop
  2. Trust Charle’s CA root certificate
  3. From your iOS device visit a special URL that downloads a dynamically generated (trusted) root certificate
  4. Trust that certificate into your iOS settings
  5. Set up your iOS device to point to your local proxy (Charles on desktop_
  6. Launch Charles on the desktop
  7. Your communications are now captured and sent to Charles’s app
Once it is all done, for future capture you only need to set the proxy on the phone for the current connection. Unless, of course, you have a new phone or reset the previous image of the phone.

It is basically what is called the man in the middle technique. That is necessary otherwise you would not be able to read in plain text encrypted communications, which most (decent) apps employ when communicating with their backends. This system can be wrongly used but in this case, you know what you are doing and for what reason and you are doing it on your devices, right!?! ^_^
In order to view SSL communications as plain text, instead of your browser seeing the server’s certificate, Charles dynamically generates a certificate for the server and signs it with its own root certificate (the Charles CA Certificate). Charles receives the server’s certificate, while your browser receives Charles’s certificate.
So you need to install Charles as CA to set it as trusted. The way to install it varies between browsers and operating systems, below I am explaining it for Mac and iOS workflow. I don’t think it will change much for other platforms though.

STEP 1

  1. Install Charles from here.
  2. Launch it and head to the menu Proxy
  3. Select SSL Proxying Settings
  4. Click add
  5. Once there, instruct the system that you want to capture everything (vs filtering just some specific content). You can use a wildcard character

image

image

STEP 2

Through the menu Help of Charles
  1. Install Charles Root Certificate
  2. Trust it (via Keychain app) the certificate. That means to open the Keychain app, search for Charles, double click on the certificate and change the trust level

image


image


At this point your desktop configuration is completed.
Let’s move on to your client (iOS) side, here is the recipe for that.
  1. Open Safari and visit this url: chls.pro/ssl
  2. Setup a proxy on iOS so that it points to your machine. 
  3. Trust the certificate in the certificate store
Let's do it.

STEP 1


image


  1. Go to the iOS wifi settings and select configure proxy for your current active wifi.
  2. Select manual and enter the IP address of your mac and port (8888) for the proxy.



STEP 2

Download the certificate that Charles will generate for you once the request is made. Make sure that Charles is running on your desktop.

STEP 3

Starting from iOS 10.3 SSL trust for the certificate has to be turned on intentionally by the user for the manually installed certificate profiles in iOS so go to :
  • Settings > 
  • General > 
  • About > 
  • Certificate Trust Settings. 

Under Enable, full trust for root certificates turn on trust for the certificate

Congratulations you can now enjoy spying your own stuff.
You can do the same with the iOS simulator and this well made youtube video tells you all the stories about that.

Comments

Popular posts from this blog

Postgres on Synology

The Making of Basculo

Build an independent watch app - Part II