本篇將介紹如何設定 Charles 並使用 Charles 進行 http/https request 的攔截
某些事情，用攔截器其實挺方便的，比方說可以把攔截下來的 api entry point, request content, headers 透過某種方式使其變成可以 daily run 的 api test job
有幾個地方需要設定
- Windows
- Mobile (iOS) CA設定
- mobile wifi proxy 設定
廢話不多說 本次使用的就是 Charles
主要可以透過 proxy的方式來debug web/moblie 等裝置用的工具
首先到官網把 Charles下載下來，我使用的是試用版，專業版需要付費~
但個人目前使用試用版就夠惹
https://www.charlesproxy.com/download/
Windows 設定
step 1
Help -> SSL Proxying -> Install Charles Root Certificate
step 2 安裝憑證
存放位置使用目前使用者即可
憑證存放區選擇受信任的憑證授權單位
按下完成
就會出現匯入成功的畫面
可以到控制台右上角輸入憑證 -> 點選管理使用者憑證
再到受信任的跟憑證授權單位確認 Charles Proxy CA是否有成功匯入
Mobile (iOS) CA設定
Step 3 mobile 憑證安裝
Help -> SSL Proxying -> Install Charles Root Certificate on a Mobile or Remote Browser
點開後即可看到提示
在 iOS 請使用 safari 開啟並至 chls.pro/ssl 進行憑證下載
接下來就照以下步驟進行設定
這樣就好了嗎?
還沒
iOS比較嚴謹 所以還要執行以下步驟
mobile wifi proxy 設定
step 4 wifi proxy 設定
到 iPhone的 wifi設定 -> HTTP 代理伺服器 -> 設定 IP 及 連接埠
自己的 IP 可以在charles 的help中取得
Hyper-V Virtual Ethernet Adapter #3 的是虛擬的，所以我是選下面那張實體的IP Address (一般應該只會有一個network Interface)
IP 找到之後，就可以照著以下的步驟進行設定 (charles 的預設連接埠是 8888)
這樣就好了嗎?
還沒
接著你會發現攔截到的內容都是亂碼，如下圖
這是因為你的 proxy沒有對SSL進行解密，所以對這一個 request 按下右鍵 然後 Enable SSL Proxying
按下去之後 mobile 進行重整的動作 就會一樣攔截到 google的 request，這時就不是亂碼了
但是每次切換不同的domain還要重新按右鍵然後enable ssl proxying
真的很麻煩啊...
所以可以直接利用 charles 的設定來避免這個麻煩
按下 Add -> Host 輸入 * -> Port 輸入 443 (用於HTTPS的 port)
按下 OK 後 就完成了~
文章記錄於此，若有錯誤煩請各位大大糾正 <(_ _)>
