前言

Charles是mac上一款比较好用的抓包工具,那么我们什么情况下需要用到抓包工具呢?比如我想查看一个接口请求的参数、返回值,还有移动设备上的http/https请求。

Charles是一个HTTP代理服务器,HTTP监视器,反转代理服务器,当浏览器连接Charles的代理访问互联网时,Charles可以监控浏览器发送和接收的所有数据。它允许一个开发者查看所有连接互联网的HTTP通信,这些包括request, response和HTTP headers (包含cookies与caching信息)。

SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。

主要功能

  • 支持SSL代理。可以截取分析SSL的请求。

  •  支持流量控制。可以模拟慢速网络以及等待时间(latency)较长的请求。

  •  支持AJAX调试。可以自动将json或xml数据格式化,方便查看。

  •  支持AMF调试。可以将Flash Remoting 或 Flex Remoting信息格式化,方便查看。

  •  支持重发网络请求,方便后端调试。

  •  支持修改网络请求参数。

  •  支持网络请求的截获并动态修改。

  •  检查HTML,CSS和RSS内容是否符合W3C标准。

一、安装charles for mac

官网:https://www.charlesproxy.com/latest-release/download.do

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第1张

 

下载好后,解压,将安装包拖到应用程序里,双击进行安装,打开Charles后会看到提示还有30天使用期限

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第2张

没关系我们可以使用激活码!

二、激活charles

Charles激活码:

Registered Name: https://zhile.io

License Key: 48891cf209c6d32bf4

参考:https://blog.csdn.net/qq_25821067/article/details/79848589

激活码使用步骤:

选择菜单---> help---> register..... ---->输入账号和key提交破解成功就可以正常使用啦!

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第3张

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第4张

 

三、基本使用方法

1、抓浏览器网页请求 —— 配置网页代理

其实浏览器的请求一般用浏览器的开发者工具就可以,当然charles也可以做到,使用方法呢,也很简单

将你链接的网络,配置网页代理,注意地址为你本机的ip地址,可以通过,ifconfig查看,

 macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第5张

我的是这个样子,然后打开网页,charles就会弹出弹窗提示你,是否allow哈哈。当然allow,搞定,当当当,可以愉快的抓请求了

 macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第6张

 

2、抓移动端数据包http请求 ———— 配置移动端代理

  • 手机和电脑连接同一网络
  • 获取电脑ip、端口:在电脑上打开charles,查看电脑的ip地址------->  ifconfig
  • 在手机上配置代理,手机的 网络里,找到链接的wifi,添加代理,将手机的服务器和端口设置为电脑ip和端口
  • 保存后,charles会弹出弹窗提示allow,同意,又可以愉快的抓包了

1、设置PC端代理端口号

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第7张

 

设置端口号如:8888(也可更改,手机设置代理输入一致即可)

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第8张

 

2、设置手机端代理端口号

查看IP地址

手机连接与Mac相同的无线网内,查看当前Mac IP地址

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第9张

 

PS:也可直接option+wifi查看

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第10张

 

3、iOS手机代理设置

设置-无线局域网,进入已连接WiFi手动设置(端口需与PC端设置端口号一致)

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第11张

4、安卓手机代理设置

设置-WLAN,进入已连接WiFi手动设置(端口需与PC端设置端口号一致)

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第12张

不同安卓手机弹出设置代理入口不同,如果进入网络详情页无代理项,可在WLAN列表长按wifi名称弹出代理设置如下:

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第13张

 

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

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第14张

3、抓https

安卓:把需要抓取的接口配置一下,或者抓取全部借口

IOS:需要安装Charles SSl证书 

安卓手机就很方便了,直接就可以不用配置,什么,但是要把要抓的接口配置一下,比如,我想抓这个接口,我就要配置成可抓取的,具体如图

 macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第15张

 

IOS手机(牛X的苹果惹不起)

ios需要安装证书(安卓不用):进入Charles-》Help-》SSL Proxying-》Install Charles Root Certificate ,会打开证书,安装进去 

手机---设置----关于手机-----证书信任设置----勾上刚才安装的

 macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第16张

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第17张

 

 

然后想抓那个接口,重复上边操作的就可以啦哈哈,也可以配置我想抓取全部的接口,如图

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第18张

1、PC端SSL设置

选中Proxy→SSL Proxying Setting

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第19张

 

开启SSL代理,并添加信任地址

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第20张

 

add添加方法

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第21张

四、简单功能了解

视图 Structure 和 Sequence

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第22张

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第23张

 

设置为列表方法 

设置->Preferences->Viewers

 macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第24张

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第25张

 

清除和暂停

清除是清除所有已经抓到的全部请求

 macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第26张

暂停是停止抓取数据,保留之前抓取的数据

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第27张

过滤 Focus

设置代理后,抓取到手机的各种请求,很多是不需要的,因此需要过滤下请求

选择需要的请求右键选择Focus

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第28张

或者抓包列表底部filter输入需要查看的请求关键字

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第29张

重复请求 Repeat/Advanced Repeat

tools→ Repeat/ Advanced Repeat (可做简单的并发压测)

repeat 单次重复请求

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第30张

 

 Advanced repeat 多次重复请求

如某个接口共需要请求20次,单次并发请求10个,设置如下

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第31张

 

断言 Breakpoints

测试或者开发中有些场景,可能需要手动造很多数据才能发现问题,那么mock替换JSON返回值这个功能就非常实用了,右键请求url,选择Breakpoints,则默认添加该请求入接口断言列表

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第32张

 

或者Proxy→Breakpoints Settings

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第33张

 

添加需要断言的请求url如下:

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第34张

 

设置断言成功后,重新发起请求,状态变为可编辑状态,进入请求参数or返回参数的修改

修改请求参数↓,设置成功后点击底部“Execute”进入下一步修改返回参数

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第35张

 

修改返回参数如下,如title“年糕妈妈商城”需要修改成改成“AAAA”,直接在JSON Text中编辑

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第36张

 

修改后如下:

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第37张

 

最后放行“Execute”,如果是手机端发起的请求,mock修改后前端页面就会展示修改后的数据啦!是不是很方便!如果想界面测列表几十条数据的功能点,可以省去数据库或者后台造数据的时间,直接txt造几十条json数据就可以啦!(PS:修改参数手速要快哦~因为一般情况下,为了用户体验,大部分页面都会兼容一定时间内接口无响应,显示默认友好提示的空页面,所以替换的json可以事先在json编辑器中或者txt中编辑好,之后直接复制粘贴就可以啦~)

 

重定向 Map Remote

如果在测试过程中,需要切换host不同的环境来测试,那么替换host功能就可以实现,不需要手动再重新打包更改域名,打开Charles→Tools→Map Remote→点击ADD

如下如所示方式添加即可

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第38张

 

网速模拟  Throttling

Proxy-Throttling勾选Enable Throttling启用网速模拟,可选择内置的一些带宽设置或自定义设置,保存后可以点击主界面的macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第39张按钮开启/禁用慢网速功能

配置含义:

Bandwidth(带宽)、Utilistation(利用百分比)、Round-trip(往返延迟)、MTU(字节)

macOS Charles 4.x版本的安装、激活、使用以及软件功能了解 随笔 第40张

以上都是Charles常用的基础功能, 其实还有很多其他更有趣功能,可自行摸索~Charles可以说是测试之路上排查问题找问题非常实用的工具啦!测试必备哦~

参考:macOS Charles 4.x版本的安装及使用(含破解激活)

         MAC下最好用的抓包工具--charles简单操作教程

         Charles 从入门到精通

扫码关注我们
微信号:SRE实战
拒绝背锅 运筹帷幄