charles用法详解
Charles是目前最强大的http调试工具,在界面和功能上远强于Fiddler,同时是全平台支持,堪称圣杯级工具,唯一的缺陷是这货是收费的,而且是要¥50美元大洋…当然网上是有破解版的,鄙视下自己,无耻地使用了…放在网盘里,亲可以默默带走,不要留下一片云彩。
先安装里面的原版,然后copy charles.jar覆盖到安装目录下的lib目录即可。这是V3.6版,最新版本是V3.8.3,但破解补丁不通用,会导致无法启动。
启动后,圣杯的真面目如上图。
Charles有个会话(session,不是指http中的session)的概念,可以理解为浏览器中的tab,这个功能在需要调试多个站点页面时很实用,当你刷新页面的时候,只会在当前session中捕获请求。
(PS:ctrl+N创建个新的session,ctrl+W关闭当前session)
Charles的代理服务器启动就可以使用(会提示给firefox安装插件),如果没有捕获到请求,请清理下浏览器缓存。
界面功能初探
工具条包含了Charles的大部分功能:
有几个功能比较抽象,后面会详细说明。
右键请求出现菜单,Charles的右键菜单功能比fiddler强大太多了。
双击请求进入列表视图,类似fiddler,方便查看和过滤请求。
Charles的过滤查找功能非常赞,很快速:
请求详情跟fiddler相似,但直观不少:
工具视图基本讲解完毕,接下来我们用Charles做点事情。
本地代理和远程代理
Charles的代理服务器端口跟fiddler一样都是8888,即你的本机ip:8888。
我们的目标将一个压缩文件代理成本地的源码文件。
点击“Map Local”后:
index-min.js代理成index.js,刷新页面试试。
代理成功,so easy!
Charles的树状视图比fiddler的列表视图好的地方在于,多次刷新后的请求会被归纳到树里面,更加一目了然,用fiddler的时候,有点强迫症的同学,都要点击clear,有木有…
Charles是支持子目录代理哦,非常实用的功能:(使用通配符*)
本地地址选择个子目录,不需要通配符。
如何判断是否代理成功呢?
这点Charles比fiddler人性化多了。
校验是否代理成功,最省力的方式是点击工具条上的刷新按钮,刷新单个请求,如果代理成功,Charles会往“Notes”界面打个log,比如Mapped to local file: C:\www\htdocs\gallery\uploader\1.5\build\index-min.js。
去除代理配置
小技巧:所有的配置开关都可以通过工具条上的“工具”设置(倒数第二个按钮)。
去掉代理配置:
小技巧:建议开启No Caching,不缓存请求。
mobile代理功能
手机或平板页面的调试,我们需要把请求代理到pc端的Charles上。
必须确保mobile端和pc端连的是相同的无线网络。
ios的配置非常简单
(上图借用我同事自寒的截图)
服务器ip设置成pc的ip,端口好设置成8888即可。
然后mobile终端可以刷新试试。
安卓机器的代理
首先,安卓机器必须有root权限,其次需要借助app才行,在安卓的任意市场搜索 ProxyDroid,灰常好用的代理app。
有些浏览器是自带了代理配置功能,比如opera mobile,输入opera:config ,不过我试了下没代理成功,不知道是不是手机问题。
wp8的代理设置也很简单,手机连接wifi 并进行设置下 设置–WiFi–长按连接好的WIFI–弹出编辑选项。
试试远程代理
代理配置
Charles支持https和sockets的代理,还支持SSL,非常全面。
网速模拟功能
throttle功能对于前端来说非常实用,可以看页面在低网速下的表现,从而找出优化的点。
在线上环境通常有些因为网速慢导致的bug,在本机无法重现,那时候就很抓瞎,如果嫌远程麻烦,推荐使用throttle。
首先先配置下throttle。
我们要看页面在3G环境下的表现:
(Charles的预配置对于中国的网络环境并不准确,电信、移动、网通的速度还有有明显差异。)
解析下图上几个配置的含义:
Bandwidth(带宽)、Utilistation(利用百分比)、Round-trip(往返延迟)、MTU(字节)(MTU的说明请看百度百科)。
牛逼的断点功能
Charles另一个非常实用的功能,对于开发者和测试人员来说,堪称神器。Charles能够断到发送请求前(篡改Request)和请求后(篡改Response)。
场景:ajax发送请求,我们需要测试接口的各种边界情况,比如出错、超时等表现,Charles的断点+随意篡改,非常方便测试。
upload.php是我们要测试的上传接口,右键选择“BreakPoints”,开启断点。
小技巧:不用在web界面中操作,使用repeat功能,就可再次发送一样的请求:
断点列表查看
可以指定断点“get”请求还是“post”请求。
重复发送请求
repeat功能对于测试同学特别有用,可以检验接口的健壮性。
repeat功对于前端的价值是不需要刷新页面,只需要repeat请求,比如检验代理是否成功,修改请求后执行等。
“repeat”重复发送一次请求。
“repeat Advances”可以自定义重复次数和重复间隔。
捕获记录控制
捕获的请求太多,容易产生干扰,Charles可以对捕获记录进行过滤。
然后配置“exclude”:
web界面
Charles有个有趣的web界面:
强大的是可以控制是否远程可以访问这个界面,还可以设置用户名和密码…碉堡了…
浏览器输入http://control.charles/ :
Charles还有其他有趣功能等待大家挖掘,由于用的比较少,这里就不再累述。
charles用法详解的更多相关文章
- C#中string.format用法详解
C#中string.format用法详解 本文实例总结了C#中string.format用法.分享给大家供大家参考.具体分析如下: String.Format 方法的几种定义: String.Form ...
- @RequestMapping 用法详解之地址映射
@RequestMapping 用法详解之地址映射 引言: 前段时间项目中用到了RESTful模式来开发程序,但是当用POST.PUT模式提交数据时,发现服务器端接受不到提交的数据(服务器端参数绑定没 ...
- linux管道命令grep命令参数及用法详解---附使用案例|grep
功能说明:查找文件里符合条件的字符串. 语 法:grep [-abcEFGhHilLnqrsvVwxy][-A<显示列数>][-B<显示列数>][-C<显示列数>] ...
- mysql中event的用法详解
一.基本概念mysql5.1版本开始引进event概念.event既“时间触发器”,与triggers的事件触发不同,event类似与linux crontab计划任务,用于时间触发.通过单独或调用存 ...
- CSS中伪类及伪元素用法详解
CSS中伪类及伪元素用法详解 伪类的分类及作用: 注:该表引自W3School教程 伪元素的分类及作用: 接下来让博主通过一些生动的实例(之前的作业或小作品)来说明几种常用伪类的用法和效果,其他的 ...
- c++中vector的用法详解
c++中vector的用法详解 vector(向量): C++中的一种数据结构,确切的说是一个类.它相当于一个动态的数组,当程序员无法知道自己需要的数组的规模多大时,用其来解决问题可以达到最大节约空间 ...
- AngularJS select中ngOptions用法详解
AngularJS select中ngOptions用法详解 一.用法 ngOption针对不同类型的数据源有不同的用法,主要体现在数组和对象上. 数组: label for value in a ...
- systemctl命令用法详解
systemctl命令用法详解系统环境:Fedora 16binpath:/bin/systemctlpackage:systemd-units systemctl enable httpd.serv ...
- CSS3的@keyframes用法详解:
CSS3的@keyframes用法详解:此属性与animation属性是密切相关的,关于animation属性可以参阅CSS3的animation属性用法详解一章节. 一.基本知识:keyframes ...
随机推荐
- glOrthof 与glFrustumf
http://www.java123.net/v/533543.html glViewport()函数和glOrtho()函数的理解(转) 在OpenGL中有两个比较重要的投影变换函数,glViewp ...
- 报告撰写,linux使用gimp简单做gif动图
我想把我的系统菜单完整记录下来,方便查看,如果单纯使用文字比较单调,使用屏幕截图,需要依次打开多个图像查看也不是很方便,就想到了使用动画的形式展示.由于本人的系统一直使用Linux系统,为了一张gif ...
- 关闭vs警告
禁用所有编译器警告 当“解决方案资源管理器”中有项目选中时,在“项目”菜单上单击“属性”. 单击“编译”选项卡. 选中“禁用所有警告”复选框. 禁用单个编译器警告 在“解决方案资源管理器”中选定一个项 ...
- 记录常见的HTTP请求错误
服务器提交了协议冲突. Section=ResponseHeader Detail=CR 后面必须是 LF 解决方案:winfrom 在app.config种添加 web 在 web.config种添 ...
- 同步mysql数据到ElasticSearch的最佳实践
Elasticsearch是一个实时的分布式搜索和分析引擎.它可以帮助你用前所未有的速度去处理大规模数据.ElasticSearch是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全 ...
- codeforces-526B
题目连接:http://codeforces.com/contest/526/problem/B B. Om Nom and Dark Park time limit per test 1 secon ...
- Python的程序结构[7] -> 生成器/Generator -> 生成器浅析
生成器 / Generator 目录 关于生成器 生成器与迭代器 生成器的建立 通过迭代生成器获取值 生成器的 close 方法 生成器的 send 方法 生成器的 throw 方法 空生成器的检测方 ...
- IntelliJ IDEA插件-翻译插件
说明:这个翻译插件应该是最好的了. 官网:https://github.com/YiiGuxing/TranslationPlugin 但是这个有个缺点就是使用收费的API,基于有道,截止今天使用的是 ...
- 使用Chrome DevTools直接调试Node.js与JavaScript(并行)
Good News: 现在我们可以用浏览器调试node.js了!!! 前提 Node.js 6.3+, 这个可上Node.js官网自行下载: Chrome 55+. 如果您本地的chrome升级到最新 ...
- 三种Web前端框架比较与介绍--Vue, react, angular
一.Angular 1.MVVM(Model)(View)(View-model): 2.模块化(Module)控制器(Contoller)依赖注入: 3.双向数据绑定:界面的操作能实时反映到数据,数 ...