一、背景描述

1.1、本文需求：移動(dòng)端進(jìn)行抓包調(diào)試

1.2、理解Charles可以做什么

Charles是一款跨平臺(tái)的網(wǎng)絡(luò)代理軟件，可以用于捕獲和分析網(wǎng)絡(luò)流量，對(duì)HTTP、HTTPS、HTTP/2等協(xié)議進(jìn)行調(diào)試和監(jiān)控。使用Charles可以幫助開(kāi)發(fā)人員進(jìn)行Web開(kāi)發(fā)、調(diào)試和測(cè)試，同時(shí)也可以用于網(wǎng)絡(luò)安全和隱私保護(hù)等方面。

1、捕獲和分析網(wǎng)絡(luò)流量，包括HTTP、HTTPS、WebSocket等數(shù)據(jù)流。
2、模擬網(wǎng)絡(luò)環(huán)境，如降低帶寬、網(wǎng)絡(luò)延遲等。
3、修改請(qǐng)求和響應(yīng)數(shù)據(jù)，包括添加、修改、刪除請(qǐng)求頭、響應(yīng)頭和正文數(shù)據(jù)等。
4、編輯和重放網(wǎng)絡(luò)流量，用于測(cè)試和驗(yàn)證Web應(yīng)用程序的可靠性和安全性。
5、過(guò)濾和搜索網(wǎng)絡(luò)流量，方便用戶快速定位相關(guān)數(shù)據(jù)。
6、支持遠(yuǎn)程代理，可以將Charles設(shè)置為代理服務(wù)器，通過(guò)遠(yuǎn)程連接實(shí)時(shí)監(jiān)控和分析網(wǎng)絡(luò)流量。

二、?windows客戶端Charles配置

Charles下載地址

2.1、系統(tǒng)介紹

Windows 10 家庭中文版

版本號(hào)?22H2

2.2、Proxy 配置

Proxy --> Proxy Settings

Port 8888 ， 勾選?Enable transparent HTTP proxying ， 點(diǎn)擊OK

2.3、Charles PC 端 SSL （https）配置

2.3.1、Help?--> SSL Proxying -->?Install Charles Root Certificate

2.3.2、安裝證書(shū)

2.3.3、本地計(jì)算機(jī) --> 下一步

2.3.4、將所有的證書(shū)都放入下列存儲(chǔ)（P）--> 瀏覽 --> 受信任的跟證書(shū)頒發(fā)機(jī)構(gòu) --> 確定

2.3.5、下一步

2.3.6、完成

2.3.7、代理設(shè)置

2.3.8、port

三、iOS手機(jī)端配置

3.1、系統(tǒng)介紹 iOS手機(jī)系統(tǒng) 17.0.3

3.2、網(wǎng)絡(luò)配置

3.2.1、無(wú)線局域網(wǎng)

3.2.2、手機(jī)須與PC連接同一無(wú)線網(wǎng)，點(diǎn)擊 “嘆號(hào)”

3.2.3、點(diǎn)擊代理配置

?

3.2.4、選擇手動(dòng)，服務(wù)器 輸入 pc的 ip 地址，端口 8888

服務(wù)器ip地址可以在Charles --> Help -->?Local IP Address 找到

3.2.5、手機(jī)連接成功后，pc出現(xiàn)彈窗，點(diǎn)擊 allow （允許）

3.3、iOS手機(jī)安裝證書(shū)

3.3.1、打開(kāi)safari瀏覽器，地址欄輸入chls.pro/ssl ，點(diǎn)擊允許

3.3.2、iOS手機(jī)設(shè)置 --> 通用 --> VPN與設(shè)備管理

3.3.3、安裝

?

3.3.4、點(diǎn)完成?

四、iOS手機(jī)端測(cè)試

4.1、safari瀏覽器打開(kāi)baidu.com

4.2、Charles查看請(qǐng)求

4.3、測(cè)試成功，Charles可以給手機(jī)瀏覽器抓包了。

網(wǎng)頁(yè)、APP、微信小程序...均測(cè)試成功。

五、手機(jī)訪問(wèn)電腦端本地服務(wù)的項(xiàng)目

5.1、Tools --> Map Remote

5.2、勾選 Enable Map Remote ， 點(diǎn)擊 Add

?

5.3、from 是 訪問(wèn)地址，to 是 目標(biāo)地址（pc端本地服務(wù)的項(xiàng)目）

5.4、手機(jī)瀏覽器 訪問(wèn) mt.ht.com 即 訪問(wèn) pc 端 localhost:3000

訪問(wèn)成功

六、過(guò)程記錄

6.1、Charles為什么需要添加證書(shū)

Charles添加證書(shū)是為了進(jìn)行HTTPS請(qǐng)求的監(jiān)控。
Charles作為一個(gè)中間人的角色，當(dāng)客戶端發(fā)起HTTPS請(qǐng)求時(shí)，返回的證書(shū)是Charles的，然后Charles會(huì)拿著客戶端的請(qǐng)求信息去和真正的服務(wù)端交互。這樣可以讓客戶端看到請(qǐng)求的信息和返回的結(jié)果。

七、歡迎交流指正。