Charles profile
Charles is a cross-platform packet capture software developed based on Java. It can be used in Mac, Linux and Windows, and can capture HTTP and HTTPS requests from computers and mobile phones. It is a powerful tool for front-end development. Charles’ official website: www.charlesproxy.com, where you can download the latest version. Since the software is only free for 30 days, unless you pay for it. However, if you want to use it for free, you can use it for no more than 30 minutes at a time, and there is a 10-second delay.
HTTP caught
The configuration for HTTP packet capture is simpler.
Fetch HTTP request data on the MAC
1. Set Charles as the system agent
When the Charles software is opened, the system is set up with agents by default. For details, you can click the Proxy menu in Charles menu bar to find macOS Proxy. If it has been selected, there is no need to set it again, as shown in the picture below:
2. Enable HTTP fetching
From the Proxy menu bar, click Proxy Settings to open the dialog box that allows you to set the port number (default is 8888) and select the Enable transparent Http Proxying option, as shown below:
Just set these two, you can grab the data on the computer side. Now you can open up a web page, send a request, and see how Charles crawls.
Fetch HTTP request data from mobile phones
1. Obtain the IP address of the PC
First you need to know the IP address of your computer. I use a MAC, so in MAC’s case, there are two ways to do this: Go to System Preferences -> Network. Inside you can see the CURRENT IP address of the computer
Or open terminal, use the command line, type ifconfig, find the current COMPUTER IP address
2. Set the MOBILE HTTP proxy
First, make sure your phone and computer are on the same wireless network. Click “Settings -> WIRELESS LAN” and click the connected wifi to enter the connection details page. Click the HTTP proxy at the bottom, select Manual, enter the IP address of the computer you just found in the server bar, and enter 8888 (set above) in the port bar, as shown below:
After sending the request, a window will pop up on the computer, as follows:
At this point, the HTTP packet capture is complete. However, if you visit the URL that starts with HTTPS, Charles cannot identify it, and a lot of unknown flags will appear. In this case, you need to configure HTTPS.
HTTPS caught
HTTPS packet capture is based on HTTP configuration.
1. Click Help -> SSL Proxying -> Install Charles Root Certificate on a Mobile Device to open the keystring access window.
2. Charles sets Proxy
Choose Proxy -> SSL Proxying Settings from the menu bar
In the window that pops up, check Enable SSL Proxying,
Click Add, enter * in hosts (grab HTTPS requests from all sources), and port 443 (HTTPS default port).
This completes the configuration on the PC side. To capture the HTTPS requests on the mobile side, you need to install a certificate on the mobile side as well.
3. Install the SSL certificate on the mobile device
Click on the menu bar Help -> SSL Proxying -> Install Charles Root Certificate on a Mobile Device as follows:
All Settings are now complete. Then you can get the interface data, do your own simulation analysis and so on.
There is a point need to pay attention to, do not capture the packet when you must close the HTTP proxy set up by the mobile phone, otherwise disconnect the connection with the computer after the hand can not get on the network, everyone must pay attention to!!