本文介紹 charles 教程 - 代理抓包的使用方法

本文參考了：阿西河Charles教程

Charles是一個(gè)HTTP代理/ HTTP監(jiān)視器/反向代理，使開發(fā)人員能夠查看其機(jī)器和Internet之間的所有HTTP和SSL / HTTPS流量。這包括請求，響應(yīng)和HTTP標(biāo)頭（包含cookie和緩存信息）

Charles 是在 Mac 下常用的網(wǎng)絡(luò)封包截取工具，在做 移動開發(fā)時(shí)，我們?yōu)榱苏{(diào)試與服務(wù)器端的網(wǎng)絡(luò)通訊協(xié)議，常常需要截取網(wǎng)絡(luò)封包來分析。

Charles 通過將自己設(shè)置成系統(tǒng)的網(wǎng)絡(luò)訪問代理服務(wù)器，使得所有的網(wǎng)絡(luò)訪問請求都通過它來完成，從而實(shí)現(xiàn)了網(wǎng)絡(luò)封包的截取和分析。

除了在做移動開發(fā)中調(diào)試端口外，Charles 也可以用于分析第三方應(yīng)用的通訊協(xié)議。配合 Charles 的 SSL 功能，Charles 還可以分析 Https 協(xié)議

如果您是您一次使用Charles

可能對下面的感興趣。

• Charles破解版免費(fèi)下載和安裝教程
• Charles手機(jī)抓包設(shè)置
• Charles的https抓包方法及原理/下載ssl/http證書

如果您已經(jīng)正在使用Charles

可能感興趣下面的工具

• Charles禁止緩存工具
• Charles禁用cookies工具
• Charles遠(yuǎn)程映射工具
• Charles本地映射工具
• Charles鏡像工具
• Charles重寫工具
• Charles的black list 和 white list工具
• CharlesDNS欺騙工具
• Charles自動儲存工具
• Charles客戶端進(jìn)程工具
• Charles撰寫工具
• Charles重復(fù)發(fā)包工具
• Charles驗(yàn)證工具
• Charles Publish Gist 工具

如果您想了解頂部菜單欄

可以看下面的

• Charles View 視圖菜單介紹
• Charles的window和help菜單
• Charles的Edit菜單介紹
• Charles的proxy菜單介紹

Charles 相關(guān)

如果您有前端測試的需求，推薦 SwitchHosts這個(gè)小工具，當(dāng)然您如果對chrome瀏覽器的在線改host感興趣，也可以用下 Host Switch Plus

Charles和windows下的Fiddler都是同性質(zhì)的代理抓包工具；

Chrome DevTool 不能滿足所有調(diào)試

正常情況下，Chrome DevTool已經(jīng)滿足了日常web開發(fā)的需求，但是有的特性：編輯request的參數(shù)、重定向request請求的資源、編輯response的數(shù)據(jù)，ChromeDevTool就很蛋疼了，而且查看和調(diào)試移動端資源時(shí)候Chrome也并不好用；

我常借用Charles做這些事情

• 抓取 Http 和 Https 的請求和響應(yīng)，抓包是最常用的了。
• 重發(fā)網(wǎng)絡(luò)請求，方便后端調(diào)試，復(fù)雜和特殊情況下的一件重發(fā)還是非常爽的（捕獲的記錄，直接repeat就可以了，如果想修改還可以修改）。
• 修改網(wǎng)絡(luò)請求參數(shù)（客戶端向服務(wù)器發(fā)送的時(shí)候，可以修改后再轉(zhuǎn)發(fā)出去）。
• 網(wǎng)絡(luò)請求的截獲和動態(tài)修改。
• 支持模擬慢速網(wǎng)絡(luò)，主要是模仿手機(jī)上的2G/3G/4G的訪問流程。
• 支持本地映射和遠(yuǎn)程映射，比如你可以把線上資源映射到本地某個(gè)文件夾下，這樣可以方面的處理一些特殊情況下的bug和線上調(diào)試（網(wǎng)絡(luò)的css，js等資源用的是本地代碼，這些你可以本地隨便修改，數(shù)據(jù)之類的都是線上的環(huán)境，方面在線調(diào)試）；
• 可以抓手機(jī)端訪問的資源（如果是配置HOST的環(huán)境，手機(jī)可以借用host配置進(jìn)入測試環(huán)境）

charles相當(dāng)于一個(gè)插在服務(wù)器和客戶端之間的“過濾器”；

當(dāng)客戶端向服務(wù)器發(fā)起請求的時(shí)候，先到charles進(jìn)行過濾，然后charles在把最終的數(shù)據(jù)發(fā)送給服務(wù)器；

注意：此時(shí)charles發(fā)給服務(wù)器的數(shù)據(jù)，不一定是客戶端請求的數(shù)據(jù)；charles在接到客戶端的請求時(shí)可以自由的修改數(shù)據(jù)，甚至可以直接Block客戶端發(fā)的請求；

服務(wù)器接收請求后的返回?cái)?shù)據(jù)，也會先到charles，經(jīng)過charles過濾后再發(fā)給客戶端；

同理：客戶端接收的數(shù)據(jù)，不一定就是服務(wù)器返回的數(shù)據(jù)，而是charles給的數(shù)據(jù)；

正因?yàn)樯厦娴脑?#xff0c;所以charles能實(shí)現(xiàn)的功能，對前端開發(fā)者來說非常有吸引力，相當(dāng)于請求和響應(yīng)都可控的，而且charles為了控制更加方面，提供很多簡潔的操作；

注意Charles是收費(fèi)軟件，可以免費(fèi)試用30天的時(shí)間，推薦使用正版，研究學(xué)習(xí)可以看下 charles破解版免費(fèi)下載和安裝教程（我個(gè)人用的是charles4.1.2這個(gè)版本，現(xiàn)在用V4.2.28了）；

注意問題

如果想要抓包，第一件事情，就是把charles設(shè)置成為本機(jī)和服務(wù)端之間的”過濾器”；

讓所有的網(wǎng)絡(luò)請求全部經(jīng)過charles，這樣就可以捕獲并記錄到你請求的內(nèi)容和返回?cái)?shù)據(jù)了，原理請參照上面那張圖片；需要注意的是，如果你訪問的是web，可以把所有請求抓到；

但如果你想抓某些應(yīng)用（比如手機(jī)上的應(yīng)用等），應(yīng)用使用的某些資源，如果沒有向服務(wù)器發(fā)送請求，而是通過調(diào)用內(nèi)部資源的方式進(jìn)行展現(xiàn)，那么此時(shí)charles是抓不到的；驗(yàn)證這個(gè)的方式很簡單，就是把網(wǎng)絡(luò)斷掉后，如果還可以繼續(xù)展現(xiàn)，就是屬于調(diào)用內(nèi)部資源的，這種時(shí)候就不要想著通過抓包工具來捕獲資源了，他都沒有像服務(wù)器發(fā)起請求，手機(jī)點(diǎn)爛也抓不到的；

第一次啟動 Charles

啟動 Charles 后，第一次 Charles 會詢問你是否把Charles設(shè)置為系統(tǒng)的代理，如果此時(shí)你忽略了這個(gè)詢問敞口，你可以在后期設(shè)置的；將 Charles 設(shè)置成系統(tǒng)代理：選擇菜單中的 “Proxy” -> “Mac OS X Proxy/windows proxy” 來將 Charles 設(shè)置成系統(tǒng)代理，參考如下，如果Mac下有管理密碼，需要輸入密碼后方可進(jìn)行；

本文參考：https://www.axihe.com/

總結(jié)

以上是生活随笔為你收集整理的Charles 使用教程的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。