Charles輔助除錯介面

2021-08-04 22:30:27 字數 1584 閱讀 7815

前面有一篇講了關於抓包工具

,這裡再寫寫我是怎樣用charles輔助除錯介面。.

這篇文章寫了個頭,沒時間就一直放著沒寫,今天剛好週六,也早點下班了(苦逼的週六加班黨),就把這個寫完吧,其實這兩天有點感冒頭暈暈的,盡量不寫錯吧。

經常會有這樣的場景:

場景二: 乙個請求發起直接返回各種看起來奇葩的錯誤,檢查半天**好像也沒問題,直接就大嘴巴叫後台的兄弟服務掛了,後台一看,好好的啊…

場景三: 開發新的功能,介面也先大概定義好了,可後台兄弟忙著和妹子聊天(^),介面還沒寫好啊…,雖然可以在**裡寫死demo資料,但後台介面寫好了,難道又去改一遍?有木有更好的方式呢?先把請求都寫好,能正常返回資料,解析好結果繫結到介面,最後介面寫好了直接就對接,charles可以幫助我們這麼幹。

場景四: 除了wifi我們還要測試2g,3g,4g等各種複雜網路條件下的情況,可手機上網資費不便宜啊,可以讓charles限制網速模擬網路環境。

就列舉這麼幾個場景吧,下面進入本文的正題

一.設定**抓包

開啟charles軟體,選擇proxy->proxy settings到如下介面:

以iphone手機為例,開啟: 設定->無線區域網,選擇乙個網路進入,滾動到下面看到有』http**』模組,選擇手動模式,按照如下圖填好配置.

二.模擬慢網速請求

如果要針對某乙個位址限速,在hosts裡可以add要限速的url.

三.截獲請求轉到指定的位址

比如api請求的是 

, 但是後台這個沒寫好,我們就臨時轉到乙個本地位址

選擇tools->map local開啟設計介面,設定好如下圖:

四.截獲請求直接返回本地的檔案內容

如果懶得搭server環境,就可以用這種方式了,這個可以直接把乙個請求返回內容對映到本地檔案,例如把

對應的請求返回內容對映到本地檔案user_info.json,

選擇tools->map local開啟設計介面,設定好如下圖:

五.截獲請求修改請求資訊

上面的方式是直接替換了整個,哪如果只想截獲並做一定修改怎麼處理呢?

選擇tools->rewrite,設定如下圖:

六.設定請求的黑名單

不想某些請求發起,直接返回404,可以用黑名單

選擇tools->black list,設定如下圖:

七.dns欺騙

dns欺騙,說簡單點就是把網域名稱解析到乙個假的ip,

可以不必一定要用locahost,127.0.0.1,裝個b把127.0.0.1對應到baidu.com來除錯~

選擇tools->dns spoofing,設定如下圖:

八.快取請求返回的內容

上面這些是我在開發過程中經常會用到的,基本能很好解決和後台聯調的問題,我沒有把每個地方都列的很細,基本都是只提到點,相信大家知道這個點去操作都很容易就上手,但我更想說的是,這些都只是工具,最好還是能了解web原理基礎,理解http協議。

另外介紹乙個模擬請求的工具,chrome下的外掛程式postman,很方便就能模擬post,get,put,delete等請求,模擬文字,上傳檔案請求,附上一張截圖:

有了這些工具的輔助,相信你對介面的除錯再也不會叫苦啦…

總算寫完了,又暈又困,睡覺去~

前端除錯利器 Charles

docs 開發之 charles 配置指南 2.啟用 使用公司正版license 啟用 安裝證書 點選證書並選擇 始終信任 證書不被信任可能會導致 開發時部分資源檔案無法載入。設定 將你需要 https的 新增進去 本地除錯 如果你想 bear test 到本地,你需要 點選map remote 新...

Charles 的介面詳解

後續補充.一 主導航欄 1.file edit view proxy tools window help 2.view欄 1 structure檢視是將網路請求按訪問的網域名稱分類 2 sequence 檢視是將網路請求按訪問的時間排序 二 主介面介紹 一 紫色區 工具的主導航欄 從左至右的圖示解釋...

儲存過程輔助除錯

程式呼叫儲存過程,方便簡潔,而且如果邏輯有問題,修改儲存過程就行,沒有必要對程式進行公升級,這個是最大的好處。但是現實中,儲存過程往往也會出現一些問題.現在談談怎麼用輔助方式來發現儲存過程的一些技巧.1 別名。假如正式生產環境下,客戶發現你的程式有問題,你環境程式呼叫的儲存過程proc a有問題。你...