charles教程大全

作者: 依北辰 | 来源:发表于2018-12-27 13:57 被阅读0次

    从接触测试工作以来,第一款正式使用的软件就是charles,当然在他之前也有用过fiddler,postman等,

    不过在使用过charles后其他的工具全被我淘汰了,charles我觉得是一款非常好用的抓包软件,页面简洁大方,功能强大实用,兼容性好。

    哈~我才不会告诉你我是因为当时用的是mac电脑所以只能用charles了~~嘿嘿

    Charles 主要的功能包括下面这些:

    截取 Http 和 Https 网络封包。支持重发网络请求,方便后端调试。支持修改网络请求参数。支持网络请求的截获并动态修改。支持模拟慢速网络。

    charles相当于一个插在服务器和客户端之间的“过滤器”;

    当客户端向服务器发起请求的时候,先到charles进行过滤,然后charles在把最终的数据发送给服务器;

    注意:此时charles发给服务器的数据,不一定是客户端请求的数据;charles在接到客户端的请求时可以自由的修改数据,甚至可以直接Block客户端发的请求;

    服务器接收请求后的返回数据,也会先到charles,经过charles过滤后再发给客户端;

    同理:客户端接收的数据,不一定就是服务器返回的数据,而是charles给的数据;

    正因为上面的原理,所以charles能实现的功能,对前端开发者来说非常有吸引力,相当于请求和响应都可控的,而且charles为了控制更加方面,提供很多简洁的操作;

    好了,话不多说,进入正题:

    受限于我当前实用的是windows系统,暂时先为大家讲解charles-windows版本,后续会更新mac版本


    一、charles的下载和安装

    要想下载一个工具,怎么办最简单,在开发工具里,最方便的方式就去去它的官网下载,当然前提是在我们的祖国怀抱内~

    charles就可以这样下载,首先百度一下咯

    或者直接点击下载地址:Download a Free Trial of Charles • Charles Web Debugging Proxy

    根据你的系统版本选择对应的版本

    charles现在出到了4.2.7版本,这个基本上没什么影响,一般只要下载最新的版本就可以啦

    记得好像是4.0一下不支持http2.0的抓取,所以这点注意一下就ok啦

    下载好后进入安装页面,基本也是一路点下去,记得自己记得安装目录

    打开安装目录,双击运行charles.exe

    安装好啦~

    卸载的时候,就更简单了,直接找到控制面板-程序与功能-卸载或更改程序,然后双击卸载就可以了


    二、charles的基本介绍

    关于charles有很多很强大的功能,这里由于篇幅限制我只做部分功能说明

    *charles提供两种不同的视图方式,可自行按需选择查看

    structure视图是将网络请求按访问的域名分类,也就是理解为文件夹类型 Sequence 视图是将网络请求按访问的时间排序,理解为单个文件

    *查看默认端口号“Proxy->Proxy Settings”,默认端口号为8888,可自行修改

    *过滤请求

    当请求杂乱无章时,为了确保我们拿到自己想要的数据,可以使用filer进行过滤关键字

    过滤前 过滤后

    三、charles设置代理,手机进行抓包

    这一步的目的是为了移动设备连接到Charles,这样移动设备发起的所有请求才能在Charles中看到

    首先确保自己手机的wifi和电脑在同一网络下,千万不要用4G,那么没办法抓包,必须连接wifi

    使用Charles工具查看PC本地IP和端口号(端口号默认为8888,也可自行修改),选择“Help->Local IP Address”

    我的电脑本地ip地址为:192.168.1.159

    不过我更喜欢选择“Help->SSL-Proxying->install charles Root ....Browser”查看,这样子可以一下子把端口号和ip看到

    这里只是我的,你们的IP肯定跟我不一样,千万不要填我的

    拿出我们需要设置代理的Android手机,找到wifi,长按或者点击查看wifi详情(各类型Android手机方法大同小异,多进行尝试)

    然后进入到wifi详情页面

    把代理一栏从无改为手动,并在里面输入刚才看到的IP和端口号,例如:192.168.1.x(x为你自己的号码,每个人都不一样)

    输入自己的主机名和端口

    点击保存或者连接,如果没有则直接返回退出

    然后再次进入详情,看看代理一栏是不是已经变成了刚才自己输入的ip和端口号,如果显示则代表代理设置成功。

    如果继续显示代理为无,则代表刚才你没有保存,再试一遍

    记得如果你不需要用手机设置代理了,把代理记得关掉,不然会影响你浏览某些网页和应用

    这时,手机设置好了,打开你需要进行调试的app,你会发现电脑上charles出现一条提示:

    第一个箭头标注的是你的手机ip地址。你需要允许该手机的练级,点击“Allow”

    这个提示,只会在手机首次链接电脑的时候出现,同意后后面则不会出现。

    注意,如果你的手机链接时没有出现该弹窗,去检查自己刚才手机端的代理是否设置错误

    如果设置没有问题,可选择“Proxy->Access Control Settings”手动进入Charles的设置选项,添加当前手机的IP

    手机IP查看方式:

    进入wifi详情

    好了,到此为止,你基本已经完成了大半的设置,基本可以正常进行抓包了

    但是,部分手机还需要安装下载一个手机证书才能正常使用,安装方法如下:

    同样点击Help->SSL-Proxying->install charles Root ....Browser,查看手机证书下载

    chls.pro/ssl

    这一段是告诉你,需要你去浏览器下载一个证书

    此时你打开手机默认浏览器,然后在网址栏里输入

    chls.pro/ssl

    记得,此时你一定要是代理开启状态

    你会得到一个文件下载提示,下载后,在浏览器下载内容里找到刚才那个crt文件,打开后进入命名页面

    可自定义名称,或者不改。点击保存。部分手机此时会让你输入手机锁屏密码,或者让你设置锁屏,照做就可以了。

    出现如下提示代表安装成功。

    我演示使用的手机是oppo,部分Android手机证书会存在安装问题,比如小米好像需要手动安装,大家可自行百度证书安装方法,

    我后续会进行更新特殊情况的说明


    四、查看charles请求

    到此,你的设备和Charles就建立了连接,可以尝试在设备上访问一个地址或者app,在Charles左侧视图就能实时看到请求啦~

    Charles是通过将自己设置成代理服务器来完成抓包的,勾选系统代理后,本地系统(如果通过浏览器发送请求)发送出去的请求都能被截取下来。因此,如果想只抓取手机APP发送的请求的话,可以不勾选WindowsProxy选项,这样在测试时就不会被本机Http请求所干扰。

    也就是,去掉这个勾选的状态


    后记:

    IOS版本先附录一个别人的教程,后续再更新我自己的

    地址:http://blog.devtang.com/2015/11/14/charles-introduction/

    相关文章

      网友评论

        本文标题:charles教程大全

        本文链接:https://www.haomeiwen.com/subject/qvjrlqtx.html