写在前面

  本文以Windows + IOS + Charles为例，简单说明抓包的原理，配置步骤以及遇到的坑。

一、场景描述

  测试人员在JIRA上给我指派了一个Bug，说是前端uniapp会员展示页的数据不正确。前端是个小程序、HTTPS加密，无法像H5一样可以直接复制出来链接地址。由于是临时去看这个Bug，我没有开发者账号，无法直接使用微信开发者工具调试。那么接下来要解决的问题就是如何才能拿到会员页具体请求的URL？

解决办法，无外乎2种：
1、直接找前端问（简单快捷，但麻烦别人，再遇到问题还得找）
2、使用工具抓包（自己动手，丰衣足食，一劳永逸）

抓包工具，网上有很多，配置教程也很多（良莠不齐），这里我归纳整理了一下，以Charles为例进行说明。

二、具体步骤

先简单说一下原理，让首次接触抓包工具的同学有个整体的概念。
1、下载并安装Charles抓包工具，开启代理端口，作为一个代理服务器。
2、手机连接WiFi（同Windows一个WiFi），给手机的WiFi配置代理，服务器和端口号为Charles代理服务器

这样，所有手机端的请求（包括手机登录小程序进入相应页面）都会经过Charles代理，也就能抓到包。

1.环境说明

2.下载Charles安装

进入Charles官网下载页面，选择最新版Windows x86_64（msi），下载安装即可。
软件默认是免费试用，可进入在线破解进行破解。

3.Charles开启代理

Proxy-》Proxy Settings…，填写端口号：8888

4.手机端设置代理

4.1Windows端操作

进入cmd窗口，输入ipconfig，找到WLAN的ip地址：10.100.8.239

4.2手机端操作

设置-》无线局域网-》点击和Windows连接相同的网络（zhht-office）-》配置代理-》手动-》填写服务器（电脑WLAN的ip地址:10.100.8.239）、端口（Charles上配置的端口:8888）

此时，HTTP类的请求就可以在Charles上抓到，但是HTTPS类型的，地址是unknown，因为HTTPS是加密传输。

查看Overview，可以看到Notes: SSL Proxying not enabled，那接下来，我们就去开启SSL Proxy。

5.配置SSL

5.1Charles安装SSL证书

Help-》SSL Proxying-》Install Charles Root Certificate

点击安装证书（笔者这里已经安装Charles Proxy CA）

选择存储位置-》当前用户

将所有证书都放入下列存储-》受信任的根证书颁发机构-》完成

5.2Charles配置SSL Proxy

勾选Enable SSL Proxying，在Location中add Location，Host为*，Port为*

注意：这里笔者刚开始添加了443端口（HTTPS默认端口号），但是，不好使（可能是网站更换端口号），将port换成了*，可以正常访问

5.3手机端安装SSL证书

根据提示，用浏览器访问chls.pro/ssl，下载证书，允许访问

通用-》VPN与设备管理-》选中Charles Proxy CA-》安装

通用-》关于本机-》证书信任设置-》启用

再次访问，至此，就可以愉快地玩耍了。具体软件里面的功能，大家可以自行探索。

三、参考资料

十分钟学会Charles抓包
Mac下抓包工具Charles使用

写在后面

  如果本文内容对您有价值或者有启发的话，欢迎点赞、关注、评论和转发。您的反馈和陪伴将促进我们共同进步和成长。