Charles是在 Mac 下常用的網(wǎng)絡(luò)封包截取工具，在做移動開發(fā)時，我們?yōu)榱苏{(diào)試與服務(wù)器端的網(wǎng)絡(luò)通訊協(xié)議，常常需要截取網(wǎng)絡(luò)封包來分析。
Charles 通過將自己設(shè)置成系統(tǒng)的網(wǎng)絡(luò)訪問代理服務(wù)器，使得所有的網(wǎng)絡(luò)訪問請求都通過它來完成，從而實現(xiàn)了網(wǎng)絡(luò)封包的截取和分析。
Charles 是收費軟件，可以免費試用 30 天。試用期過后，未付費的用戶仍然可以繼續(xù)使用，但是每次使用時間不能超過 30 分鐘，并且啟動時將會有 10 秒種的延時。因此，該付費方案對廣大用戶還是相當(dāng)友好的，即使你長期不付費，也能使用完整的軟件功能。只是當(dāng)你需要長時間進(jìn)行封包調(diào)試時，會因為 Charles 強(qiáng)制關(guān)閉而遇到影響。
安裝 Charles：
去 Charles 的官方網(wǎng)站（http://www.charlesproxy.com）下載最新版的 Charles 安裝包，是一個 dmg 后綴的文件。打開后將 Charles 拖到 Application 目錄下即完成安裝。
將 Charles 設(shè)置成系統(tǒng)代理：
之前提到，Charles 是通過將自己設(shè)置成代理服務(wù)器來完成封包截取的，所以使用 Charles 的第一步是將其設(shè)置成系統(tǒng)的代理服務(wù)器。
啟動 Charles 后，第一次 Charles 會請求你給它設(shè)置系統(tǒng)代理的權(quán)限。你可以輸入登錄密碼授予 Charles 該權(quán)限。你也可以忽略該請求，然后在需要將 Charles 設(shè)置成系統(tǒng)代理時，選擇菜單中的 “Proxy” -> “Mac OS X Proxy” 來將 Charles 設(shè)置成系統(tǒng)代理。如下所示：
之后，你就可以看到源源不斷的網(wǎng)絡(luò)請求出現(xiàn)在 Charles 的界面中。
需要注意的是，Chrome 和 Firefox 瀏覽器默認(rèn)并不使用系統(tǒng)的代理服務(wù)器設(shè)置，而 Charles 是通過將自己設(shè)置成代理服務(wù)器來完成封包截取的，所以在默認(rèn)情況下無法截取 Chrome 和 Firefox 瀏覽器的網(wǎng)絡(luò)通訊內(nèi)容。如果你需要截取的話，在 Chrome 中設(shè)置成使用系統(tǒng)的代理服務(wù)器設(shè)置即可，或者直接將代理服務(wù)器設(shè)置成?127.0.0.1:8888?也可達(dá)到相同效果。
Charles 主界面介紹：
Charles 主要提供兩種查看封包的視圖，分別名為 “Structure” 和 “Sequence”。?
Structure 視圖將網(wǎng)絡(luò)請求按訪問的域名分類。
Sequence 視圖將網(wǎng)絡(luò)請求按訪問的時間排序。
大家可以根據(jù)具體的需要在這兩種視圖之前來回切換。請求多了有些時候會看不過來，Charles 提供了一個簡單的 Filter 功能，可以輸入關(guān)鍵字來快速篩選出 URL 中帶指定關(guān)鍵字的網(wǎng)絡(luò)請求。
對于某一個具體的網(wǎng)絡(luò)請求，你可以查看其詳細(xì)的請求內(nèi)容和響應(yīng)內(nèi)容。如果請求內(nèi)容是 POST 的表單，Charles 會自動幫你將表單進(jìn)行分項顯示。如果響應(yīng)內(nèi)容是 JSON 格式的，那么 Charles 可以自動幫你將 JSON 內(nèi)容格式化，方便你查看。如果響應(yīng)內(nèi)容是圖片，那么 Charles 可以顯示出圖片的預(yù)覽。
過濾網(wǎng)絡(luò)請求：
通常情況下，我們需要對網(wǎng)絡(luò)請求進(jìn)行過濾，只監(jiān)控向指定目錄服務(wù)器上發(fā)送的請求。對于這種需求，以下幾種辦法：
方法一：在主界面的中部的 Filter 欄中填入需要過濾出來的關(guān)鍵字。例如我們的服務(wù)器的地址是：http://yuantiku.com?, 那么只需要在 Filter 欄中填入 yuantiku 即可。
方法二：在 Charles 的菜單欄選擇 “Proxy”->”Recording Settings”，然后選擇 Include 欄，選擇添加一個項目，然后填入需要監(jiān)控的協(xié)議，主機(jī)地址，端口號。這樣就可以只截取目標(biāo)網(wǎng)站的封包了。如下圖所示：
通常情況下，我們使用方法一做一些臨時性的封包過濾，使用方法二做一些經(jīng)常性的封包過濾。
方法三：在想過濾的網(wǎng)絡(luò)請求上右擊，選擇 “Focus”，之后在 Filter 一欄勾選上 Focussed 一項，如下圖所示：
這種方式可以臨時性的，快速地過濾出一些沒有通過關(guān)鍵字的一類網(wǎng)絡(luò)請求。
截取 iPhone 上的網(wǎng)絡(luò)封包：
Charles 通常用來截取本地上的網(wǎng)絡(luò)封包，但是當(dāng)我們需要時，我們也可以用來截取其它設(shè)備上的網(wǎng)絡(luò)請求。下面我就以 iPhone 為例，講解如何進(jìn)行相應(yīng)操作。
Charles 上的設(shè)置
要截取 iPhone 上的網(wǎng)絡(luò)請求，我們首先需要將 Charles 的代理功能打開。在 Charles 的菜單欄上選擇 “Proxy”->”Proxy Settings”，填入代理端口 8888，并且勾上 “Enable transparent HTTP proxying” 就完成了在 Charles 上的設(shè)置。如下圖所示:
iPhone 上的設(shè)置
首先我們需要獲取 Charles 運行所在電腦的 IP 地址，Charles 的頂部菜單的 “Help”->”Local IP Address”，即可在彈出的對話框中看到 IP 地址，如下圖所示：
在 iPhone 的 “ 設(shè)置 “->” 無線局域網(wǎng) “ 中，可以看到當(dāng)前連接的 wifi 名，通過點擊右邊的詳情鍵，可以看到當(dāng)前連接上的 wifi 的詳細(xì)信息，包括 IP 地址，子網(wǎng)掩碼等信息。在其最底部有「HTTP 代理」一項，我們將其切換成手動，然后填上 Charles 運行所在的電腦的 IP，以及端口號 8888，如下圖所示：
設(shè)置好之后，我們打開 iPhone 上的任意需要網(wǎng)絡(luò)通訊的程序，就可以看到 Charles 彈出 iPhone 請求連接的確認(rèn)菜單（如下圖所示），點擊 “Allow” 即可完成設(shè)置。
截取 Https 通訊信息
如果你需要截取分析 Https 協(xié)議相關(guān)的內(nèi)容。那么需要安裝 Charles 的 CA 證書。具體步驟如下。
首先我們需要在 Mac 電腦上安裝證書。點擊 Charles 的頂部菜單，選擇 “Help” -> “SSL Proxying” -> “Install Charles Root Certificate”，然后輸入系統(tǒng)的帳號密碼，即可在 KeyChain 看到添加好的證書。如下圖所示：
需要注意的是，即使是安裝完證書之后，Charles 默認(rèn)也并不截取 Https 網(wǎng)絡(luò)通訊的信息，如果你想對截取某個網(wǎng)站上的所有 Https 網(wǎng)絡(luò)請求，可以在該請求上右擊，選擇 SSL proxy，如下圖所示：
這樣，對于該 Host 的所有 SSL 請求可以被截取到了。
截取移動設(shè)備中的 Https 通訊信息
如果我們需要在 iOS 或 Android 機(jī)器上截取 Https 協(xié)議的通訊內(nèi)容，還需要在手機(jī)上安裝相應(yīng)的證書。點擊 Charles 的頂部菜單，選擇 “Help” -> “SSL Proxying” -> “Install Charles Root Certificate on a Mobile Device or Remote Browser”，然后就可以看到 Charles 彈出的簡單的安裝教程。如下圖所示：
按照我們之前說的教程，在設(shè)備上設(shè)置好 Charles 為代理后，在手機(jī)瀏覽器中訪問地址：http://charlesproxy.com/getssl，即可打開證書安裝的界面，安裝完證書后，就可以截取手機(jī)上的 Https 通訊內(nèi)容了。不過同樣需要注意，默認(rèn)情況下 Charles 并不做截取，你還需要在要截取的網(wǎng)絡(luò)請求上右擊，選擇 SSL proxy 菜單項。
