Charles 從入門到精通，看這篇文章就夠了

大家好，Charles 是我們工作中常用的抓包工具，功能非常強大，那今天我們就介紹一下 Charles 的用法及實現原理。

簡介

Charles 是在 PC 端常用的網路封包擷取工具，在做軟體測試/APP 開發時，我們為了除錯與伺服器端的網路通訊協議，常常需要擷取網路封包來分析。Charles 支援 抓取 HTTP 和 HTTPS 協議的網路請求和響應，也可以用於分析第三方應用的通訊協議。

Charles 實現原理

Charles 是一個代理伺服器。配置好 PC 或手機網路代理後，Charles 就像一箇中間人，能夠捕獲到從客戶端發到伺服器的請求，以及伺服器再傳遞迴客戶端時的響應，所以我們開啟 Charles 能夠看到 HTTP（HTTPS）請求和響應的詳細資訊。

安裝 Charles

• 訪問 Charles 的官方網站（http://www.charlesproxy.com）
• 下載最新版的 Charles 安裝包，MAC 版安裝包開啟後將 Charles 拖到 Application 目錄下即可，Windows 版開啟可執行程式安裝即可

Charles 主介面

Charles 主要提供兩種檢視請求的檢視，分別名為 “Structure” 和 “Sequence”：

• Structure 檢視將網路請求按訪問的域名分類（推薦）
• Sequence 檢視將網路請求按訪問的時間排序

主頁面右側上方可以看到請求詳情，包括 Header，請求引數，Cookies 等資訊。右側下方展示返回結果，如果是 JSON，會自動進行格式化方便檢視；如果返回的是圖片，還可以顯示出圖片的預覽效果。

Filter 功能：作用是篩選出指定的請求。

• 方法一：可以輸入關鍵字來快速篩選出 URL 中帶指定關鍵字的網路請求。
• 方法二：在 Charles 的選單欄選擇 “Proxy”->” Recording Settings”，然後選擇 Include 欄，選擇新增一個專案，然後填入需要監控的協議，主機地址，埠號。這樣就可以只擷取目標網站的封包

• 方法三（推薦）：在想過濾的網路請求上右擊，選擇 “Focus”。

Charles 抓包教程

PC 端抓包

啟動 Charles 後，第一次 Charles 會請求你給它設定系統代理的許可權。你可以輸入登入密碼授予 Charles 該許可權。你也可以忽略該請求，然後在需要將 Charles 設定成系統代理時，選擇選單中的 “Proxy” -> “Mac OS Proxy” 來將 Charles 設定成系統代理。如下所示：

設定 Mac OS Proxy 後，可以再檢查 Mac 的 WIFI 代理設定。預設情況下網頁代理（HTTP）和安全網頁代理（HTTPS）選項中網路代理伺服器顯示為 127.0.0.1 埠為 8888。

到了這一步，正常情況下，你的 PC 就可以捕獲到 HTTP 請求了，若還是無法正常捕獲，檢查 WIFI 代理是否設定了自動代理配置，若設定了會導致無法捕獲到 Chrome 和 Firefox 瀏覽器的請求，使用時可以先取消勾選該選項。

移動端抓包

這裡的抓包教程以 iPhone 為例子，安卓操作步驟與 iPhone 一致。首先需要將 Charles 的代理功能開啟。在 Charles 的選單欄上選擇 “Proxy”->” Proxy Settings”，填入代理埠 8888，並且勾上 “Enable transparent HTTP proxying” 就完成了在 Charles 上的設定。如下圖所示:

獲取 Charles 執行所在電腦的 IP 地址，Charles 的頂部選單的 “Help”->” Local IP Address”，即可在彈出的對話方塊中看到 IP 地址，如下圖所示：

在 iPhone 的 “ 設定 “->” 無線區域網 “ 中，可以看到當前連線的 WIFI 名，透過點選右邊的詳情鍵，可以看到當前連線上的 WIFI 的詳細資訊，包括 IP 地址，子網掩碼等資訊。在其最底部有「HTTP 代理」一項，我們將其切換成「手動」，然後填上 Charles 執行所在的電腦的 IP（見上張圖片），以及埠號 8888，如下圖所示：

設定好之後，我們開啟 iPhone 上的任意需要網路通訊的程式（如手機上百度 APP），就可以看到 Charles 彈出 iPhone 請求連線的確認選單（如下圖所示），點選 “Allow” 即可完成設定。現在就可以進行 HTTP 抓包了，如果還想再進行 HTTPS 抓包，需要安裝和信任對應的證書。

HTTPS 抓包

上面 PC 端與移動端抓包步驟設定好以後，Charles 就可以正常捕獲 HTTP 請求了，但是現在還無法解析 HTTPS 請求。如果還想解析 HTTPS 請求，需要在 PC 端和手機端安裝證書。
（1）PC 端安裝證書
點選 Charles 的頂部選單，選擇 “Help” -> “SSL Proxying” -> “Install Charles Root Certificate”，然後輸入系統的帳號密碼，即可在 KeyChain 看到新增好的證書。如下圖所示：

然後再進行信任證書，在 Mac 上的 “鑰匙串訪問” App 中，選擇其中一個鑰匙串列表中的鑰匙串，然後連按一個證書，設定 Charles 的證書為始終信任：

完成以上步驟，你的 MAC 就可以正常抓取和解析 HTTPS 協議了。
證書過期處理方式，當我們使用 Charles 超過兩年以上，Charles Root 證書過期，可以透過下方這種方式重置並重新安裝證書。

（2）移動端安裝證書 點選 Charles 的頂部選單，選擇 “Help” -> “SSL Proxying” -> “Install Charles Root Certificate on a Mobile Device or Remote Browser”

彈出提示框，上面有代理的 IP 與埠，以及下載證書的地址：

拿出手機，以安卓為例子。開啟 WIFI 將代理調整為手動，然後輸入 charles 彈出來的主機 ip，再將埠號輸入：8888

• 下載證書：點選確認後 Charles 會出現連線是否允許的選項，點選 allow，然後就可以在手機瀏覽器輸入 chls.pro/ssl 下載證書。
• 安裝與信任證書：安卓手機（華為）安裝證書的方式【設定 - 安全 - 更多安全設定 - 加密和憑據 - 從儲存裝置安裝 - 證書的路徑】注意：證書用途一定要選擇 VPN 和應用，不然華為手機無法信任使用者安裝的證書。 IOS 信任證書的方式【設定 - 通用 - 關於本機 - 證書信任設定】

Charles 常用功能

重複請求

在測試過程中，有時候需要對伺服器重複相同傳送請求，用於定位伺服器問題或者壓力測試，在請求上雙擊右鍵選單，點選 Repeat 按鈕就可以重複傳送請求：

點選 Repeat Advanced... ，還可以設定重複傳送的次數，是否多執行緒傳送，以及每次傳送的時間間隔

模擬弱網

在做軟體測試的時候，我們常常需要模擬慢速網路或者高延遲的網路，以測試在弱網下，APP 的各個功能是否正常使用，以及是否有對應的網路提示。
在 Charles 的選單上，選擇 “Proxy”->” Throttle Setting” 項，在之後彈出的對話方塊中，我們可以勾選上 “Enable Throttling”，並且可以設定 Throttle Preset 的型別，可以模擬 3G 或者其他指定 kbps 的網路，設定下載和上傳的速率。如下圖所示：

修改請求和響應

在測試時，我們時常會重定向請求的地址，以及修改請求或者響應的內容。Charles 提供了 MAP、Rewrite、Breakpoints 三大功能來實現

• Map 功能適合長期地將某一些請求重定向到另一個網路地址或本地檔案
• Rewrite 功能適合對網路請求進行一些正則替換
• Breakpoints 功能適合做一些臨時性的修改

MAP

Map 功能分為 Map Remote 和 Map Local。Map Remote 是將指定的網路請求重定向到另一個網址請求地址，Map Local 是將響應的內容重定向到本地檔案
在 Charles 的選單中，選擇 “Tools”->” Map Remote” 或 “Map Local” 即可進入到相應功能的設定頁面：

對於 Map Remote 功能，分別填寫網路重定向的源地址和目的地址，對於不需要限制的條件，可以留空。下圖是一個示例，我將所有 baidu.baidu.com（線上地址）的請求重定向到了 11.102.135.33:8505（線下測試地址）

對於 Map Local 功能，我們需要填寫的重定向的源地址和本地的目標檔案。對於有一些複雜的網路請求結果，我們可以先使用 Charles 提供的 “Save Response…” 功能，將請求結果儲存到本地（如下圖所示），然後稍加修改（比如修改某個返回欄位的資料），成為我們的目標對映檔案。

將一個指定的網路請求透過 Map Local 功能對映到了本地的一個經過修改的檔案中，圖中的 Map From 就是源請求地址，而 Map To 就是本地的返回結果檔案。

Map Local 在使用的時候，有一個潛在的問題，就是其返回的 HTTP Response Header 與正常的請求並不一樣。這個時候如果客戶端校驗了 HTTP Response Header 中的部分內容，就會使得該功能失效。解決辦法是同時使用 Map Local 以下面提到的 Rewrite 功能，將相關的 HTTP 頭 Rewrite 成我們希望的內容。

在測試時，我們通常有線上和線下兩套環境，而我們的 APP 直接開啟是請求的線上環境，這時候就需要透過 Charles 的 Map Remote 功能，實現重定向請求到線下環境進行測試。也可以使用 Map Local 來修改響應結果。

Rewrite

修改請求或者返回結果 Body 或者 Header 內容，支援正規表示式：

Rewrite 還可以和 Map Remote 配合使用。即先重定向地址，然後修改請求頭或返回結果等，注意如果需要在 Map Remote 勾選 Preserve host in header fields，不然 Rewrite 無法命中。

Breakpoints

上面提供的 Rewrite 功能最適合做批次和長期的替換，如果只是想臨時替換一次，可以 Breakpoints 功能。

Breakpoints 功能類似我們在 Xcode 中設定的斷點一樣，當指定的網路請求發生時，Charles 會截獲該請求。勾選 Breakpoints 後，可以點選 repeat，開啟斷點除錯皮膚後，點選 add 臨時修改網路請求的請求/返回內容，然後點選 Execute 執行即可。

反向代理

Charles 的反向代理功能允許我們將本地的埠對映到遠端的另一個埠上。例如，在下圖中，我將本機的 65383 埠對映到了遠端（www.baidu.com）的 80 埠上了。這樣，當我訪問本地的 65383 埠時，實際返回的內容會由 www.baidu.com 的 80 埠提供。

好了，以上就是 Charles 教程的全部內容，它是我們測試工程師幾乎必備的工具，用它來模擬弱網，重定向和修改請求都是非常方便的。