charles抓包工具粗略使用指南

經常使用的抓包工具備fiddler,charles,wireshark(固然還有其餘的工具)
我三個都用過,不過wireshark太複雜了,不是太懂用,抓到的信息太詳細了,反而不是太容易分辨,找出本身想要的內容(實際上是由於懶,懶的學,而且對網絡知識瞭解較少,境界不夠,境界到了天然會用)
我通常都是開發 APP 的時候,用到抓包工具,開發 web 網頁,chrome 自帶的 network 就已經很強大,知足需求了.
我用 window 開發時,會用 fiddler,用 mac 時,會用 charles(由於fiddler 沒有 mac 版本,恩,有 mac 版本,不過太反人類了,安裝麻煩,而且安裝了不必定能用,能用體驗性也很差,具體能夠百度下 fiddler 這個軟件).感受 fiddler 好用,主要是它的輸出信息,和 chrome 的 network 輸出信息相似,很容易就看懂,而且使用也簡單.其實 charles 使用也和 fiddler 差很少,可是之前用的時候,發現 fiddler 有漢化版,就一直用 fiddler 了 : )

我說下我之前用抓包工具的場景.
之前開發微信公衆號,領導讓我抄別人公衆號的頁面,一開始pc 版微信瀏覽器,有個右鍵另存爲的功能,後面微信版本升級,該功能去掉了(沒辦法愉快的仿站了),而後就想起使用抓包工具,來捕獲請求,保存在本地.
開發 APP 時,安卓開發人員與我(後端)產生分歧,說接口調不通,而且是按照文檔來請求,傳參,返回內容與文檔不一致,我和他都檢查過代碼,確認沒問題後,問題依然存在,因而就用抓包工具分析APP 請求,究竟是誰的代碼有問題.
對其餘人的 APP 好奇(抱着科研,學習心態),查看別人 APP 數據,接口地址,傳參等,若是有可能,使用爬蟲抓取數據(我沒有惡意?)
之前開發安卓的同事,問我如何抓包,他想看其餘人的 APP 參數是怎樣的,學習別人的接口風格(其實和第三個差很少)
如今用 rn 開發 APP,領導說首頁加載有點慢(請求數據,加載圖片等),讓咱們優化,咱們檢查代碼,發現代碼都是正常,因而抓包,觀察每一個請求響應時間,請求順序等,尋找優化方案(好比,請求過多,圖片太大,檢查是不是網絡帶寬問題,是否與手機型號,系統有關等)

Charles 使用
第一步.安裝charles
第二步.打開 Charles,打開代理選項設置

第三步.配置 http 代理端口,配置 websocks 代理,若是不想捕獲 websocks 代理,能夠不開啓 websocks 代理,而後點擊保存

第四步.開啓電腦全局代理,若是不開啓,那麼只有你將指定軟件的代理配置爲你電腦 ip 加端口才會捕獲到流量(端口是在第三步設置的 http proxy port)

第五步.如今就能夠開始抓包啦

能夠經過開啓 proxy—>選項中的start recording 開啓捕獲流量功能(上圖1號箭頭所指選項)
能夠經過開啓 proxy—>start throtting 開啓節流選項(上圖2號箭頭所指選項)
能夠經過開啓 proxy—>enable Breakpoints 開啓斷點功能(上圖3號箭頭所指選項)
注:

• 單純點擊 start throtting並不會有任何變化,須要先在proxy—> throttle Settings 進行配置,以下圖

  勾選了 enable throttling ,點擊 ok,纔會生效.這個通常是用來測試網絡對接口的影響.好比,測試 APP 在2G,3G,4G,wifi 下的工做狀況

• 斷點功能我並無用過 : )

擊,能夠清空請求記錄

第七步.開啓捕獲流量選項後,就能夠看到請求記錄啦,不過,目前能看到詳細內容的是 http 請求,https 並不能看到,須要配置 ssl 證書.

點擊,help—> ssl proxying 中的 install Charles root certificale,安裝本機證書,點擊後,會打開電腦的鑰匙串功能(mac 電腦)

將 Charles 的證書設置爲始終信任後,捕獲https 請求配置並未結束,還須要再配置一個地方.
打開proxy—>ssl proxying settings 選項

![圖片上傳中...]

這樣,就能夠捕獲 https 請求啦
注:我理解的 Charles 捕獲 https 請求是這樣工做的,待驗證是否正確,由於在本機安裝了證書,因此,請求發出後,Charles 攔截,獲取到內容,而後將內容用 Charles 本身的證書,發送給服務端,服務端返回給 Charles,Charles 解密後,將內容再返回給實際的接口請求者. 能夠這樣理解,Charles 至關於快遞公司,A須要寄快遞 給 B,A告訴Charles,charles 先驗貨,知道了A所寄物品的所有信息,而後打包發貨,B收到後,將收到後的評價告訴 Charles(好評或者差評或者意見),而後 Charles 再將 B 所說的內容告訴 A. 咱們在本機安裝的 Charles 證書,至關於快遞公司的營業執照,若是沒安裝,A 不知道 Charles 是不是一個正規的快遞公司,你寄快遞確定不能讓來路不明的人幫你寄吧.若是你沒寄過快遞,或者不瞭解快遞是什麼,當我這段話沒說.

移動設備抓包
若是須要捕獲手機請求,須要先將手機,電腦處於同一個局域網,而後將手機的代理設置爲電腦的IP+上面第三步設置的端口號(我上面截圖中設置的端口號是8888).
假設我電腦已經和個人安卓手機處於同一局域網了,而且的電腦 IP 爲192.168.1.100,我在電腦上的 Charles 設置 http 代理端口爲8888, 那麼我在手機上設置的代理爲http://192.168.1.100:8888.
設置成功後,能夠打開192.168.1.100:8888查看是否設置成功,若是能夠打開頁面,那麼就說明,配置正確,可使用啦.
不過這時候,你用手機請求 http 接口,是正常的,而且能夠看到請求內容,可是請求 https 就會沒法訪問,而且 Charles 只是有你的請求記錄,沒有請求詳情.這時候打開瀏覽器,訪問 https 網站,會提示不安全的網絡鏈接,沒法鏈接到服務器.
這時候就須要在手機上安裝證書,才能正常訪問 https 接口.
點擊 help—>ssl proxying 中的 install charles root certificate on a Mobile device or remote brower

點擊後,會彈出提示框

讓你設置手機的 http 代理爲你電腦的 IP+監聽端口,設置完成後用手機瀏覽器打開 http://chls.pro/ssl, 打開該網址後,會自動下載一個證書,下載完成後安裝到手機既可.這樣,手機就能夠正常訪問 https 接口啦,而且電腦的 Charles 中也會記錄手機的請求.

Charles 請求記錄說明
structure選項是將請求按域名分類排列

1.上面2號區域就是域名分類,點擊能夠展開
2.上面3號區域是能夠切換請求記錄的不一樣顯示方式
overview是以統計的形式顯示該域名下的請求記錄
summary是以摘要的形式顯示該域名下的請求記錄
chart 是以圖表的形式顯示該域名下的請求記錄
3.上面4號區域是請求統計,好比,請求總數,正在請求中的數量,請求失敗的數量,鏈接數
4.上面5號區域是請求時間記錄,該域名下的請求開始時間,結束時間,網絡鏈接速度(kb/s),請求速度(kb/s),返回速度(kb/s)等
5.上面6號區域是請求數據量大小統計

1.上圖1號箭頭是指請求編號(Charles 本身對請求進行的編號)
2.上圖2號箭頭是指URL資源名稱
3.上圖3號箭頭是指 URL 地址中的域名
4.上圖4號箭頭是指http請求狀態碼
5.上圖5號箭頭是指請求類型 http請求header 中的 content-type
6.上圖6號箭頭是指請求 header 的大小
7.上圖7號箭頭是指請求的 body大小
8.上圖8號箭頭是指該次請求所花費的時間

所在的列表明編號(Charles 本身對請求進行的編號)

resource所在的列表明資源名稱
timeline 表明請求所花費的時間而且用不一樣顏色標記出鏈接,請求,響應花費的時間佔總請求時間的比例
total duration 是指請求總共花費的時間
sequence選項是將請求按請求時間排序以列表形式顯示

1.請求圖標,圖標能夠顯示當前請求狀態或者類型
請求狀態圖標

表明請求當前正在上傳數據

表明請求當前正在等待返回

表明請求當前正在下載數據

表明請求是轉發或者重定向

表明請求失敗
請求類型圖標

表明請求類型是音樂文件 content-type 是audio/*

表明請求類型是文本 content-type 是text/*

表明請求是流 content-type 是application/*

表明請求是圖片,content-type 是 image/*

2.Code 請求狀態碼
3.Method 請求類型,get,post,put,delete 等
4.Host 主機名稱,請求的域名或者 IP
5.Path 請求的路徑,若是是 get 請求,參數也會顯示在這裏面
6.Start 請求開始時間
7.Duration 請求持續時間
即若是請求已經結束,那麼該時間就是請求總共花費的時間,若是請求還沒有結束,則該時間就是當前已經請求的時間
8.Size 請求數據大小
9.Status 請求狀態
connected to remote host 鏈接遠程服務器
sending request body 發送請求數據
waiting for response 等待響應
receiving response body 接收返回數據
complete 請求完成
fail 請求失敗
10.info 若是請求類型是圖片,該列則顯示圖片的寬高

過濾器

請求記錄詳細信息
Overview歸納信息

Request 請求信息

Response 返回信息

Summary 概要信息

Chart 圖表信息

Notes 筆記
能夠在這裏對該請求記錄內容

我在抓包時,有時候會遇到,status 爲 complete,狀態碼爲200,可是倒是請求失敗的,失敗緣由是Client closed connection before receiving entire response我說的不保證正確 : )