《爆肝整理》保姆級系列教學-玩轉Charles抓包神器教學(8)-Charles如何進行斷點偵錯

1.簡介

  Charles和Fiddler一樣也有個強大的功能，可以修改傳送到伺服器的封包，但是修改前需要攔截，即設定斷點。設定斷點後，開始攔截接下來所有網頁，直到取消斷點。這個功能可以在封包傳送之前，修改請求引數；在收到應答包，在js解析和瀏覽器渲染之前，修改返回結果。有了這個功能，開發者就可以修改不同引數測試server，同時也可以修改返回包測試自己的js函數，或測試頁面渲染。那麼怎樣進行Charles斷點操作呢？下面宏哥將為大家講解一下。

2.Charles設定斷點

Charles設定斷點的具體操作步驟如下：

2.1方法一

1.啟動Charles後，點選Proxy -> Breakpoint Settings...  ，如下圖所示：

2.勾選 Enable Breakpoints ，如下圖所示：

3.點選Add ，新增 斷點規則 ，如下圖所示 ：

 斷點規則欄位說明：

Scheme : 攔截進行斷點的介面方法，選項有 GET 和 POST
Protocol： 協定，選項有HTTP 和 HTTPS
HOST ： 域名，或者IP地址
Path ： 路徑
Query：URL 中 ？ 後面拼接的查詢引數
Request ： 在傳送請求的時候打斷點，可以修改請求內容，之後再把請求轉傳送給伺服器
Response：在請求響應回來的時候打斷點，可以修改響應內容，之後再把響應結果轉發給使用者端

【敲黑板知識點】
以上欄位支援萬用字元，比如說Path ，填寫 /test/api1 ，只支援攔截/test/api1 這一個介面，是全匹配，比如無法匹配 /test/api1/apis ；如果填寫/test/* ，就能夠匹配以/test/開頭的所有介面，比如 /test/api1 、/test/api1/apis
所有的欄位都是選填，如同我們常規理解的篩選條件一樣，但是為了規則的有效性，Request 和 Response 必須二選一。

2.2方法二

1.介面處 滑鼠右擊，選擇breakpoints（允許本介面使用breakpionts功能），如下圖所示：

2.進入Breakpoint Settings...裡，我們看到設定也新增到這裡，雙擊設定規則，看到部分已經填好了，我們補充剩下的即可。request和response兩個都勾選上了，如下圖所示：

3.Charles 斷點實踐

找了半天沒有免費的介面來演示實踐，索性自己用python簡單寫一個mock介面算了。有時候測試需要呼叫第三方介面進行測試，但是第三方介面沒有提供時，我們可以通過mock介面模擬第三方介面。

3.1安裝第三方模組

通過pip install flask安裝（flask是一個輕量級的web開發框架）。如下圖所示：

3.2flask模組的使用

flask模組有如圖四個部分，static是靜態檔案，存放js指令碼、CSS、圖片之類的檔案；templates存放HTML檔案，app.py存放介面。

 3.2.3瀏覽器存取介面

在瀏覽器輸入相應網址後顯示如下圖所示：

3.3動態路由

動態路由就是輸入不同的URL，會有不同的內容返回。靜態路由是永遠一個介面對應著一個固定的URL，上面程式碼中的路由就是靜態路由。

3.3.1參考程式碼

# coding=utf-8