Charles profile

Charles is an HTTP proxy server,HTTP monitor, reverse proxy server, Charles can monitor all data sent and received by the browser when the browser connects to Charles’s proxy to access the Internet. It allows a developer to view all HTTP traffic connected to the Internet, including Request, Response, and HTTP headers (including cookies and caching information).

Charles main functions

  • SSL proxy is supported. Requests for analyzing SSL can be intercepted.
  • Supports flow control. Can simulate slow networks and long latency requests.
  • AJAX debugging is supported. Json or XML data can be automatically formatted for easy viewing.
  • Supports AMF debugging. You can format Flash Remoting or Flex Remoting information for easy viewing.
  • Supports resending network requests, facilitating back-end debugging.
  • Network request parameters can be modified.
  • Support network request interception and dynamic modification.
  • Check HTML, CSS, and RSS content for COMPLIANCE with W3C standards.

Start caught

Before we start to capture bags, let’s introduce what Charles is mainly involved in this article.

  • Introduction and installation of Charles
  • Web caught
  • App caught
  • Capture the MOBILE phone HTTPS protocol
  • Charles filter
  • Weak network test
  • Interrupt points tamper with data
  • Repeat request
  • Compose editing interface
  • Server stress testing
  • The local map
  • Remote mapping
  • More updates will follow

Introduction and installation of Charles

In the mobile Internet era, as a test engineer, development engineer. It is absolutely necessary to master the necessary testing tools. Today I will focus on Charles.

Official Address:

www.charlesproxy.com/

The installation

Since the installation process is relatively simple, there are no more stickers here. Let’s take a look at Charles’s lushan face.

Web caught

1. Web packet capture

Charles Web packet capture is very simple, starting Charles will automatically set with the browser as a proxy, no need to do too much Settings, then I will send a network request through the browser, Charles will directly capture the information and response information

2. HTTPS is captured on the Web

Although Charles can capture packets directly now, we cannot capture HTTPS packets, so we need to install SSL certificates

1. Select SSL Proxying from the top menu bar and install Charles Root Certificate. Because of the problem of the shortcut key of the notebook screenshot, the capture was not sent. The certificate installation is captured here, and the certificate installation is the next step

App caught

Charles packet capture can capture not only HTTP requests from the PC, but also HTTP requests from the App. However, mobile phone packet capture needs to be configured on the PC, and both mobile phone and computer need to be on the same network

PC configuration:

1. Start the installed Charles package capture tool; 2, click [Help] –> [local IP Address] to obtain the IP Address, or directly through the computer’s own CMD command to obtain the COMPUTER IP [ipconfig], according to their own habit here is the IP of my VIRTUAL machine;

Mobile terminal Settings:

1. Open the setting page of the mobile phone; 2. Select [Wireless LAN]. 3. For IOS, click the exclamation mark behind the connected WIFI, while for Android, long press the connected WIFI; (Note: IOS is used as an example.) 4, click “Configure Proxy” –> “Manual”; 5. Input the local [IP address (192.168.1.75)] and port number [9999], which belong to my local computer and can be reasonably configured according to your own situation; 6. Click “Store”

Capture the MOBILE phone HTTPS protocol

According to the above Settings, although Http requests from our mobile phones can be captured, HTTPS packets cannot be captured, requiring the installation and configuration of certificates. Now most mobile phones have been switched to HTTPS and few Http packets are captured

Charles configuration:

1, click on the top menu bar [Help] –> select SSL Proxying and click on [Install Charles Root Certificate] to install Charles Root Certificate. 2. Click “Install Charles Root Certificate On a Mobile Device or Remote Browser” to Install the Certificate On the Mobile Device or Remote Browser. (Same as above)

Charles filter

In general, we need to filter network requests and only monitor requests sent to a specified directory server. For this need, there are several approaches:

Method 1: In the Filter text box in the middle of the main window, enter the keywords to be filtered out. For example, if the address of the server is ceshi.com, enter ceshi in the Filter field.

Method 2: In Charles menu bar, choose “Proxy” -> “Recording Settings”, then select the Include bar, select add a project, and then fill in the protocol to be monitored, host address, port number. This allows you to intercept only packets from the target site. As shown below:

Weak network test

Charles configure weak network Settings 1, click [Proxy] –> [Throttle Setting] 2, check [Enable Throttle], you can also check [only for selected host] to set a specified annotation access to restrict network. Does not affect other software; 3. Throttle preset selects a common preset network condition, and you can set network upload and download rates on Bandwidth

Interrupt points tamper with data

In our test scenario, it may be necessary to modify request parameters or return parameters for testing, such as the interface for payment, but the interface parameters related to user login permissions will not be cited here.

Modifying request data

2. Set Breakpoints, click the menu bar [Proxy] and select “Breakoint Setting…” This is going to pop up the breakpoint setting popover; 3. In the breakpoint popup window, double-click the interface you want to break the point to edit the breakpoint; 4, edit breakpoint, if modify Request data, check jiujiang Request, if modify Response data, check Response, of course you can also check both; 5. Make a request again on the mobile phone, Charles will automatically intercept and jump to the request data modification page;

Repeat request

In our test work, you might send a bug first, development will let you in action again, he wants to look at the journal I choose which positioning analysis, at that time, on the client side to operate it again will trouble, this is directly sent by Charles again repeated request, and send the request again can also help us to do functional testing; Select the session for which you want to resend the request and click the Reset button in the toolbar.

Compose editing interface

In our testing efforts, different parameters may need to be sent for the request. Select the request that you want to modify, right-click “Compose” and select “Compose”.

Server stress testing

Charles also has an interesting feature that allows you to simply stress test your server. 1. Right-click on the stress test request session and select [Repeat Advanced]

The local map

Mapping means redirecting a request to another request. Local mapping means mapping the specified interface by modifying the existing data so that the interface data can use the data set locally for debugging. Here’s an example of how to map a network request to a local file using Charles. Right-click on the request session and select Save Reponse… Save the returned information locally

Remote mapping

Remote mapping means to map your local request address to another Remote address, which is equivalent to modifying your request address. For example, click [Tools] on the menu bar and select [Remote] to set Remote mapping.

If this article is helpful to you, please share it with your friends. Your encouragement is the biggest motivation for me.

Related blog

CSDN blog: How to use the Charles capture tool

This blog is a step-by-step guide to using the Charles Capture tool