抓包
簡述
在網路應用如後端系統，app，小程式等的開發過程中，免不了介面可能會報錯，但是一般在app中或者小程式中沒有便捷的console控制檯，而且線上環境也不會開啟除錯模式，所以想看一下介面的響應就顯得比較麻煩，最近，博主就遇到小程式介面報錯，想檢視卻抓不了包詳情的問題:(。每次都是找測試同學，但是測試同學也有自己的事情，所以就想著自己抓包。
以前在windows電腦下，用過fidder工具來經常做安全測試，現在用mac電腦，fidder目前也已經支援mac系統了好像，但奈何有點貴，而且還未找到免費的用一哈，所以就換了一個Charles的工具，實戰操作了一番，在此記錄一下，幫助有需要的人。
環境裝備
此處羅列的是個人的配置，其他參考就行
- mac os 11.1，無線網連線
- Charles軟體安裝，版本：4.6.2
- ios14裝置，連線同一無線網
開始
說明：如果只是抓取本機的http請求，那麼開啟Charles自動配置就可以實現抓取，如果需要抓取https的介面或者抓取手機上的網路請求，參考下面步驟操作
證書安裝
Help --> SSL Proxying --> Install Charles Root Certificate
點選上述選單後會進入到鑰匙串裡：
如果不是完全信任名稱旁邊的圖示會是紅色的。雙擊charles鑰匙串，選擇【顯示簡介】，將信任改為始終信任；如下
SSL代理配置
Proxy --> SSL Proxy Settings
先勾選Enable SSL Proxying，然後配置抓取路由，Add點選
Host: *
Port: 443
- 標識所有網址都抓取，443代表Https，當然此處的host可以配置成自己想抓的網站地址字首只抓取特定網站
至此，電腦端https就可以實現抓取了，可重新抓取試試。
如果想要實現抓取手機上App端或者小程式端的介面怎麼辦呢？請繼續參考下面
開啟代理
勾選Enable transparent HTTP proxying，然後下方的埠port預設為8888，和本機埠不衝突佔用就行，我這裡填的是8889，記住這個埠號
手機端配置
設定手機代理
設定手機代理需要注意手機與電腦連線的是同一個wifi，保證在同一區域網內即可，檢視電腦端的IP地址，mac下進入命令視窗輸入ifconfig（或者在設定->網路中檢視）
手機上點選連線上的wifi，找到代理設定，不同手機可能方式不同哈，然後選擇手動，就剛剛電腦上的IP填入到此處，charles中配置的埠號填入到這裡，儲存，代理就配置好了。
恭喜，到這裡的話，手機上http請求就可以實現抓取了
手機上安裝證書
要想實現手機上的https介面也可以抓取，還需要配置一下。如下，點選 Help --> SSL Proxying --> Install Charles Root Certificate on a Mobile Device or Remote Browser，接著會彈出一個info框，上面指示了手機上需要配置的ip和埠等提示資訊。
手機下載證書，將chls.pro/ssl複製到瀏覽器中，會提示安裝證書，這裡安裝證書按各自手機型號安裝就可以。安裝好只好，一定要記得去將證書設定為信任模式，比如ios下，去設定 -> 通用 -> 關於本機 -> 證書信任設定 開啟信任
OK，到這裡就已經配置完成了，就可以實現在電腦端抓取手機端的http/https介面，下面來看下效果；
問題總結
抓取顯示unknow或亂碼等問題
出現這個問題的可能原因：
- 首先檢查證書配置是否正確，手機端以及電腦端的；
- 是否已經信任證書；
- 電腦端Charles代理的埠是否一致；
還有其他問題可以參考這裡，unknown、亂碼問題等
這麼一操作，就不用麻煩測試同學了，後續移動端介面的問題，可以自己抓包排查一下啦~