Testing With Charles Proxy Part 1

I find one of the hardest things about testing with a new tool, is actually getting started; familiarising myself with the new tool.

In the past, I’ve written about how to set up a proxy on Charles, so you can test other devices on your local dev machine

In this series of blog posts, the goal is to help someone get started testing with Charles Proxy.

The series will cover:

This blog post will cover:

What is a Proxy server?

“A proxy server is a server application that acts as an intermediary between a client requesting a resource and the server providing that resource.”

/rsz_proxy_concept_en.jpg

(By H2g2bob - Own work, CC0, https://commons.wikimedia.org/w/index.php?curid=16337577)

In the image above, Alice is the client requesting a resource (in this case “what the current time is”) and Bob is the server providing the resource.

The proxy is the red server in the middle.

Charles Proxy is such an example.

Another way of looking at proxies is to look at in terms of “in behalf of”.

Here’s an example:

At Toastmasters we have these annual meetings where we need to vote in a new board for a club including a president, treasurer etc.

You can vote in person.

Or, you can assign a proxy and that person would vote on your behalf.

That person would be the red server in the middle.

What is Charles Proxy and what can it do?

According to their site:

“Charles is a web proxy (HTTP Proxy / HTTP Monitor) that runs on your own computer. 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 for you all of the data that is sent and received.”

As per their site, here are the key features:

I will focus on the features in italics.

How to set Charles Proxy up for testing

A few things to note before we get started on set up:

  1. Download Charles here and drag the app to your Applications folder

  2. Open up Charles then Install the Charles Certificate by going to Help > SSL Proxying > Install Charles Root Certificate

/installcharlescertificate_small.png

  1. Next, go to Keychain access (you can do this from the Spotlight menu) and then on the All Items category, with “login” keychain, search for “Charles”.

  2. Once you have found the “Charles Proxy CA” certificate, you should see that it’s got a red X icon indicating it’s not trusted. Right click on this row and then select “Trust Charles Proxy”

  3. Now go back to Charles, we will now set a filter so we will only see traffic going to and from our test website (we want to ignore the “noise”). Search for “parabank, then switch to the sequence tab.

/rsz_parabankfilter.png

  1. We will now set the SSL Proxying settings so we can view the network traffic going to and from our test website in plain text.

  2. Go to Proxy > SSL Proxy Settings.

  3. In the SSL Proxying tab, click on the “Add” button. Type: parabank.parasoft.com in the Location field then click OK.

  4. Tick the Enable SSL Proxying checkbox

  5. Test that your set up was correct by registering an account here. You should be able to see the request in plain text when you are on the Sequence tab, tap on the POST request, then switch to the Contents tab.

The request is the registration information you just submtited in the UI, including your first name, address, city etc.

In the next post, we’ll focus on:

Testing with Charles Proxy Part 2

Let me know how setup went for you - you can reach me on Twitter: @NicolaLindgren