20190707 - FE：使用 Charles 在 IphoneX 上抓包

1. 爲什麼要用 Charles 抓包？

在工作場景中，我們需要確定一個網頁在某個事件下發出的請求及其迴應，可以使用chrome輕易實現。但是，當我們要確定一個 APP 發出的請求及其迴應的內容時，但往往不能通過瀏覽器的功能獲得。因此，可以使用Charles，採用http 代理的方法，獲得APP的請求及其迴應。本文以 IphoneX 爲例，說明使用 Charles 抓包的一般方法；如有問題，歡迎支指出~☺️

1.1 使用 Charles 前

1.2 使用 Charles 後

1.3 那麼Charles 的作用是？

1. Charles 本質：http 代理服務器（如果只需要抓 https ，還需其它操作，本文暫不涉及。）
2. Charles 意義：用以查看手機端發出的 http 請求
3. Charles 作用：相當於演唱會入口驗票處，每一個要看演唱會的人（http請求）都需要在演唱會入口驗票處拿出門票驗票（被 Charles 捕獲）。

2. 如何使用 Charles？

2.1 操作環境

1. IphoneX 手機
2. MAC 筆記本
3. MAC 版 Charles 4.0.1

2.2 流程

1. 查看MAC本機地址：Help -> local IP Address
   ( 這個就是要在手機上填寫HTTP代理的 服務器名稱 )
2. 代理設置：Proxy -> Proxy Settings -> 查看端口（默認8888）
   ( 這個就是要在手機上填寫HTTP代理的 端口號 )
3. 確保手機和電腦在同一個局域網下，在手機網絡的HTTP代理上設置步驟1和步驟2中的的服務器名稱和端口號
4. 手機正確設置後，會在電腦端自動彈出確認連接的彈框，如下圖：點擊Allow，即可使得 Charles 完成代理。

2.3 功能簡介

1. 視圖：

2. 工具
3. 分析請求

3. 那些年我踩過的 Charles 坑

1. 使用 Charles 成功代理之後，可以看到請求，但是請求裏面有亂碼？
   答：那說明有信息加密。問問你的老闆，怎樣解密或者進入開發者模式。