APP 抓包和微信小程序抓包-Charles 的精简使用教程
- 2021-09-25 更新
- 2019-07-10 更新
- 目标
- 教程
-
- 一、安装 Charles
- 二、Charles 简介
-
- (1)Charles 欢迎页面
- (2)基础功能按钮
- (3)抓包内容显示方式
- (4)过滤抓包内容
- 三、手机配置 Charles 代理
- 四、解决配置 Charles 代理之后手机无法上网的问题
- 五、手机 APP 抓包
-
- (1)对 “花生地铁” APP 进行抓包。
- 六、微信小程序抓包
-
- (1)安装 SSL 证书
-
- 1、Charles 上安装 SSL 证书
- 2、手机安装 SSL 证书
- (2)配置 Charles 的 SSL
- (3)对微信小程序“猫眼电影”进行抓包
- 总结
2021-09-25 更新
- 博主近期也有APP抓包的需求,不过换了一个工具 Fiddler Everywhere。新工具可能 颜值 (这里纯粹是讲UI更炫酷)更高一些
2019-07-10 更新
- 部分机型依然成功。最近有很多小伙伴反馈 HTTPS 不能进行抓包了,于是博主再进行了一次测试:
目标
- 抓取移动端项目的前端页面和后台的交互数据,对请求信息和响应内容进行分析。
- 普通手机 APP 的前端页面和后台一般是通过 HTTP 请求进行交互。
- 微信小程序的前端页面和后台一般是通过 HTTPS 请求进行交互。
教程
一、安装 Charles
在官方网站下载最新的安装包,然后点击运行,在弹出的安装向导中,根据提示进行操作即可顺利完成安装。过程很简单,所以这里进行不详细介绍。当前最新的版本是 charles-proxy-4.2.7-win64.msi 。
二、Charles 简介
(1)Charles 欢迎页面
(2)基础功能按钮
(3)抓包内容显示方式
- Sequence 形式。可以看到全部请求,默认以数据请求的顺序来显示,最新的请求显示在最下面。如下图所示:
- Structure 形式。可以很清晰的看到请求的数据结构,请求信息根据域名划分。具体如下图所示:
(4)过滤抓包内容
- 通过 filter 框 进行过滤(推荐使用)。不管是Sequence 还是 Structure 显示方式,都可以通过下方的 filter 框进行过滤:
- 通过 Recording Settings 设置过滤条件。具体如下图:
三、手机配置 Charles 代理
- 需要手机和运行 Charles 的电脑在同一个局域网内。
- 启动 Charles,点击 Proxy-Proxy Settings,查看代理端口:
- 在命令提示符窗口,执行 ipconfig ,查看电脑的IP:
- 在手机连接的 WLAN 中,设置代理信息。从前两步中,可以看到Charles 的代理端口为 8888,电脑IP为 192.168.1.101。
四、解决配置 Charles 代理之后手机无法上网的问题
如果代理配置完成之后,出现手机无法上网的情况。
需要检查下面几个地方:
五、手机 APP 抓包
(1)对 “花生地铁” APP 进行抓包。
六、微信小程序抓包
(1)安装 SSL 证书
由于微信小程序的前端页面和后台交互,基本上都是基于 HTTPS ,所以需要先安装 SSL 证书。
1、Charles 上安装 SSL 证书
2、手机安装 SSL 证书
- Charles 建议的安装方法。
- 其他方法。
(2)配置 Charles 的 SSL
- 通过 Proxy-SSL Proxy Settings 打开窗口:
- 在弹出的窗口中,选择 Enable SSL Proxy,并设置要代理的域名。本示例是要对微信小程序“猫眼电影”抓包,所以配置了 api.maoyan.com 和 ad.maoyan.com。
- 如果要匹配的域名比较多,配置麻烦,可以不填域名和端口内容,直接点击OK
-
(3)对微信小程序“猫眼电影”进行抓包
- 在微信钱包-第三方服务中,打开“猫眼电影”。
- 查看 Charles 中的抓包情况:
总结
一个精简的 Charles 教程到此结束。
如果有什么问题,希望可以给我留言。
最后祝大家工作顺利。