charles相當於一個插在伺服器和客戶端之間的“過濾器”；

當客戶端向伺服器發起請求的時候，先到charles進行過濾，然後charles在把最終的資料傳送給伺服器；

注意：此時charles發給伺服器的資料，不一定是客戶端請求的資料；charles在接到客戶端的請求時可以自由的修改資料，甚至可以直接Block客戶端發的請求；

伺服器接收請求後的返回資料，也會先到charles，經過charles過濾後再發給客戶端；

同理：客戶端接收的資料，不一定就是伺服器返回的資料，而是charles給的資料；

正因為上面的原理，所以charles能實現的功能，對前端開發者來說非常有吸引力，相當於請求和響應都可控的，而且charles為了控制更加方面，提供很多簡潔的操作

1.下載安裝

https://www.charlesproxy.com

2.設定代理

點選“代理-代理設定”，設定一個埠

手機連線wifi後，配置該wifi代理為手動，代理主機輸入本機電腦的ip和此埠，就可以正常抓包

3.設定抓取特定ip

方法一：在 Charles 的選單欄選擇 “Proxy”->”Recording Settings”，然後選擇 Include 欄，選擇新增一個專案，然後填入需要監控的協議，主機地址，埠號。這樣就可以只擷取目標網站的封包了;

方法二：在主介面的中部的 Filter 欄中填入需要過濾出來的關鍵字。

4.模擬介面傳送請求

先新建一個JSON檔案，取名 test.json，輸入一個簡單的測試陣列

[
“hello”，
“world”
]

開啟Charles，Tools - Map Local

5.charles重複傳送一個網路請求&同時傳送N次

重發網路請求的目的：後端除錯的過程中，一直在客戶端進行點點點比較麻煩，此時直接傳送請求比較方便檢視除錯後的結果（方便後端除錯）

1.重複傳送一個請求（有兩種方法）

（1）選定該請求，右鍵選擇repeat，則會將請求重新發送一遍

（2）選定該請求，直接點選導航欄上面的重複按鈕，下圖所示

2.讓請求同時傳送N次

目的是判斷多次傳送請求時，伺服器的響應時間如何。

右鍵選中該請求，repeat下面還有一個Repeat Advanced選項，其實該選項也是重複傳送請求的一種，可以同時傳送多個請求。點選ok之後會回到主頁面可觀察到請求被髮送了10次。

6.撰寫請求

可以修改、增加、刪除引數名、引數值，請求頭等等

7.斷點--可以看到 修改過後的請求返回是什麼效果，達到測試的目的。

對要打斷點的介面右鍵，選擇【Breakpoints】

在工具欄可以檢視打上斷點的url

雙擊此url，修改查詢為*，設定可修改請求和響應

點選ok, 重新再跑一下介面。 當跑到設定斷點的介面時，網頁會暫停，這個時候Charles進入breakpoints

點選Edit Request 修改請求引數。這裡根據你要測試的資料來修改

修改好引數後，點選Execute （執行）。 另外 Abort （中止）， Cancel （取消）

點選執行後，來到返回的頁面，這個時候在Charles可以檢視返回的資料。也可以對其進行修改，好了之後 點選 Execute