Charles的使用

移動開發常常都須要抓包調試,以前用的是Windows的 Fiddler ,某日才發現mac上的 Charles 也有Windows版本,一查原來是mac/linux/Windows都支持,好定西啊,我是比較喜歡跨平臺的東東的,之後切換開發環境的時候就比較平滑了,在此記錄下使用心得操做;

基於:
Charles v4.x
系統: Windows10/mac10.13

一些需求場景

1. 先後端同時開始某個功能迭代, 約定好接口數據格式後, 前端同窗經過代理軟件的重定向功能來模擬服務器response,而不一樣等待後端;
2. 手動復現某些response,好比500錯誤;
3. 弱網環境模擬;

安裝

直接上 官網 下載就行了,最新的是v4.2.1,收費軟件,免費試用30天,到期不影響功能;

基本結構

主要是會話的兩種視圖模式以及對應的 requet/response 面板組成:

• Structure 視圖模式下,列表會按照域名來歸類全部請求;
• Sequence 視圖則是按照請求發生的順序來展現;
  

若是不習慣 Sequence 默認的上下視圖,能夠修改成相似 Fiddler 的左右視圖模式(更符合眼睛的習慣): 快捷鍵 cmd+, -> Charles Preferences -> Viewers, 修改 Sequence view layout 爲 Tall 便可;

經常使用的功能在圖上已經有註釋,很少說, Charles 的右鍵菜單功能比 Fiddler 多,簡單看幾個:

• Save response : 保存response數據到文件中,方便後面用於重定向功能 map local...;

選擇多條記錄後再右鍵就會有 Save All... 能夠方便的把全部response信息一次性導出到某個目錄中,而後經過 map local... 結合通配符來批量重定向請求;

• Export : 能夠將選中的多個會話信息完整導出成文件(*.chls),經過File - import 來導入chls文件,方便不一樣開發人員進行調試或者現象復現分析;
• Compose: 能夠基於當前 request 請求信息來構造新的請求, 相似於 postman 的功能;
• repeat: 重發當前的請求;
• repeat advanced... : 能夠設定重發次數以及併發數,可用於進行簡單的服務器壓測;

菜單

Proxy 菜單

這個用得比較多,在這裏設置跟蹤捕捉過濾功能:

設置會話捕捉條件( Recording Settings )

• include 面板用於啓用/中止能夠捕捉/顯示的會話;
• exclude 表示不顯示的會話,在會話列表中右鍵選擇 ignore 時,對應的url會出如今這裏;

比較好用的是過濾條件支持通配符, * 表示任意多個字符, ? 表示一個字符,如 Protocol 中有 http , https 和 "",選擇空白或者輸入 * 均可以表示任意協議的請求;

也能夠經過主界面底部的 Filter 來簡單設置過濾條件,但不支持通配符

設置容許鏈接的ip地址( Access control Settings )

模擬網絡環境( Throttle Settings )

在這裏選擇要模擬的網絡環境,選項比 Fidder 多不少,也能夠自定義,最人性的是還能夠對指定的url進行網絡環境摸, 好評...
這裏設置完成後經過 Proxy - Start Throttling(Ctrl+T) 或者經常使用工具欄按鈕來啓用或中止;

設置爲代理服務器,並捕獲手機請求( Proxy Settings )

端口號 Port 默認 8888 ,跟 Fiddler 同樣,免得切換代理軟件的時候,手機還得從新設置wifi代理了; 記得啓用 Enable transtarent HTTP proxying

手機上的設置跟 Fiddler 相似,切換到wifi設置頁面,選擇Proxy 選擇 manual ,代理服務器設置爲 Charles 所在設備的ip,端口就是上面設定的 8888 , 注意: 手機和 Charles 所在機器需處於同一個wifi網絡中;

以上設定完成後,就能夠在 Charles 中捕獲手機發起的請求了,第一次鏈接的時候 Charles 會彈出確認提示框,選擇 allow 就行了,後續可在 proxy -> access control settings 中進行管理:

Tools菜單

rewrite 動態修改 request/response 信息

跟 map local 相似,也能夠對response進行修改,不過他改變的只是部份信息,好比:主機地址( Host ),返回狀態碼( response status),返回信息內容( body )等:

捕獲https請求

1. 在本機上安裝證書

這裏能夠直接選擇 Install charles root certificate,會在本機上安裝證書,也能夠如圖選擇保存證書,而後手動導入到須要的位置,操做相似:

mac上的操做請看 這篇

2. 在手機上安裝證書

單擊 help -- ssl proxying - install charles root certificate on a mobile device or remote browser ,會彈出提示框,而後在手機瀏覽器上輸入網址: chls.pro/ssl ,而後根據提示保存證書便可:

3. 啓用https捕捉

啓用後就能夠在會話視圖列表中看到https請求了;

斷點功能(臨時修改內容)

方法:

1. 在會話列表中右鍵點擊某個會話,而後在菜單中選擇 Breakpoints ;
2. 經過 Proxy - Breakpoint settings... 中手動新建/啓用某個斷點;

   要求勾選 enable breakpoints

以後當下次再有該請求時,會自動進入斷點模式;

一個完整請求會進入斷點模式2次:

• request的發出以前;
• 收到服務器的response但還沒有返回給客戶端的時候;

斷點request的時候,能夠修改request信息,不過咱們程序都有對請求header作校驗和處理,修改參數後通常就直接報錯了,因此這裏看看response就好,反正操做相似:

在 edit response 中能夠雙擊直接修改json文件的key/value值,很方便,修改完成後單擊 execute 繼續執行其餘操做,將修改後的response返回給客戶端;

response 重定向功能

這個跟 Fiddler 的 autoResponse 功能相似,能夠指定本地文件( map local... )也能夠指定爲其餘服務器( map remote... )上的文件,咱們介紹前一種;

這裏的 map local 只能重定向 response 的數據內容部分,而 headers 仍是會保留服務器返回的,好比要修改返回碼之類的操做,目前來看,只能經過斷點或者 rewrite 來進行,這一點比 Filder 弱,不太方便,也多是我還沒發現怎麼處理,有知道的請不吝告知,謝謝;

斷點能夠用於臨時修改數據,也是一種重定向功能,如果要長期重定向,咱仍是將response重定向到本機文件比較方便,具體方法:

• 準備一份要返回給客戶端的 response 數據文件,能夠從前面介紹的 save Response 來保存正常數據,而後修改,也能夠本身構造一份(用於服務端api還沒有發佈,但移動端又須要進行調試的時候);
• 右鍵單擊某個請求,從菜單中選擇 map local ... , 也能夠單擊 Tools - Map Local... 打開 map lcoal settings 來添加一個映射關係,兩種操做是同樣的,前者只不過直接把url信息給寫好了:

  

• 完成設定後,後續符合條件的請求都會用本地映射文件替代;

最後: 我以前在Windows下是 Fiddler 和 Charles 配合使用,主要是 Fiddler 的https抓包一直出問題,而 Charles 就很正常,後來更換mbp後就一直用 Charles 了,可是 Charles 也有一些不足:

1. 刪除多個會話時會感受獲得卡,而 Fiddler 很順暢;
2. filter 功能沒 Fiddler 強大;
3. Fiddler 提供腳本自定義功能,若是是C#開發者的話,還能夠很方便的集成fiddler_core到本身的應用中;

擴展閱讀: Fiddler的使用技巧