Charles抓包工具的启用

Charles的启用:

   官网 地址：https://www.charlesproxy.com/

介绍:

  1. charles 产品

  2. charles 主要功能

  1. Charles 产品：

    a. Charles是在 Mac 下常用的网络封包截取工具，在做移动开发时，我们为了调试与服务器端的网络通讯协议，常常需要截取网络封包来分析。

    b. Charles 通过将自己设置成系统的网络访问代理服务器，使得所有的网络访问请求都通过它来完成，从而实现了网络封包的截取和分析。

    c. 除了在做移动开发中调试端口外，Charles 也可以用于分析第三方应用的通讯协议。

    d. 配合 Charles 的 SSL 功能，Charles 还可以分析 Https 协议。

    e. Charles 是收费软件，可以免费试用 30 天。试用期过后，未付费的用户仍然可以继续使用，但是每次使用时间不能超过 30 分钟，并且启动时将会有 10 秒种的延时。

    f. 因此，该付费方案对广大用户还是相当友好的，即使你长期不付费，也能使用完整的软件功能。只是当你需要长时间进行封包调试时，会因为 Charles 强制关闭而遇到影响。

  2. Charles 主要功能:

    a. 截取 Http 和 Https 网络封包

    b. 支持重发网络请求，方便后端调试

    c. 支持修改网络请求参数

    d. 支持网络请求的截获并动态修改

    e. 支持弱网测试

    f. 给服务器做压力测试

    g. 修改服务器返回内容

    h. 截取 phone 上的网络封包

    i. 过滤网络请求

适用范围:

  1. 本教程只在 Mac 上进行的正常安装、配置、以及使用

  2. 后边介绍的移动端抓包也是 IOS 系统的操作方法

  3. Windows 和 Android 的操作方法，大同小异于，可借鉴于此，不过具体教程需要后续尝试操作后做记录。

安装:

  1.  去下载

    

  2. 下载后得到`.dmg`文件，正常按照提示安装

  3. 如果想要破解版，网上自行查找 破解方法，很多      

 

配置 (重点部分)：

  如何配置代理:

    1. Charles 基础配置

    2. PC 端代理配置

    3. 移动端代理配置, 分为 IOS 手机代理设置 *  Android 手机代理设置

 

  1. Charles 基础配置：     

    操作步骤：         

    step1:  Proxy --> Proxy Settings --> 设置代理端口 默认：8888（可更改，如需抓取移动端的包 记得代理端口号要一致）

               

 

     step2:  Proxy --> 选中 macOS Proxy ( 以 macOS 自己作为代理服务器 开启)

      
  

  2. PC端 代理配置：     

    做过 Charles 基础配置 后，此时，Charles 已经可以抓取 pc 端 HTTP 的请求了！

  3. 移动端 代理配置：

    前提:

      1. 保证手机与Mac连接到了同一局域网

      2. Charles 已做过基础配置

      3. 查看本机 ip 地址 ​

        法1： Mac 系统偏好 --> 网络 --> 状态查看 ip ​ 

          

         法2：option + 点击 wifi ​ 

          
    

    IOS 手机代理设置：

      1. 找到 `设置 `

      2. 选择 `无线网络`

      3. 点击 `已连接wifi 后边的 "!"`

      4. 进入`网路设置页`

      5. 选择 `配置代理 `

      6. 进入 `配置代理页`

      7. 选择 `手动`

      8. 配置 `服务器`：Mac 上已查看到的 ip

      9. 配置 `端口`：Charles 上已设置的代理端口，必须保持一致 

          
    

    Android 手机代理设置：

     1. 找到 `设置`

     2. 点击 `WLAN`

     3. 找到 `已连接 wifi`

     4. 进入 `网络设置页` （各型号手机进入方式会有所不同，请自行查找使用手机的网络设置页的进入方式）

     5. 选择 `代理`

     6. 选择 `手动`

     7. 设置 `主机名`：Mac 上已查看到的 ip

     8. 设置 `端口`：Charles 上已设置的代理端口，必须保持一致 ​ 以华为手机为例： ​ 

        

  此时，当手机进行网络请求时，Charles 将弹出是否允许连接此代理(选择允许 allow)，之后便可进行http抓包啦！

HTTPS 代理配置 ​:

  上述配置完成后，会发现抓到的 PC上的网络请求 和 移动端上的网络请求，HTTP请求是可以正常查看 request & response 的，但是抓取到的 https 请求全是乱码，此时就要需要做 https代理（SSL代理）的配置了。

  1. Charles SSL 代理配置

  2. Mac 上做 Charles SSL证书认证

  3. 移动端 之 ios 系统做 Charles SSL证书认证

  4. 移动端 之 android 系统做 Charles SSL证书认证

   ------------------------------------------
  1. Charles SSL 代理配置：

    1. 菜单点击 `Proxy`

    2. 点击 `SSL Proxying Settings`

    3. 进入 `SSL Proxying Settings 设置页`

    4. 选中 `Enable SSL Proxying`

    5. 添加信任地址 【host】:443 ( 全信任的话 可以配置 *：443 )

     

 
        

     此时应该还是查看不到 https 的 request && response, 还需要做 Charles SSL 证书的安装！

  2. Mac 上做 Charles SSL证书认证：

    安装 与 信任：

      1. 菜单点击 `help`

      2. 选择 `SSL Proxying`

      3. 点击 `Install Charles Root Certificate`

      4. 此时会出现是否将证书加入到 系统钥匙串中，选择`添加`即可；

       可能因为版本的原因未出现，可在`钥匙串`中去查找 `charles-proxy-ssl-certificate.cer 的证书`

      5. 找到证书后，去`信任该证书`

      6. 双击 `证书`

      7. 弹窗中展开 `信任`

      8. 选择 `始终信任` 

          

 
  此时，Charles 可以抓取到 PC 端的 HTTPS 请求的包了，并且 request & response 不再是乱码啦！

  

  2. 移动端 之 ios 系统做 Charles SSL证书认证：

   安装 与 信任：

    step 1: 安装证书：

      1. 菜单 帮助

      2. 选择 SSL Proxying

      3. 选择 Install Charles Root Certificate on a Mobile Device or Remote Browser

      4. 此时 charles 会出现个弹窗 ( 作用：提示 手机端浏览器访问 `chls.pro/ssl` )，点击 `OK`

      5. 打开 ios 手机 safri 浏览器，访问 `chls.pro/ssl`

      6. 会出现下载文件弹窗，选择 `允许` 

          

    step2 : 证书验证：

      1. 手机 `设置`

      2. 点击 `通用`

      3. 点击 扫描文件

      4. 点击 `安装`

       5. 进入 `警告页`

      6. 点击 `安装`

      7. 进入 `已扫描文件页`

      8. 发现文件由 未验证变成已验证

      9. 点击 `完成` 

        

    step3 : 证书信任：

      1. 手机 `设置`

      2. 点击 `通用`

      3. 点击 `关于本机`

      4. 点击 `证书信任设置`

      5. 进入 `证书信任设置页`

      6. 打开 对 `Charles Proxy CA` 的信任

        

　　　3. 移动端 之 android 系统做 Charles SSL证书认证：     

　　　　安装 与 信任：

　　　　　　同上，机型不同 安装验证和信任过程 可能稍有不同，可网络执行查找；

 

问题总结：

　　问题 1：Charles 抓不到包的情况，

　　　　解决方法：

　　　　　　step 1: 确认 Charles 配置

　　　　　　　　1. 确认 Charles 是否已开启本机代理

　　　　　　　　　　操作：Proxy --> MacOS Proxy 选中 尝试刷新浏览器，如果 charles 还没有抓到包，继续向下看。

　　　　　　　　2. 确认是否已经开始抓取

　　　　　　　　　　操作：Proxy --> Start Recording 打开 尝试刷新浏览器，如果 charles 还没有抓到包，继续向下看。

　　　　　　　　3. 确认 recording setting

　　　　　　　　　　操作：Proxy --> Recording Settings --> 点击 `add` --> 出来弹窗，什么也不填点 `OK` --> 列表中出现 `*` -->点 `OK` 尝试刷新浏览器，如果 charles 还没有抓到包，继续向下看。

　　　　　　　　4. 检查证书安装情况

　　　　　　　　　　操作：打开Mac上的 钥匙串-->搜索charles字样-->已有证书-->检查是否信任-->没信任-->设置`始终信任` 尝试刷新浏览器，如果 charles 还没有抓到包，继续向下看。

　　　　　　　　5. 检查证书已安装，并且信任后还是抓不到包

　　　　　　　　　　操作：重新启动charles 尝试刷新浏览器，如果 charles 还没有抓到包，继续向下看。

　　　　　　　　6. 安装证书 如果已安装，右键删除，如果还没安装那么重新安装

　　　　　　　　　　操作：Help ---> SSL Proxying-->Install Charles Root Certificate-->钥匙串中查找charles CA证书-->设置`始终信任` 尝试刷新浏览器，如果 charles 还没有抓到包，继续向下看。

　　　　　　　　以上操作结束后，基本是可以抓取到包了

        7. 如果要抓取 https 包，再设置下 SSL Proxy 操作：         

          i. Proxy --> Proxy Settings --> 选中 Support HTTP/2

            

                 ii. Proxy --> SSL Proxying Settings --> 选中 `Enable SSL Proxying` --> Include添加 `*:443` 

                

            尝试刷新浏览器，如果 charles 还没有抓到包，继续向下看。

      step 2: 确认本地网路代理配置     

        Mac 上：     

          操作：系统偏好设置 --> 网络 --> 高级 --> 打开 `代理` tab --> 不选择自动代理      尝试刷新浏览器，如果 charles 还没有抓到包，继续向下看。 

            

      step 3: 确认本地浏览器是否配置了其它代理     

        如果有配置的话，设置成系统代理，即可！

 

  问题 2：Charles 配置代理后，浏览器打不开网页，

    解决办法：

     1. 确认本地网络代理配置，不选择自动代理，参考 `问题 1 step 2`;

     2. 确认本地浏览器是否配置了其它代理，如有，设置成系统代理，参考 `问题 1 Step 3`     

  问题3：Charles 抓到的包是 , 多半原因是证书过期了；

    解决方法： 重新安装证书，重新信任

    解决步骤：

      step 1: Charles 删除过期的证书，重置证书：

        操作： help --> SSL Proxying --> Reset Charles Root Certificate...

          

          

 

       step2: 然后钥匙串中删除，原来的过期证书，将新证书添加 "始终信任"：

          操作：打开钥匙串 --> 找到 Charles Proxy CA --> 始终信任     

          

 

      step3: 手机端，重新添加证书，并做证书信任：

          1，首先手机配置好ip和端口

          2，手机端输入网址chls.pro/ssl，下载并安装证书

          3，在手机上对证书进行信任；（这步很重要，不要忘记，不然也还是 unknown）

 

以上为解决在使用 charles 时，常用到的问题！后续遇到问题还会继续收录解决方案！

参考： https://juejin.cn/post/6844903733478817800 https://www.jianshu.com/p/8d3d64e600aa