配置Charles 設定手機代理並允許https請求

前言

• 在h5開發除錯時，為實現手機app訪問localhost地址，可以使用ip地址的方式，但一般公司app出於安全考慮，會限制只能訪問其自有域名（例如美團app只能訪問xxx.meituan.com等）。因此，將localhost對映到xxx.meituan.com，並通過charles代理實現手機掃碼訪問

步驟

1. 用手機代理訪問某網頁
   • vim /etc/hosts 加一行：127.0.0.1 xhy.meituan.com
   • Charles--Proxy--Proxy Settings--Enable transparent HTTP proxy
   • 手機：設定--wifi--配置代理--手動代理
     • 伺服器：電腦的ip地址
     • 埠：8888
   • 手機瀏覽一個網頁，charles彈窗點選Allow
     • 若忘點選或沒有彈窗，則重啟電腦 或 在Proxy--Access Control Settings中新增：0.0.0.0/0
2. Charles 設定允許抓https包：
   參考連結：https://blog.csdn.net/yangmeng13930719363/article/details/51645435

   • 電腦

     • 配置 Charles 根證書

       • Help--Install Charles Root Certificate

       • 之後會彈出鑰匙串，如果不彈出，請自行開啟鑰匙串，如下圖：
         

       • 系統預設是不信任 Charles 的證書的，此時對證書右鍵，在彈出的下拉選單中選擇『顯示簡介』，點選使用此證書時，把使用系統預設改為始終信任，如下圖：
         

     • 配置SSL Proxy：Proxy--SSL Proxy Settings，填寫 Host: * Port: 443

   • 手機

     • 在移動裝置上配置證書

       • Help--SSL Proxying--Install Charles Root Certificate
       • 開啟手機瀏覽器（safari），輸入charlesproxy.com/getssl 會彈出如下介面，點選“安裝”
         

     • 手機信任證書：通用->關於本機->證書信任設定->CA勾選

3. 在chrome中新增二維碼掃描外掛，訪問網址時，點選二維碼即可通過手機掃描