相信大家曾經都是Window的使用者，作為前端哪能沒有一款抓包工具，抓包工具可以非常便捷的幫助我們分析接口傳回封包資料，快速定位問題。
曾經橫掃window使用者的Fiddler便是我們的摯愛，然而，作為前端開發者還是習慣用高大上的MAC進行開發，本次部落格将給大家介紹MAC電腦如何安裝抓包工具，以及如何設定HTTPS連接配接的抓取。
一、下載下傳Charles 4.0 版本的軟體。
連結: https://pan.baidu.com/s/1jI5j0O2 密碼: u5r2
下載下傳完成後，輕按兩下安裝即可，直到安裝成功，如下圖：
二、破解Charles4.0軟體
中國使用者大都喜歡搞破解版，因為不破解，就沒法長期使用，除非我們願意花錢，然~~~~~~
1. 破解之前，請大家先下載下傳破解需要的jar包：
2. 點選Finder，在左側找到應用程式菜單，并在右側找到安裝的抓包軟體，如下圖：
3.對着Charles軟體，滑鼠右鍵顯示包内容，如下圖：
4.打開之後，會看到Contents檔案夾，如下圖：
5. 繼續打開Contents檔案夾，裡面如下：
6. 繼續打開Java目錄，裡面存放的有很多jar包，将下載下傳下來的jar包拷貝進去覆寫即可，然後關閉軟體，重新打開（如果軟體本身就沒有打開，則直接打開即可）。
到此抓包工具Charles已經破解成功，大家切記版本，不同的版本，破解方式不一樣，我用的是4.0的版本，大家下載下傳的也是4.0的版本，千萬要對号入座。
三、接下來，我們開始抓取Http請求，分别包括PC抓取和手機抓取
1.Chrome浏覽器本身的開發者工具已經非常實用，打開開發者模式，點選NetWork即可抓取。
2.手機端配置代理，抓取手機端通路的Http請求。
a.檢視目前電腦IP
b.打開Charles軟體，選擇Proxy Settings 進入到代理設定界面
Port預設為8888，勾選Enable transparent HTTP Proxying
c. 打開手機，進入到設定，選擇無線區域網路 ，找到目前連接配接的WIFI，輸入IP和端口，如下：
配置完成後，打開浏覽器，随意輸入一個網址看看是否能加載成功，如果加載正常，說明配置正确
緊接着，我們就可以抓取任意web頁面的http請求。（無法抓取Https請求）
3.抓取HTTPS連接配接的請求
1）安裝SSL證書到Iphone手機裝置
點選 Help -> SSL Proxying -> Install Charles Root Certificate on a Mobile Device
Iphone手機出現彈窗得到位址 chls.pro/ssl
在手機Safari浏覽器輸入位址 chls.pro/ssl，出現證書安裝頁面，點選安裝
手機設定有密碼的輸入密碼進行安裝
注意1：Safari浏覽器輸入這個網址chls.pro/ssl安裝不了證書的情況,
a.設定好手機HTTP代理
b.電腦上Charles要開着
注意2：iOS 10.3系統
需要在 設定→通用→關于本機→證書信任設定 裡面啟用完全信任Charles證書
Android手機安裝https證書時輸入網址：然後在手機浏覽器中通路手機http://charlesproxy.com/getssl
出現安裝證書提示，随便打個名稱 比如android，選擇WLAN（這裡Android，一定要選WLAN而不是VPNxxx），确定
(2）Charles設定Proxy
Proxy -> SSL Proxying Settings...
勾選Enable SSL Proxying,點選Add
到此HTTPS已經配置成功。
近期剛上線一門基于微信小程式、公衆号和小程式雲開發的微信授權、分享和支付的專項課程，如果你對支付感興趣可以考慮入手：
https://coding.imooc.com/class/343.html
React全家桶開發通用的背景管理系統：
https://coding.imooc.com/class/236.html
Vue2.0+Vue-Router+Vuex+Node+Mongo開發全棧商城課程
https://coding.imooc.com/class/113.html
慕課講師：河畔一角
講師位址：http://www.imooc.com/u/1343480