Packet capture tool Charles (2) - mobile APP capture (set up mobile phone proxy, install certificate)

• After installing Charles, you can only capture the interface requests of the computer
• Apps that want to capture mobile devices also need to set up a proxy and install a certificate.

1. The principle of packet capture

• original request
  • The client directly exchanges data with the server.
• Interface request after proxy
  1. After setting Charles as a proxy server on the device, Charles starts listening for any requests from clients or devices.
  2. Charles captures the request and forwards it to the server
  3. The server returns a response to Charles
  4. The response is returned to the client.
     

2. Mobile phone settings network proxy

First of all, it is very important that the mobile phone and the computer need to be on the same network.

1. View the IP address of the computer (local IP address)

• macOS : You can select the currently connected network in the "System Preferences > Network" setting, and the local IP address will be displayed on the right.
  
• Windows : Click the network icon in the status bar, you can see "Network and Internet Settings" , click to view the properties of WLAN or Ethernet. Enter the network settings page and slide to the end to see the local IP address.
  
  

2. Set up mobile phone network proxy

• Open the network settings of the device to capture packets, select the currently connected network, and configure the HTTP proxy.

(1) iOS devices

1. Open the network settings -> select the button on the right side of the currently connected network ->
2. Enter the network settings page, slide the bottom of the page, click configure proxy ->
3. The proxy is changed to manual, fill in the IP address of the computer and the port of the Charles proxy (mostly 8888) -> save the settings
   

(2) Android devices

(Taking the Honor mobile phone as an example, most Android phones have the same settings)

1. Open "WLAN" settings from the settings page ->
2. Long press the current connected network -> select "Modify Network" ->
3. Check "Show advanced options", change the proxy to "Manual", fill in the IP address of the computer and the port of the Charles proxy (mostly 8888) -> save the settings
   

(3) Charles allows devices to connect to agents

• After the phone proxy settings are complete, Charles starts capturing requests from the phone
• At this point Charles will pop up a pop-up box allowing the connection
• Just select "Allow"
  
• After allowing, start capturing packets
  

3. Mobile phone installation certificate

• After setting the proxy, only the HTTP interface can still be crawled, and the HTTPS interface will be displayed as "unknown", and the error reason also indicates that the required certificate is not trusted or installed.
  
• Therefore, if you want to grab the HTTPS interface, you need to install a certificate.

(1) Make sure the phone is connected to the agent

(2) Open the webpage on the mobile phone: "chls.pro/ssl", click to download the certificate

(3) Installation certificate

1. Android

(Taking the Honor mobile phone as an example, most Android phones have the same settings)

1. From the settings page, go to WLAN settings
2. Click "More WLAN Settings" to enter the settings page
3. Click "Install Certificate"
4. Select the certificate just downloaded from the browser, set the certificate name, and click OK
   

• The certificate is now installed

2.iOS

(Take iOS 15.5 system as an example)

1. On the Settings page, select "General"
2. Scroll to the bottom of the page and select "VPN and Device Management"
3. In the "Downloaded description file", you can see the certificate you just downloaded, click on the certificate
4. Select "Install", then you will need to enter the device password, and then confirm the installation
   

(4) [iOS only] trust certificate

• iOS has one more step to trust the certificate than Android:

  1. On the Settings page, select "General", and on the General page, select "About Phone"
  2. Scroll to the bottom of the About Phone page and select "Certificate Trust Settings"
  3. On the "Certificate Trust Settings" page, you can see the newly installed certificate, just turn on the certificate switch
     

• At this point, the preparation for mobile phone capture is completed.

Appendix: Interface Functional Testing Series Tutorial Contents

Packet capture tool Charles (1) - download, install and set up
packet capture tool Charles (2) - mobile APP packet capture (set up mobile phone proxy, install certificate)
packet capture tool Charles (3) - tutorial interface introduction, basic functions ( Weak network, editing, retransmission)
Packet capture tool Charles (4) - Introduction to common functions (save, import and export, filter, sort)
Packet capture tool Charles (5) - Use local mapping to modify interface response content (Map local)
Packet capture Tool Charles (6) - use remote mapping to redirect interface requests (Map remote)

General Catalog-Zero-Basic Getting Started Interface Functional Testing Tutorial
———————————————————————————————————————————————————
Charles installation package has been uploaded to I run a blog with the same name as the public account [Software Testing Essential Skills].
The public will also upload test-related materials from time to time, and they can go to collect them if necessary.

If necessary, click on the QR code at the bottom of the article to get it~