首发于 樊浩柏科学院

Charles 是在 Mac 下常用的截取网络封包的工具(Win 环境也已支持),在移动端开发过程中,我们常需要截取网络包分析服务端的通讯协议。Charles 将自己设置成系统的网络访问代理服务器,不仅可以提供 SSL 代理,还支持流量的控制、支持重发网络请求、支持修改网络请求参数、支持网络响应截获并动态修改。

安装Charles

从 Charles 的 官方网站 下载最新的安装包,下载晚完成安装即可。

Charles 是付费软件,当然免费状态也可以使用。可以使用如下信息完成注册:

Registered Name: https://zhile.io
License Key: 48891cf209c6d32bf4

如果注册失败,可以尝试 这种方法。

设置成系统代理服务器

由于 Charles 是通过将自己设置成代理服务器来完成封包截取的,所以第一步是需要将 Charles 设置成系统的代理服务器。

启动 Charles 后,菜单中的 “Proxy” -> “Windos Proxy(或者Mac OS X Proxy)”, 来将 Charles 设置成系统代理。如下所示:

配置后,就可以在界面中看到截取的网络请求。但是,Chrome 和 Firefox 浏览器默认并不使用系统的代理服务器设置, 所以需要将 Chrome 和 Firefox 设置成使用系统的代理服务器,或者直接设置成地址127.0.0.1:8888

如果 Chrome 已安装了 Host Switch Plus 插件,则需要暂时关闭。

过滤网络请求

一般情况下,我们只需要监听指定服务器上发送的请求,可以使用如下办法解决:

  • 方式1:在主界面 “Sequence” -> “Filter” 栏位置输入需要过滤的关键字即可。例如输入fanhaobai,则过滤输出只包含 fanhaobai 信息的请求。
  • 方式2:在 Charles 的菜单栏选择 “Proxy” -> ”Recording Settings”,并选择 Include 栏,添加一条永久过滤规则,主要填入需要截取网站的协议、主机地址、端口号。

  • 方式3:右击需要过滤的网络请求,选择 “Focus” 选项即可。

方式 1 和方式 3 可以快速地过滤临时性网络请求,使用方式 2 过滤永久性网络请求。

截取移动设备网络包

Charles 除了可以截取本地的网络包,作为代理服务器后,同样可以截取移动设备的网络请求包。

设置Charles

截取移动设备网络包时,需要先将 Charles 的代理功能打开。在 Charles 的菜单栏上选择 “Proxy” -> ”Proxy Settings”,填入默认代理端口 8888,且勾选 “Enable transparent HTTP proxying” 就完成了设置。如下图所示:

iPhone

首先,通过 Charles 的顶部菜单的 “Help” -> ”Local IP Address” 获取本地电脑的 IP 地址,例如我的本机电脑为192.168.1.102

在 iPhone 的 ”设置“ -> ”无线局域网“ 中,对当前局域网连接设置 HTTP 代理(端口默认为 8888),如下图:

设置完成后,打开 iPhone 的任意程序,在 Charles 就可以弹出连接确认窗口,点击 ”Allow” 即可。

Android

在 Android 上操作同 iPhone,只是某些系统设置方式不一致而已。

截取 Https 包

如果需要截取并分析 Https 协议信息,需要安装 Charles 的 CA 证书。

本地通信信息

点击 Charles 的顶部菜单,选择 “Help” -> “SSL Proxying” -> “Install Charles Root Certificate”,即可完成证书的安装。如下图所示:

建议将证书安装在 ”受信任的根证书颁发机构“ 存储区。

特别说明,即使安装完证书后,Charles 默认是不会截取 Https 网络通讯的信息。对于需要截取分析站点 Https 请求,可以右击请求记录,选择 SSL proxy 即可,如图所示:

移动设备的通信信息

如果在 iPhone 或 Android 机器上截取 Https 协议的通讯内容,需要手机上安装相应的证书。点击 Charles 的顶部菜单,选择 “Help” -> “SSL Proxying” -> “Install Charles Root Certificate on a Mobile Device or Remote Browser”,然后按照 Charles 的提示的安装教程安装即可。如下图所示:

在上述 截取移动设备网络包 为手机设置好代理后,手机浏览器中访问地址http://chls.pro/ssl,即可打开证书安装的界面。安装完证书后,就可以截取手机上的 Https 通讯内容了。注意,同样需要在要截取的网络请求上右击,选择 SSL proxy 菜单项。

如果 SSL proxy 后出现如下错误:

可将证书设置为信任即可,例如 iPhone 下 “设置” -> “通用” -> “关于本机” -> “证书信任设置” 下:

模拟慢请求

在做 App 开发调试时,经常需要模拟慢请求或者高延迟网络,以测试应用在网络异常情况变现是否正常,而这使用 Charles 就轻松帮我们完成。

在 Charles 的菜单上,选择 “Proxy” -> ”Throttle Setting” 项,在弹出的窗口中,可以勾选上 “Enable Throttling”,并且可以设置 Throttle Preset 的类型。如下图所示:

当然可以通过 “Only for selected hosts” 项,只模拟指定站点的慢请求。

修改请求内容

有时为了调试服务端的接口,我们需要反复尝试不同参数的网络请求。Charles 可以方便地提供网络请求的修改和重发功能。只需在该网络请求上点击右键,选择 “Compose”,即可创建一个可编辑的网络请求。

我们可以修改该请求的任何信息,包括 URL 地址、端口、参数等,之后点击 “Execute” 即可发送该修改后的网络请求。Charles 支持我们多次修改和发送该请求,这对于我们和服务器端调试接口非常方便,如下图所示:

修改响应内容

有候为方便我们调试一些特殊情况,需要服务器返回一些特定的响应内容。例如数据为空或者数据异常的情况,部分耗时的网络请求超时的情况等。通常让服务端配合,构造相应的数据显得会比较麻烦,这个时候,使用 Charles 就可以满足我们的需求。

根据不同的场景需求,Charles 提供了 Map 功能、 Rewrite 功能以及 Breakpoints 功能,都可以达到修改服务器返回内容的目的。这三者在功能上的差异是:

  • Map 功能适合长期地将某一些请求重定向到另一个网络地址或本地文件。
  • Rewrite 功能适合对网络请求进行一些正则替换。
  • Breakpoints 功能适合做一些临时性的修改。

Map功能

Charles 的 Map 功能分 Map Remote 和 Map Local 两种。Map Remote 是将指定的网络请求重定向到另一个网址请求地址,而 Map Local 是将指定的网络请求重定向到本地文件。在 Charles 的菜单中,选择 “Tools” -> ”Map Remote” 或 “Map Local” ,即可进入到相应功能的设置页面。

对于 Map Remote 功能(选中 Enable Map Remote),我们需要填写网络重定向的源地址和目的地址,对于其他非必需字段可以留空。下图是一个示例,我将测试环境t.fanhaobai.com的请求重定向到了生产环境www.fanhaobai.com

对于 Map Local 功能(选中 Enable Map Local),我们需要填写的重定向的源地址和本地的目标文件。对于有一些复杂的网络请求结果,我们可以先使用 Charles 提供的 “Save Response…” 功能,将请求结果保存到本地并稍加修改,成为我们的目标映射文件。

Rewrite功能

Rewrite 功能功能适合对某一类网络请求进行一些正则替换,以达到修改结果的目的。

例如,将服务端返回的www.fanhaobai.com全部替换为www.baidu.com,如下:

将响应中的www.fanhaobai.com全部替换为www.baidu.com。于是在 “Tools” -> "Rewrite" 下配置如下的规则:

选中 “Enable Rewrite” 启用 Rewrite 功能 ,响应如下:

Breakpoints功能

上面提供的 Rewrite 功能最适合做批量和长期的替换,但是很多时候,我们只是想临时修改一次网络请求结果,这个时候,我们最好使用 Breakpoints 功能。

在需要打断点的请求上右击并选择 “Breakpoints”,重新请求该地址,可以发现客户端被挂起,Charles 操作界面如下:

此时可以修改请求信息,但这里只修改响应信息,故点击 “Execute” 后选择 “Edit Response” 项,修改 title 为fanhaobai.com,如下:

继续点击 “Execute” ,可看见响应的 title 已经变为fanhaobai.com

压力测试

我们可以使用 Charles 的 Repeat 功能来简单地测试服务器的并发处理能力。在想压测的网络请求上右击,然后选择 "Repeat Advanced” 项,如下所示:

这样我们就可以在上图的对话框中,选择压测的并发线程数以及压测次数,确定之后,即可开始压力测试了。

反向代理

Charles 的反向代理功能允许我们将本地的端口映射到远程的另一个端口上。

使用Charles抓包相关推荐

  1. charles抓包工具的中文乱码解决方法

    charles抓包工具的中文乱码解决方法 参考文章: (1)charles抓包工具的中文乱码解决方法 (2)https://www.cnblogs.com/grimm/p/7494688.html 备 ...

  2. charles 抓包 (二)

    本文基于charles 抓包 https (1)中的配置完成. 1.移动设备上的网络请求 打开要调试的APP,请求就会先发送到Charles,然后验证是否允许访问. 当点击允许后,可以在Proxy - ...

  3. Charles抓包https

    Charles抓包https 灰灰是只小贱狗 2018.05.08 10:46 字数 762 阅读 7800评论 3喜欢 3 抓取HTTPS请求包,对数据进行排查检验 1.安装Charles 2.电脑 ...

  4. charles乱码_基于iOS的Charles抓包实践

    奇技指南 在应用开发过程中,通过抓包调试服务端接口的场景时常出现.Charles和Wireshark是开发过程中最常用的两款软件.那么今天,让我们以iOS为例,聊一聊Charles抓包. 本文来自36 ...

  5. charles抓包ios抓拍教程

    charles抓包ios抓拍教程_百度搜索 https://www.jianshu.com/p/724ef9d3efb6 https://www.cnblogs.com/junhuawang/p/72 ...

  6. iOS Charles 抓包

    iOS Charles 抓包指南 - 从入门到精通_VictorZhang-CSDN博客_charles ios 下载安装包 Download a Free Trial of Charles • Ch ...

  7. charles代理手机调试_H5开发 移动端 调试之 Charles 抓包 和 Map Remote

    移动端调试是每一位前端工程师必须掌握的技能,在移动端环境上往往有很多不同的情况,我们需要借助一些工具来调试.本文将介绍 Mac 如何安装 charles,进行抓包.以及一些应用场景. 场景一:app端 ...

  8. charles抓包工具使用指南

    前言 移动APP抓包 PC端抓包 查看模式 其他功能 问题汇总 1. 前言: Charles是一款抓包修改工具,相比起burp,charles具有界面简单直观,易于上手,数据请求控制容易,修改简单,抓 ...

  9. postman怎么导出测试用例_利用Charles抓包巧转接口自动化测试用例

    在前面的文章中,也有介绍类似的工具的.例如:一键将接口请求转为测试用例介绍了开源的mitmproxy录制转化为接口测试用例,postman接口用例转化为python自动化测试用例 文章记录了如何把po ...

  10. 学完这篇Charles抓包教程,我直接把fiddler卸载了

    01.charles简介 charles是一款非常优秀的抓包工具,全平台支持,在mac,windows,linux上都可以使用,既可以抓取web端的包,也可以抓app端的包. charles主要的功能 ...

最新文章

  1. html实现上下三角,css3实现三角形(上下左右)
  2. codewars068 - Convert string to camel case
  3. AI基础:数据增强方法综述
  4. Y1066 Ble Master Client 记录
  5. 在JS中如何判断undefined和null
  6. Angular应用一个创建场景的问题分析
  7. AC_Dream 1224 Robbers(贪心)
  8. 使用PaddlePaddle.org工具构建PaddlePaddle文档
  9. 微信说不!有何不可?
  10. oracle数据库导入表空间,oracle数据库表空间创建导入导出
  11. php按条件修改xml,php 修改、增加xml结点属性的实现代码
  12. STL -- string类字符串
  13. 【vedio】html 视频有声音没有图像
  14. 电力系统微型计算机继电保护试题及答案,电力系统微型计算机继电保护试题及答案(2002年4月)...
  15. plsql使用方法(主要是sql语句)
  16. 虚幻4皮肤材质_虚幻4果真被玩坏了?浅谈光影与材质带来的极致体验
  17. LVS+Keepalived+Nginx+Tomcat高可用负载均衡集群配置
  18. 前端高级——Node的变迁
  19. 汽车维修企业管理【10】
  20. Cluster - 基本概念

热门文章

  1. 013_JavaScript函数
  2. nacos 环境切换_Nacos多环境配置
  3. 卡迪夫大数据专业排名_大数据揭秘!英国名校哪些专业录取率低?申请人最多呢?...
  4. linux网卡点灯命令,LINUX下SHELL GPIO点灯
  5. android view可视区域,Android使用WindowManager构造悬浮view
  6. android后台文件下载库,android中如何下载文件并显示下载进度
  7. php 补足字符串,php 数目字或者字符串补全
  8. 重庆二师计算机科学与技术,应用型本科院校计算机科学与技术专业一流课程建设思考──以重庆第二师范学院为例...
  9. java静态分派_Java基础——重载、静态分派与动态分派
  10. oracle11g迁移到12cpdb,12c跨平台完成PDB的备份迁移