Charles 教程

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

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

 

Charles

Charles是一個HTTP代理/ HTTP監視器/反向代理，使開發人員可以查看其機器和Internet之間的全部HTTP和SSL / HTTPS流量。這包括請求，響應和HTTP標頭（包含cookie和緩存信息）

Charles 是在 Mac 下經常使用的網絡封包截取工具，在作 移動開發時，咱們爲了調試與服務器端的網絡通信協議，經常須要截取網絡封包來分析。

Charles 經過將本身設置成系統的網絡訪問代理服務器，使得全部的網絡訪問請求都經過它來完成，從而實現了網絡封包的截取和分析。

除了在作移動開發中調試端口外，Charles 也能夠用於分析第三方應用的通信協議。配合 Charles 的 SSL 功能，Charles 還能夠分析 Https 協議

若是您是您一次使用 Charles

可能對下面的感興趣。

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

若是您已經正在使用 Charles

可能感興趣下面的工具

• Charles 禁止緩存工具
• Charles 禁用 cookies 工具
• Charles 遠程映射工具
• Charles 本地映射工具
• Charles 鏡像工具
• Charles 重寫工具
• Charles 的 black list 和 white list 工具
• CharlesDNS 欺騙工具
• Charles 自動儲存工具
• Charles 客戶端進程工具
• Charles 撰寫工具
• Charles 重複發包工具
• Charles 驗證工具
• Charles Publish Gist 工具

若是您想了解頂部菜單欄

能夠看下面的

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

Charles 相關

若是您有前端測試的需求，推薦 SwitchHosts 這個小工具，固然您若是對 chrome 瀏覽器的在線改 host 感興趣，也能夠用下 Host Switch Plus

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

Chrome DevTool 不能知足全部調試

正常狀況下，Chrome DevTool 已經知足了平常 web 開發的需求，可是有的特性：編輯 request 的參數、重定向 request 請求的資源、編輯 response 的數據，ChromeDevTool 就很蛋疼了，並且查看和調試移動端資源時候 Chrome 也並很差用；

我常借用 Charles 作這些事情

• 抓取 Http 和 Https 的請求和響應，抓包是最經常使用的了。
• 重發網絡請求，方便後端調試，複雜和特殊狀況下的一件重發仍是很是爽的（捕獲的記錄，直接 repeat 就能夠了，若是想修改還能夠修改）。
• 修改網絡請求參數（客戶端向服務器發送的時候，能夠修改後再轉發出去）。
• 網絡請求的截獲和動態修改。
• 支持模擬慢速網絡，主要是模仿手機上的 2G/3G/4G 的訪問流程。
• 支持本地映射和遠程映射，好比你能夠把線上資源映射到本地某個文件夾下，這樣能夠方面的處理一些特殊狀況下的 bug 和線上調試（網絡的 css，js 等資源用的是本地代碼，這些你能夠本地隨便修改，數據之類的都是線上的環境，方面在線調試）；
• 能夠抓手機端訪問的資源（若是是配置 HOST 的環境，手機能夠借用 host 配置進入測試環境）

charles至關於一個插在服務器和客戶端之間的「過濾器」；

當客戶端向服務器發起請求的時候，先到charles進行過濾，而後charles在把最終的數據發送給服務器；

注意：此時charles發給服務器的數據，不必定是客戶端請求的數據；charles在接到客戶端的請求時能夠自由的修改數據，甚至能夠直接Block客戶端發的請求；

服務器接收請求後的返回數據，也會先到charles，通過charles過濾後再發給客戶端；

同理：客戶端接收的數據，不必定就是服務器返回的數據，而是charles給的數據；

正由於上面的原理，因此charles能實現的功能，對前端開發者來講很是有吸引力，至關於請求和響應均可控的，並且charles爲了控制更加方面，提供不少簡潔的操做；

注意Charles是收費軟件，能夠免費試用30天的時間，推薦使用正版，研究學習能夠看下 charles破解版免費下載和安裝教程（我我的用的是charles4.1.2這個版本，如今用V4.2.28了）；

注意問題

若是想要抓包，第一件事情，就是把charles設置成爲本機和服務端之間的」過濾器」；

讓全部的網絡請求所有通過charles，這樣就能夠捕獲並記錄到你請求的內容和返回數據了，原理請參照上面那張圖片；須要注意的是，若是你訪問的是web，能夠把全部請求抓到；

但若是你想抓某些應用（好比手機上的應用等），應用使用的某些資源，若是沒有向服務器發送請求，而是經過調用內部資源的方式進行展示，那麼此時charles是抓不到的；驗證這個的方式很簡單，就是把網絡斷掉後，若是還能夠繼續展示，就是屬於調用內部資源的，這種時候就不要想着經過抓包工具來捕獲資源了，他都沒有像服務器發起請求，手機點爛也抓不到的；

第一次啓動 Charles

啓動 Charles 後，第一次 Charles 會詢問你是否把Charles設置爲系統的代理，若是此時你忽略了這個詢問敞口，你能夠在後期設置的；將 Charles 設置成系統代理：選擇菜單中的 「Proxy」 -> 「Mac OS X Proxy/windows proxy」 來將 Charles 設置成系統代理，參考以下，若是Mac下有管理密碼，須要輸入密碼後方可進行；

 

本文參考：阿西河前端教程