Fiddler抓包进阶篇

阅读本篇内容之前,建议先对基础熟悉下

本文内容纲要如下

1、模拟限速操作
2、篡改数据
3、重定向功能
4、发送自定义请求,模拟小型接口测试
5、APP端抓包

一、限速

先补充下知识:
网络数据传输分为发送数据和接收数据两部分。

上传就是向外部发送数据,下载为从外部接收数据。他们都受网络带宽和设备性能制约。 在日常网络传输中大致1Mbps=1024/8Kb/s=128Kb/s(1/8)。例如上行的网络带宽为100Mbps,那么最大上传速度就是12800Kb/s,也就是12.5Mb/s。

用户申请的宽带业务速率指技术上所能达到的最大理论速率值,用户上网时还受到用户电脑软硬件的配置、所浏览网站的位置、对端网站带宽等情况的影响,故用户上网时的速率通常低于理论速率值。 理论上:2M(即2Mb/s)宽带理论速率是:256KB/s(即2048Kb/s),实际速率大约为103--200KB/s;4M(即4Mb/s)的宽带理论速率是:512KB/s,实际速率大约为200---440KB/s。以此类推。

背景:进行日常测试时通常网络情况都比较好(内网),所以有时会忽略在低速或网络状况不好的情况下系统页面的表现(前端是怎么处理的)

手机可以用2G、3G、4G,也是一种方式,但这都是网络模式,而Fiddler可以设置上传和下载的延时时间,这种控制非常灵活,可以帮助我们模拟低速网络情况下页面、APP的显示与交互情况,比如响应时间过长时是否有弹出网络不好的提示、页面crash以及显示错乱、session是否一致等

设置限速时间

(1)打开 【Rules---Customer Rules】,Ctrl+F搜索(m_SimulateModem),默认发送数据是300毫秒,接收数据是150毫秒,根据实际情况限速后进行保存(Ctrl+S)

PS:默认是300和150,大致模拟出来的带宽如下

上传带宽=(1*8/1000)/0.300≈0.053Mbps 
下载带宽=(1*8/1000)/0.150≈0.027Mbps

实际带宽是在计算所得的基础上乘2,也就是说

上传带宽=((1*8/1000)/0.300)*2.0≈0.106Mbps 
下载带宽=((1*8/1000)/0.150)*2.0≈0.053Mbps

(2)启用限速:Rules---Performance---Simulate Modem Speeds

限速设置.png

演示:对于发送数据(uploaded)每KB延迟30000毫秒,接受数据(downloaded)每KB延迟30000毫秒

(3) 重启
打开浏览器,访问百度,搜索python,页面加载非常慢,等全部加载完成时可以到Statistics查看时间

image.png

真实案例:
订单详情页面,有个添加备注按钮,在按钮点击时已经做了控制,将按钮置灰,避免用户重复点击,但最终忘记做低速测试了,导致线上出问题了
通过排查是button未做防重复点击导致低网速下插入多条记录,这种情况需要前后端一起控制,前端设置变量,按钮点击后记录状态

添加备注页面.png
未限速导致记录重复添加.png

PS:测试结束后记得取消限速


二、篡改数据

篡改分两种:

一种是修改请求数据,检查接口的处理情况,这种适用于不方便直接调接口,其不关心页面,只看接口处理是否正常,返回的数据对不对

比如 Harbor House官网注册页面 用户名限制的字符长度是2-20 ,把字符加到21以上,看效果,根据前端页面的预期结果是提示用户名超长了,而实际结果是注册成功了

注册页面用户名.png

于是去数据库查了下表结构,发现用户名字段的长度是50,所以重新注册下,字符超过50,看接口返回的信息,提示“信息输入有误”,OK,测试通过,说明接口在这块做了保护

字符超过数据表字段长度.png

用刚注册成功的用户名进行登录,提示“账号长度只能在2-20位字符之间”,登录失败
(引申:这些不会生效的数据,也会被称为脏数据,不改掉会影响到后续性能)

登录失败

在这里做个假设:
仍然是上面的例子,页面上注册时提示没成功,但实际数据库中已经保存数据了,这样就算bug了,前端不应该在用户捕获到超过长度的字符时还去调用接口

理论上前后端对于输入参数的限制应该保持一致,但实际上数据库字段长度是要比前两者多的,因为要留有富裕的空间作为优化

再比如注册页面对用户邮箱有进行验证,Fiddler中修改后查看服务端是否有验证,有兴趣的朋友可以自己去尝试下

修改页面请求值

构造请求数据,突破表单的限制,可以随意提交数据,避免页面JS和表单限制,从而影响相关调试(绕过前端)

1、设置断点:

Fiddler菜单栏->Rules->Automatic Breakpoints->选择Before Responses,
也就是发送请求之后,在Fiddler代理中转之前是可以修改请求数据的

2、观察inspector,页面内容出现变化后修改Body的Value值,然后点击 “Run To Complete“,回到浏览器查看响应结果
修改请求值.png

从案例分享中,可以知道运单号的长度需>=5,那么调试时就输入3个字符,看看页面的响应是否正常
图中获取不到提示,显示undefined,说明并没有调用接口

请求响应.png

另一种是修改返回包的数据,关心的是页面处理情况
比如理财app上显示金额,那么我们在测试时肯定要考虑金额的长度,此时可以通过篡改数据来看服务端返回不同的结果来看页面显示是否正常

修改页面响应结果(拦截响应数据,修改响应实体)
1、设置断点:

Fiddler菜单栏->Rules->Automatic Breakpoints->选择After Responses,
也就是服务器响应之后,但是在Fiddler将响应中转给客户端之前是可以修改响应的结果

2、观察inspector,页面内容出现变化(说明拦截成功)
抓包页面.png
3、切换到TextView,修改message,然后点击 “Run To Complete“,回到浏览器查看响应结果
页面响应结果.png

PS:可以试着将message信息改的很长,页面变形了,那就说明有问题了
如下页面是增加了滚动条

image.png


三、利用AutoResponder替换服务器的返回数据(即原资源)

AutoResponder:重定向功能,将HTTP请求重定向到本地的文件,进行调试。

1、比如 百度官网 logo,用户提出来要更新下,这时可以通过这功能实现,也就是不需要修改代码,就能预览换个logo图片文件的效果

在右上角选择AutoResponder页签,勾选Enable rules、Unmatched requests passthrough 两个选项,点击Add rule 按钮,在下方填写替换的规则,编辑好之后,点击保存

第一行填写地址完全匹配,也可以写正则表达式进行模糊匹配,也可以从左侧把请求数据拖过来
第二行填写要替换的内容,下拉框有很多选项可以选择, 比如201、302、404,502等status code

设置替换规则.png

设置好替换图片后点击重新访问百度,请求回来的数据已经是替换后的内容了

image.png

2、修改Response数据时超时
设置断点【After Response】之后,修改响应数据,来实现修改Response的内容,
但是这样容易造成请求超时

超时:客户端发送一个请求出去,如果在指定的时间内,没有返回,那么就不会再来处理这个请求了

假设修改内容的操作大于设置的超时时间,就算之后将断点放行,请求返回200,这个时候客户端也不会做任何处理,可以理解为修改的内容没有产生效果。

此时就可以利用AutoResponder的功能了,直接将修改之后的内容放到文件
步骤:
(1)查看该结果返回的数据内容及格式
选择请求,右击,Save -> Response -> Response Body ,保存响应体,可以是文本格式

保存响应体.png

(2)修改响应体的数据,如图修改title,重新发送请求,发现title和响应头部信息都已经更新

修改响应体的数据.png

PS:强制刷新Ctrl+F5,获取最新资源


四、发送自定义请求(request-builder)

Composer:一个小型、简易的接口测试工具,可以填接口地址,设置请求参数、填写响应结果,也可以修改相应的头信息(如添加常用的accept,host,referrer,cookie,cache-control等头部)后execute

1、比如 POST请求, Harbor House官网注册页面

先输入正常值,抓取请求数据,然后找到相应的请求,直接拖到Composer里面,然后在Copmposer中修改参数数据(此处为账号),点击Execute 就会产生一个新的请求,双击后可以看到返回的信息,提示账号已经存在

请求数据.png
提示信息.png
2、比如GET请求,百度搜索python

双击请求,切换到Webview

百度搜索请求

PS:如果是乱码,请求header那设置 Content-Type:charset=utf-8


五、APP端抓包

前置条件

1、手机和电脑在同一局域网(PC端可以设置wifi热点)
2、完成Fiddler的配置(允许远程连接),端口默认8888,然后重启Fiddler使其生效
Tools——>Options——>Connections,勾选Allow remote computers to connect

Fiddler配置.png

接下来在CMD命令窗口,查看Fiddler进程是否能正常监听8888端口,如果服务没有正常开启,可以尝试使用其他端口,端口修改的位置,如上图位置
以下两种方法都可以:
(1)执行 netstat -anop tcp
(2)执行 netstat -ano|findstr “8888”
PS:0.0.0.0:8888,4个0代表所有的ip都可以连接进来这个端口

查看端口.png

3、查看本机的IP
(1)命令行中输入:ipconfig 查看 IPV4

命令行中查看IP.png

(2)直接在Fiddler中查看

Fiddler中查看IP.png

4、手机配置代理(我用的iPhone手机)
(1)设置——>无线局域网——>选择wifi——>设置HTTP代理(输入IP,端口是Fiddler的代理端口8888)

手机设置代理.png

(2)打开手机浏览器Safiri下载证书 就可以抓取https的请求了

  • 输入:http://本机的IP:8888,下载FiddlerRoot certificate
  • 安装并进行验证
手机证书配置.png

5、操作app进行抓包

image.png

如果只想看移动端数据,也很简单,只需关闭pc端的代理就可以了(关闭Fiddler的“Capuring”开关)

关闭Fiddler的“Capuring”开关.png

答疑解惑:
有一次,公司办公,需要抓包,此时手机和电脑连的都是wifi,工具设置也没问题,就是抓不到包,后来发现是网络的问题
解决办法:电脑上安装热点,手机连电脑热点,之后就可以抓包了

PS:抓包之后记得关闭手机代理,以免手机上不了网



结束语

通过Fiddler可以抓取请求和响应参数,对参数进行分析,可以定位是前端还是后台问题。

案例一:
在测试登录接口时,输入了正确的手机号和密码,点击登录后,前端提示“请输入正确的用户名和密码”

如上案例,仅仅通过界面的提示信息,我们只能描述bug表象,但不能分析出问题原因。假设通过抓包发现是由于前端参数名错误或 参数值为空,从而导致后台报错。

案例二:
在列表页测试搜索接口时,输入商品一、二级类目,点击搜索,页面没有数据

通过抓包发现前端提交的二级类目参数与接口文档中的字段不一致

针对上述两种案例,测试人员就可以将bug指向前端开发人员,并将参数数据和接口文档中对应的报文数据以附件的形式上传,是不是可以提高bug的解决效率呢?同时也可以让开发对测试人员有个好印象(哇,这测试还是可以的,把原因找出来了),不是嚒!

Fiddler在实际的功能测试中有很大的作用
1、可以更好的了解某个业务中客户端和服务器端是通过哪些接口进行请求的,从而更好的了解代码逻辑(尤其对于新人来说,通过抓包和数据库的数据写入操作就能很快熟悉);
2、可以通过响应数据判断哪里出现了问题
比如服务器挂了,导致前端报“服务器故障”,这时通过抓包发现响应数据返回502,这时我们可以手动去重启服务或是联系运维重启服务

image.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,117评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,328评论 1 293
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,839评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,007评论 0 206
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,384评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,629评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,880评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,593评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,313评论 1 243
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,575评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,066评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,392评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,052评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,082评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,844评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,662评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,575评论 2 270

推荐阅读更多精彩内容

  • 前言fiddler是一个很好的抓包工具,默认是抓http请求的,对于pc上的https请求,会提示网页不安全,这时...
    胖子爱猪蹄阅读 11,951评论 4 22
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,100评论 18 139
  • 原因 在现实项目中,由于开发的经常调试,接口的不稳定,和接口文档的不及时更新,我们选择做接口测试,更多的需要自己抓...
    我为峰2014阅读 3,011评论 1 5
  • Fiddler_官方网站Fiddler_官方文档Fiddler_官方视频Fiddler_官方插件1、Filddle...
    52Alice阅读 7,575评论 0 10
  • 我想此刻我真是病了,亲爱的母亲 偷开的一朵蔷薇被染上了忧郁 夜色中,你看它多么的无助 又多么的让人怜悯 它的故乡在...
    无形_4e00阅读 256评论 0 3