美文网首页
Charles主界面介绍

Charles主界面介绍

作者: 九千年小妖 | 来源:发表于2021-01-23 09:56 被阅读0次

    主要是会话的两种视图模式以及对应的 requet/response 面板组成:

    Structure:树状结构显示,将网络请求按访问的域名分类;

    Sequence:水平结构显示,将网络请求按访问的时间排序

    Structure视图模式下,列表会按照域名来归类所有请求,而Sequence视图则是按照请求发生的顺序来展示;如果不习惯Sequence默认的上下视图,可以修改为类似Fiddler的左右视图模式(有更符合眼睛的习惯):快捷键 cmd+,->Charles Preferences->Viewers选择Sequence view layout为Tall即可;

    常用的功能在图上已经有注释,不多说,感觉Chales的右键功能比Fiddler多一点,简单看几个:

    Save response: 保存response数据到文件中,方便后面用于重定向功能map local...;选择多条记录后再右键就会有Save All...可以方便的把所有response信息一次性导出到某个目录中,然后通过map local...结合通配符来批量重定向请求;

    Export: 可以将选中的多个会话信息完整导出成文件(*.chls),通过File - import来导入chls文件,方便不同开发人员进行调试或者现象复现分析;

    repeat advanced...: 可以重发次数以及并发数,用于进行简单的服务器压测,看到有些简友还用它来对付一般的钓鱼网站,有点意思..

    菜单

    Proxy 菜单

    这个用得比较多,在这里设置跟踪捕捉过滤功能:

    Proxy菜单

    过滤( Recording Settings )

    Recording Settings 

    设置会话捕捉条件,include 面板用于启用/停止可以捕捉/显示的会话;

    exclude 表示不显示的会话,在会话列表中右键选择 ignore 时,对应的url会出现在这里;

    record_setting_add

    比较好用的是过滤条件支持通配符,*表示任意多个字符,?表示一个字符,如Protocol中有http,https和 "",选择空白或者输入*都可以表示任意协议的请求;

    也可以通过主界面底部的Filter来简单设置过滤条件,不支持通配符

    filter

    还有一种方法就是在一个网址上右击,选择Focus,然后其他的请求就会被放到一个叫Other Host的文件夹里面,这样也达到了过滤的目的。

    设置允许连接的ip地址(Access control Settings)

    access_control_settings

    模拟网络环境(Throttle Settings)

    throttle_settings

    在这里选择要模拟的网络环境,选项比Fidder多很多,也可以自定义,最人性的还可以对指定的url进行网络环境摸, 好评...

    这里设置完成后通过Proxy-Start Throttling(Ctrl+T)或者常用工具栏按钮来启用或停止;

    设置为代理服务器,并捕获手机请求(Proxy Settings)

    proxy_settings

    端口号 Port 默认8888,跟Fiddler一样,省得切换软件的时候,手机还得重新设置wifi代理了;

    记得启用Enable transtarent HTTP proxying

    手机上的设置跟Fiddler类似,切换到wifi设置页面,选择高级选项-->代理模式选择手动,代理服务器设置为 Charles 所在设备的ip,端口就是上面设定的8888, 注意: 手机和Charles所在机器需处于同一个wifi网络中;

    以上设定完成后,就可以charles中捕获手机请求了,第一次连接的时候charles会弹出确认提示框,选择 allow 就好了,后续可在 proxy -> access control settings 中进行管理:

    mobile_connect

    Tools菜单

    tools

    rewrite 动态修改 request/response 信息

    跟map local类似,也可以对response进行修改,不过他改变的只是部份信息,比如:主机地址(Host),返回状态码(response status),返回信息内容(body)等:

    rewrite

    捕获https请求

    1.  在本机上安装证书

    help - ssl proxying

    这里可以直接选择Install charles root certificate,会在本机上安装证书,也可以如图选择保存证书,然后手动导入到需要的位置,操作类似:

    2. 在手机上安装证书

    单击help--ssl proxying-install charles root certificate on a mobile device or remote browser,会弹出提示框,然后在手机浏览器上输入网址:chls.pro/ssl,然后根据提示保存证书即可:

    3. 启用https捕捉

    enable https

    启用后就可以在会话视图列表中看到https请求了;

    4.断点功能

    方法:

    在会话列表中右键点击某个会话,然后在菜单中选择Breakpoints;

    通过Proxy-Breakpoint settings...中手动新建/启用某个断点;

    要求勾选enable breakpoints

    之后当下次再有该请求时,会自动进入断点模式;

    一个完整请求会进入断点模式2次:

    request的发出之前;

    收到服务器的response但尚未返回给客户端的时候;

    断点request的时候,可以修改request信息,不过我们程序都有对请求header做校验和处理,修改参数后一般就直接报错了,所以这里看看response就好,反正操作类似:

    breakpoint

    在edit response中可以双击直接修改json文件的key/value值,很方便,修改完成后单击execute继续执行其他操作,将修改后的response返回给客户端;

    response 重定向功能

    这个跟Fiddler的autoResponse功能类似,可以指定本地文件(map local...)也可以指定为其他服务器(map remote...)上的文件,我们介绍前一种;

    这里的map local只能重定向response的数据内容部分,而headers

    还是会保留服务器返回的,比如要修改返回码之类的操作,目前来看,只能通过断点或者rewrite来进行,这一点比Filder弱,不太方便,也可能是我还没发现怎么处理,有知道的请不吝告知,谢谢;

    断点可以用于临时修改数据,也是一种重定向功能,若是要长期重定向,咱还是将返回重定向到本机文件比较方便,具体方法:

    准备一份要返回给客户端的 response 数据文件,可以从前面介绍的save Response来保存正常数据,然后修改,也可以自己构造一份(用于服务端api尚未发布,但移动端又需要进行调试的时候);

    右键单击某个请求,从菜单中选择map local ..., 也可以单击Tools-Map Local...打开map lcoal settings来添加一个映射关系,两种操作是一样的,前者只不过直接把url信息给写好了:

    map local

    完成设定后,后续符合条件的请求都会用本地映射文件替代;

    最后: 我之前在Windows下是 Fiddler 和 Charles 配合使用,主要是 Fiddler 的https一直出问题,而 Charles 就很一切正常,后来更换mbp后就一直用 Charles 了,不过Charles也有自己的不足:

    删除多个会话时会感觉得到卡,而Fiddler很顺畅;

    filter功能没Fiddler强大;

    Fiddler提供脚本自定义功能,如果是C#开发者的话,还可以很方便的集成fiddler_core到自己的应用中;

    常见问题解决

    1 . 手机无法获取的问题

    检查是否配置好代理IP,端口号

    检查是否与电脑在同一个局域网

    检查是否关闭防火墙,代理

    弹出询问点击“allow”或者“deny”时,误点“deny”,关闭charles重启,手机再次浏览则会重新弹出询问

    2 . 解决request和response信息中的中文乱码问题。

    方法一 :修改charles windows版本安装目录下也有一个Charles.ini的配置文件 

    原配置文件

    修改后的配置文件 增加vmarg.3参数,并设置编码格式为UTF-8

    方法二 : Tools -> Rewrite… -> Rules -> Add –>配置信息 

    选中 Request 和 Response

    Match 

    Name : Content-Type

    Value : application/x-zip

    Replace 

    Name : Content-Type

    Value : application/json;charset=UTF-8

    选中 Replace All

    –》点击OK,完成配置。

    !!!通过以上方法就可以解决Request和Response的中文乱码问题了。

    3 . 本地映射配置错了,删除错误的映射

    Tools -> Map Local… -> 选中需要删除的映射 -> Remove -> OK

    注意:不使用请关闭手机HTTP代理,否则断开与电脑连接后会连不上网

    相关文章

      网友评论

          本文标题:Charles主界面介绍

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