Learn to Install, Configure and Use Charles Proxy – a Web Debugging Tool to Monitor the Network Traffic on Windows, Android and IOS Devices:
What Is Charles Proxy?
Charles Proxy is a web debugging tool that monitors the network calls and decrypts the web traffic.
It helps in understanding the content in your network call. E.g. Requests sent to the server and data fetched from the server etc. This network debugging tool can read the web traffic of Windows, Android and IOS devices.
What You Will Learn:
- Configuration Of Charles Proxy On Windows / Mac OS
- Configuration Of Charles Proxy On Android
- Charles Proxy Pricing – Subscription Model
- Frequently Asked Questions
Configuration Of Charles Proxy On Windows / Mac OS
Charles Proxy sits between you & the server and monitors all network calls. For example, if you are searching for something on Google, then your machine should make a call to the Google server with the search query.
Charles acts as a mediator between you and Google and helps to monitor the server logs. These logs are very helpful when an application that needs a server is developed and tested.
How To Install Charles Proxy?
Open your browser and visit the download URL. You can find several download links for different OS versions i.e. Windows, Mac, and Linux OS versions.
The screen would look as shown below.
Click on the relevant link based on your OS. Download starts soon as you click on the link. Wait till the file downloads completely.
Go to your system’s Downloads folder where you will find an installer file with the name Charles-proxy-4.5.4-win64.msi (version number may vary). Click on the file and a setup wizard will appear here.
Accept the license agreement and click on the Next button.
Click on the Finish button. Open the Charles application by clicking the shortcut icon.
The initial screen should look as shown below. The Windows proxy option will be enabled by default. You can check this by clicking on the proxy menu item at the top.
By default, the structure view will be enabled. You can see the logs getting recorded automatically.
Install Charles Root Certificate
#1) Click on the Help menu, and you can see the option “Install Charles Root Certificate” in the drop-down.
#2) Select the location Charles certificate to be installed i.e. current user/local machine.
#3) If you select the local machine, then you need to set the folder location by clicking on the browse button and select “Trusted Root Certification Authorities”.
#4) Click OK and continue with the installation process.
#5) In the end, you should see a popup saying that the certificate installation is successful.
Enabling SSL Proxying
Now you can use Charles for SSL proxying i.e. you can read a particular request made by your machine to your server.
- For instance, open Google and type Wikipedia and search for it.
- Open Charles proxy tool and shift to structure mode. You can see the display option (Sequence/Structure) at the top of the tool and click on the Structure mode.
- In the filter editor provided, type wiki to search requests made particularly with this text.
- Right Click on Google request end click on enable SSL proxying. Without enabling SSL proxying you will not be able to see the logs.
In this way, you can enable SSL proxying for a particular URL. If you want to monitor all the network calls, then you to need to configure a bit in the SSL proxying menu.
Follow the below steps to configure the SSL PRoxy Settings.
#1) Click on the Proxy menu item and click on SSL Proxy Settings.
There you can see that Google.com is already added in the list that was added in the previous step.
#2) Click on the Add button, and in the Edit location option add * in Host field and 443 in the Port field. Here * means anything, that the proxy tool will decrypt every URL.
Now, you are ready to read all the data from all the requests and responses.
Let’s explore the other features and components in the Charles proxy tool.
Right-click on any URL and you will see a list of available options. Most of them are straight forward and the name reflects the functionality
Features Of Charles Proxy
If you observe at the top of the proxy tool, you can see a ribbon with different buttons that have different functionalities.
Let’s dive deep into a brief description of each button.
#1) Clear Button: Upon clicking this button, the session will be cleared and after that, you can start a new session.
#2) Stop/Start Button: After launching the tool, by default, this button will be in ON mode. You can click on this button if you want to stop the log recordings.
#3) SSL Proxying: If you enable SSL proxying in settings as discussed in earlier sections, then this button will be turned on and you can stop SSL proxying at any time. Thereafter you can only see the traffic with limited data as SSL proxying is disabled.
#4) Network Throttling: Network throttling is to simulate different network bandwidth conditions like 2G, 3G, 4G, and WIFI. It can also be used to simulate customized modem network speeds.
It is useful when you have to test any application that has network dependencies or it will be useful to test how your application is behaving in different network conditions. You can customize the speed and other network conditions using keyboard shortcut Control+Shift+T or by clicking the Proxy menu => Throttle settings.
#5) Breakpoints: This feature does not help much unless you are developing an app. If you mark any request as a breakpoint, then the next time when Charles comes across this request, it waits for the user input asking the user to continue to the next point or to abort. This is similar to debugging code in Eclipse or Android Studio.
#6) Compose: Compose helps you to edit any request and send the edited request. You can edit/add any parameters and can execute to get the results for changed requests.
#7) Repeat Button: This button is to repeat a specific request. Once you click on this button, the request in the editor will be sent again. This feature comes handy when you want to recreate a request without performing the action again.
#8) Validate: Validate functionality is to validate the selected requests or responses. If you click on it, a new tab will be opened in the editor and you can see the validation results there.
#9) License Purchase: This button is used to purchase the license once the trial period is completed. For more details about purchasing a license, please visit the Subscription model section of this tutorial.
#10) Tools: This section contains different tools that help in debugging the traffic.
#11) Settings: The settings menu contains Access control settings, Proxy settings, Recording settings, Preferences, etc.
Saving And Sharing A Session
Consider a case where you are testing/debugging network calls related to an application and you need to share the logs with another tester/developer. You need to save or export the current session.
To save, just click Control+S keyboard shortcut or navigate to the File where you will find the Save option. Click on it and give an understandable name with .chls as an extension, E.g. TestLogs.chls and hit the save button.
You can also Export the logs in the Files section and can save it in .chls format. After this, you share the .chls file to others. If you already have a log file in .chls format, then you can import that file in the tool and can analyze the network traffic.
Removing Charles Certificate
While configuring the Charles proxy tool we installed Charles root certificate in the PC. Let’s see how to remove it when you don’t use it anymore.
#1) Search your PC for Certificate Manager. On Windows, it can be found with the name certmgr.msc
#2) Once the certificate manager opens, click on Trusted Root Certification Authorities and then select the Certificates folder. After that, a list of certificates will be shown. Refer to the below screenshots for more clarifications.
#3) Right-click on Charles proxy certificate in the list shown and click on the Delete button.
#4) Click Yes on the confirmation dialog prompt. Now we have removed the Charles root certificate. Whenever you want to use Charles again, then you need to install a certificate.
Configuration Of Charles Proxy On Android
Charles Proxy tool supports Android devices as well. You can monitor the network traffic of your Android device, from your PC. This needs some configuration in the WIFI settings of the Android device.
Your PC that has Charles installed and the Android device in which you want to check the logs should be connected to the same WIFI network.
If you have an idea about the configuration of a MITM proxy, then it will be easy for you to configure this setup. The process of installing certificates is almost similar in both tools.
Steps To Configure Proxy On Android Device
#1) Open notification panel on mobile.
#2) Long click on the WIFI icon, then you will see advanced WIFI settings.
#3) On your PC, open command prompt or terminal and enter command ipconfig.
#4) There you can see your system IP address. Refer to the below screenshot. The one that is marked in yellow color is your IP address.
#5) You can also get to know your IP address in the Charles proxy tool as well. Click on Help => Local IP address, and there you will be able to see a popup with the IP address details.
#6) Open WIFI settings in the mobile and long press on the connected WIFI network.
#7) Click on modify network config.
#8) Click on Show advanced options check box.
#9) Select the Proxy as Manual.
#10) Enter the Proxy hostname with the system IP address and Proxy port as 8888. Click on Save.
#11) As soon as you save the Network settings in your mobile, the Charles proxy tool will display an alert dialog box asking if you want to allow connection from the mobile. Click on the Allow button to continue.
Install Charles Root Certificate On Android Mobile
We need to install Charles root certificate in android as we did on PC.
Follow the below steps to install the root certificate:
- The android device needs a screen lock i.e. pin/pattern or any lock screen. So before proceeding to the further steps make sure that you have set a screen lock.
- Open Chrome browser in mobile and enter this URL
- It prompts to enter a lock screen password. Enter the password.
- The certificate will be downloaded automatically.
- Give a proper name when prompted and then save.
- Setup is completed now and can monitor the traffic of your mobile in the Charles proxy tool.
- If you want to log the traffic only from mobile, then you can disable window proxying from the proxy tool.
Removing Charles Certificate On Android
Enlisted below are the steps involved in Removing Charles Certificate in Android.
- You can remove the Charles root certificate from Android when you do not use the Charles proxy tool.
- Go to Android device settings and search for Security, there you can find Trusted Credentials.
- Find the certificate file with the name given at the time of Certificate installation and delete it.
Charles Proxy Pricing – Subscription Model
Charles proxy tool comes with a freemium model. You can avail of free access to this tool for the first 30 days after installation. After 30 days you need to purchase a license to continue. License pricing ranges from $30 to $700 based on your requirements. For a single license, it costs $30.
In the free access duration, there are some limitations to the below-mentioned points.
#1) There will be some delay after you start the application and it will be visible while opening the tool.
#2) The application stops after 30 min usage. You need to restart the tool to continue.
Frequently Asked Questions
Q #1) Can I configure Charles on my iPhone?
Answer: Yes, you can configure on the iPhone. Please click here to get more details.
Q #2) Which OS versions does Charles support?
Answer: Charles tool can be installed on MAC & Windows PCs and the tool can read the network of Windows/Android/iPhone devices.
Q #3) Is Charles a free tool?
Answer: For the first 30 days after installation, this tool provides a free trial version and after that, you need to purchase a license to continue.
Q #4) Is there any alternative for Charles?
Answer: Yes, MITM (man in the middle) does the same work as Charles. But MITM has very fewer features and is not a friendly user interface.
Q #5) Does Charles support a Web interface?
Answer: Yes, Charles supports the Web interface. You can configure it by creating a credential set (username and password) or can configure it by using an anonymous option. You can find this option in Settings => Web interface settings.
Q #6) Where can I find the official documentation page?
Answer: Click here to visit the official documentation page.
Q #7) How to disable Charles proxy?
Answer: If you want to stop recording, you can click on the Stop record button and you also can close the application. No network call will be logged in the tool. If you uninstall the application, you can remove it from the location where it is installed.
Q #8) What are the Advantages of the Charles Proxy tool?
- User-friendly UI.
- Supports multiple OS versions.
- Network throttling Features.
- Exporting and importing a session.
- Easy to use.
This tutorial explained all about installing and configuring Charles proxy tool. If you have an idea about APIs, Network traffic and Server related knowledge, then it is quite easy to use this tool. Most of the features of this tool are self-explanatory.
- Charles proxy tool is web traffic debugging proxy.
- It helps in debugging/analyzing/testing of web and mobile application traffic logs.
- It has easily understandable UI elements.
- While configuring, the root certificate installation plays an important role.
- Once your work with the tool is completed, it is better to remove the certificate from the PC/mobile.
Hope you enjoyed learning about the Charles Proxy tool.