移動App端抓包工具Charles詳解

來自專欄 python自動化測試java自動化測試

簡介

Charles 是在 Mac 下常用的網路封包截取工具，在做移動開發時，我們為了調試與伺服器端的網路通訊協議，常常需要截取網路封包來分析。

Charles 通過將自己設置成系統的網路訪問代理伺服器，使得所有的網路訪問請求都通過它來完成，從而實現了網路封包的截取和分析。

除了在做移動開發中調試埠外，Charles 也可以用於分析第三方應用的通訊協議。配合 Charles 的 SSL 功能，Charles 還可以分析 Https 協議。

Charles 是收費軟體，可以免費試用 30 天。試用期過後，未付費的用戶仍然可以繼續使用，但是每次使用時間不能超過 30 分鐘，並且啟動時將會有 10 秒種的延時。因此，該付費方案對廣大用戶還是相當友好的，即使你長期不付費，也能使用完整的軟體功能。只是當你需要長時間進行封包調試時，會因為 Charles 強制關閉而遇到影響。

Charles 主要的功能包括：

1. 截取 Http 和 Https 網路封包。

2. 支持重發網路請求，方便後端調試。

3. 支持修改網路請求參數。

4. 支持網路請求的截獲並動態修改。

5. 支持模擬慢速網路。

安裝 Charles

去 Charles 的官方網站（http://www.charlesproxy.com）下載最新版的 Charles 安裝包，是一個dmg後綴的文件。打開後將 Charles 拖到 Application 目錄下即完成安裝。

將 Charles 設置成系統代理

之前提到，Charles 是通過將自己設置成代理伺服器來完成封包截取的，所以使用 Charles 的第一步是將其設置成系統的代理伺服器。

啟動 Charles 後，第一次 Charles 會請求你給它設置系統代理的許可權。你可以輸入登錄密碼授予 Charles 該許可權。你也可以忽略該請求，然後在需要將 Charles 設置成系統代理時，選擇菜單中的 「Proxy」 –> 「Mac OS X Proxy」 來將 Charles 設置成系統代理

之後，你就可以看到源源不斷的網路請求出現在 Charles 的界面中。

需要注意的是，Chrome 和 Firefox 瀏覽器默認並不使用系統的代理伺服器設置，而 Charles 是通過將自己設置成代理伺服器來完成封包截取的，所以在默認情況下無法截取 Chrome 和 Firefox 瀏覽器的網路通訊內容。如果你需要截取的話，在 Chrome 中設置成使用系統的代理伺服器設置即可，或者直接將代理伺服器設置成127.0.0.1:8888也可達到相同效果。

Charles 主界面介紹

Charles 主要提供兩種查看封包的視圖，分別名為 「Structure」 和 「Sequence」。

1. Structure 視圖將網路請求按訪問的域名分類。

2. Sequence 視圖將網路請求按訪問的時間排序。

大家可以根據具體的需要在這兩種視圖之前來回切換。請求多了有些時候會看不過來，Charles 提供了一個簡單的 Filter 功能，可以輸入關鍵字來快速篩選出 URL 中帶指定關鍵字的網路請求。

對於某一個具體的網路請求，你可以查看其詳細的請求內容和響應內容。如果請求內容是 POST 的表單，Charles 會自動幫你將表單進行分項顯示。如果響應內容是 JSON 格式的，那麼 Charles 可以自動幫你將 JSON 內容格式化，方便你查看。如果響應內容是圖片，那麼 Charles 可以顯示出圖片的預覽。

過濾網路請求

通常情況下，我們需要對網路請求進行過濾，只監控向指定目錄伺服器上發送的請求。對於這種需求，以下幾種辦法

方法一：在主界面的中部的 Filter 欄中填入需要過濾出來的關鍵字。例如我們的伺服器的地址是：http://yuantiku.com , 那麼只需要在 Filter 欄中填入yuantiku即可。

方法二：在 Charles 的菜單欄選擇 「Proxy」–>「Recording Settings」，然後選擇 Include 欄，選擇添加一個項目，然後填入需要監控的協議，主機地址，埠號。這樣就可以只截取目標網站的封包了。

通常情況下，我們使用方法一做一些臨時性的封包過濾，使用方法二做一些經常性的封包過濾。

方法三：在想過濾的網路請求上右擊，選擇 「Focus」，之後在 Filter 一欄勾選上Focussed一項，如下圖所示：

這種方式可以臨時性的，快速地過濾出一些沒有通過關鍵字的一類網路請求。

截取 iPhone 上的網路封包

Charles 通常用來截取本地上的網路封包，但是當我們需要時，我們也可以用來截取其它設備上的網路請求。下面我就以 iPhone 為例，講解如何進行相應操作。

Charles 上的設置

要截取 iPhone 上的網路請求，我們首先需要將 Charles 的代理功能打開。在 Charles 的菜單欄上選擇 「Proxy」–>「Proxy Settings」，填入代理埠 8888，並且勾上 「Enable transparent HTTP proxying」 就完成了在 Charles 上的設置

在 iPhone 的 「 設置 」–>「 無線區域網 」 中，可以看到當前連接的wifi名，通過點擊右邊的詳情鍵，可以看到當前連接上的wifi的詳細信息，包括 IP 地址，子網掩碼等信息。在其最底部有「HTTP 代理」一項，我們將其切換成手動，然後填上 Charles 運行所在的電腦的 IP，以及埠號 8888。

設置好之後，我們打開 iPhone 上的任意需要網路通訊的程序，就可以看到 Charles 彈出 iPhone 請求連接的確認菜單（如下圖所示），點擊 「Allow」 即可完成設置。

截取 Https 通訊信息

安裝證書

如果你需要截取分析 Https 協議相關的內容。那麼需要安裝 Charles 的 CA 證書。具體步驟如下。

由於HTTPS使用443埠，如果想要抓取HTTPS的數據包就必需讓charles對所有埠號為443的請求或者返回進行安全認證。我們在客戶端和PC端安裝證書就是為了配合此項設置對使用charles代理進行HTTPS通信的連接進行安全校驗。具體操作：在Locations列表中添加HOST為*，Prot為443的本地SSL代理規則。

首先我們需要在 Mac 電腦上安裝證書。點擊 Charles 的頂部菜單，選擇 「Help」 –> 「SSL Proxying」 –> 「Install Charles Root Certificate」，然後輸入系統的帳號密碼，即可在KeyChain看到添加好的證書。如下圖所示：

截取移動設備中的 Https 通訊信息

如果我們需要在iOS或 Android 機器上截取 Https 協議的通訊內容，還需要在手機上安裝相應的證書。點擊 Charles 的頂部菜單，選擇 「Help」 –> 「SSL Proxying」 –>「Install Charles Root Certificate on a Mobile Device or Remote Browser」，然後就可以看到 Charles 彈出的簡單的安裝教程。如下圖所示：

按照我們之前說的教程，在設備上設置好 Charles 為代理後，在手機瀏覽器中訪問地址：圖中紅色框內的地址，即可打開證書安裝的界面，安裝完證書後，就可以截取手機上的 Https 通訊內容了。不過同樣需要注意，默認情況下 Charles 並不做截取，你還需要在要截取的網路請求上右擊，選擇 SSL proxy 菜單項。

模擬慢速網路

在做移動開發的時候，我們常常需要模擬慢速網路或者高延遲的網路，以測試在移動網路下，應用的表現是否正常。Charles 對此需求提供了很好的支持。

在 Charles 的菜單上，選擇 「Proxy」–>「Throttle Setting」 項，在之後彈出的對話框中，我們可以勾選上 「Enable Throttling」，並且可以設置 Throttle Preset 的類型。如下圖所示：

如果我們只想模擬指定網站的慢速網路，可以再勾選上圖中的 「Only for selected hosts」 項，然後在對話框的下半部分設置中增加指定的 hosts 項即可。