配置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中添加二維碼掃描插件，訪問網址時，點擊二維碼即可通過手機掃描