zoukankan      html  css  js  c++  java
  • Charles的使用

    Charles是一款常用的抓包工具。抓包可以通过查看请求和响应,帮助定位问题(是服务端的问题还是客户端的问题),也可以模拟服务端返回的异常情况。

    一、Charles连接手机

    Charles对手机抓包,需要和手机在同一个局域网,在手机端设置代理即可。

    (1)在手机上,所连接的wifi处,将代理设置为【手动】

    (2)【服务器或主机名】处填电脑IP。

              查看方法1:win+R,再打开的cmd命令窗口输入ipconfig/all查看。

              查看方法2:在Charles中查看。【help】-【Local IP Addresses】即可查看IP地址。

    (3)【服务器端口号】默认为8888。也可以在Charles中查看和修改。

              【Proxy】-【Proxy Settings】,Port即为端口号。

    填好后点击【连接】,Charles会提示是否允许连接,选择【Allow】。

    二、查看请求和响应

    有两种查看格式,结构形式和序列形式。

    Structure格式将同一个域名下的请求放到一起,可以一级级查看。

    Sequence格式可以按照请求时间等顺序排列,还可以进行过滤。

    有的版本的Charles请求和响应分开2栏,Request和Response。

    有的版本的请求和响应都在Contents里,上面是请求,下面是响应。

    另外,点击下图框中的按钮,可以开始/停止抓取请求;点击下图中最左边的扫把,可以清除现有的所有请求数据。

    三、过滤

    抓包时,我们会发现抓到了大量的请求,绝大部分是对我们没用的,此时可以进行过滤,只留下我们需要的请求。

    在Sequence格式下,【Filter】处添加过滤条件。以头条为例,过滤前如图。会发现无用信息比有用的还多。

    我们只想要头条的请求数据,可以填写过滤条件,如图。这样可以方便的查看我们需要的请求数据。

    过滤时,可以填写域名,也可以填写接口路径

     

    四、断点

    在测试过程中,有时需要修改请求或者响应,测试一些异常情况,这时就需要用到断点。 

    在需要拦截的请求处,点击右键,选择【Breakpoints】,则对该请求设置了断点。也就是在客户端和服务器之间做了拦截。客户端向服务器请求时,Charles拦截一次,可以修改请求数据。服务器返回数据时,Charles再拦截一次,可以修改响应数据。

    设置断点后,下图方框处为如下状态。可点击该按钮取消断点,也可以在响应请求处再次点击右键,取消断点。

    以58同城首页为例。

    设置断点后,再次访问此网站,请求被拦截。如下图所示,在【Edit Request】处可修改请求的参数,包括请求方式,URL,Headers,Cookies等。修改之后点击【Execute】发送请求。

     

    在服务器返回响应时,又被拦截一次,此时可以修改响应。同样的,修改之后点击【Execute】返回响应。

    我把响应中的“58APP”和“58公众号”,改成“68APP”和“68公众号”,如下图所示

    在58首页的展示变为下图

     大多数网站都会对各种数据进行校验,因此再次正常刷新页面,58首页恢复正常显示。

    五、模拟弱网

    实际测试中可能需要模拟用户的各种网络状态,比如在电梯里,楼道里有时会是弱网状态。Charles可以模拟弱网的情况。

     【Proxy】-【Throttle Settings】,勾选【Enable Throttling】,即可设置网络的各参数。

     

    另外,参数设置好之后,可以直接点击下图小乌龟的图标,开启和关闭弱网。

  • 相关阅读:
    vue路由的两种模式,hash与history
    javascript的继承小结
    attr和prop区别
    ie6、7下 text-indent 问题
    推荐链接
    iphone中 input圆角bug
    gif图片加载问题
    IE7中绝对定位元素之间的遮盖问题
    多行文本溢出显示省略号(...)的方法
    ie6兼容之绝对定位元素内容为空时高度问题
  • 原文地址:https://www.cnblogs.com/zhxwind/p/8609742.html
Copyright © 2011-2022 走看看