【功能测试】6_Web端抓包 _Fiddler抓包工具的应用

文章目录

  • 一、抓包说明
    • [1.1 抓包](#1.1 抓包)
    • [1.2 抓包原理](#1.2 抓包原理)
    • [1.3 抓包工具的应用场景](#1.3 抓包工具的应用场景)
    • [1.4 如何定位Bug是前端还是后端的?](#1.4 如何定位Bug是前端还是后端的?)
  • 二、Fiddler抓包工具的使用
    • [2.1 抓包操作](#2.1 抓包操作)
    • [2.2 设置过滤](#2.2 设置过滤)
    • [2.3 安装证书](#2.3 安装证书)
    • [2.4 弱网设置](#2.4 弱网设置)
      • [2.4.1 弱网环境下可能会出现的异常](#2.4.1 弱网环境下可能会出现的异常)
      • [2.4.2 弱网测试步骤(重点)](#2.4.2 弱网测试步骤(重点))
      • [2.4.3 弱网延迟计算](#2.4.3 弱网延迟计算)
    • [2.5 断点设置](#2.5 断点设置)
      • [2.5.1 为什么要设置断点?](#2.5.1 为什么要设置断点?)
      • [2.5.2 断点操作步骤](#2.5.2 断点操作步骤)
        • [2.5.2.1 断点请求](#2.5.2.1 断点请求)
        • [2.5.2.2 断点响应](#2.5.2.2 断点响应)

一、抓包说明

1.1 抓包

说明:客户端向服务器发送请求以及服务器响应客户端的请求,都是以 数据包 来传递的。

抓包(packet capture):通过工具拦截客户端与服务器交互的数据包

1.2 抓包原理

抓包工具(fiddler):Fiddler是一个http协议调试代理工具,它能够记录并检查所有你的电脑和互联网之间的http通讯。

yacas 复制代码
1、使用抓包工具开启代理服务(转发请求与响应)
2、将浏览器上网方式设置成通过代理上网(将请求发给抓包代理服务器)

1.3 抓包工具的应用场景

1.定位前后端Bug

2.弱网测试

3.绕过界面限制直接测试服务器

1.4 如何定位Bug是前端还是后端的?

① 如果抓不到请求,显然是前端问题。

② 如果有请求但是没响应,那就是后端的问题;

③ 如果有请求也有响应,需要查看响应信息, 如果返回报错了,则需要具体分析报错内容。

二、Fiddler抓包工具的使用

2.1 抓包操作

Fiddler只抓包操作,不需要任何设置。因为默认开启了代理 8888。(谷歌浏览器也不需要手工设置)

2.2 设置过滤

yacas 复制代码
为什么要过滤?
------抓包时,有很多其他请求,干扰太大,可以使用过滤只看被测项目相关信息。

第一步:Filters菜单--->勾选Use Filters

第二步: 在第二个下拉框中选择Show only the following Hosts,并输入目标hosts

第三步:Actions--->Run Filterset Now立即执 行

2.3 安装证书

yacas 复制代码
为什么要安装证书?
------抓取https协议的包。(带锁看不着,装证书就是解决带锁的问题)

2.4 弱网设置

2.4.1 弱网环境下可能会出现的异常

  • 上传文件时进度卡住不动
  • 登录不上或者登录后立即掉线
  • 响应过程中页面控件可点击,导致崩溃
  • 搜索不响应,多次点击后结果显示总在刷新被替换

2.4.2 弱网测试步骤(重点)

弱网测试目标:项目使用用户有不同的网络环境,需要验证在网络环境较差的情况,能正常使用项目。

yacas 复制代码
1.设置要模拟的网络速度
2.开启网络延时
3.测试项目

1、设置要模拟的网络速度

2、开启网络延时

3、测试项目

yacas 复制代码
注:测试完成后需恢复设置
------查看弱网执行时间

2.4.3 弱网延迟计算

yacas 复制代码
弱网延迟时间计算公式:
延时ms=[1KB/(速率bps/8)B/s]*1000  单位换算关系:(B:字节	b:位)

1B = 8b
1B/s = 8b/s(或1Bps=8bps)
1KB = 1024B
1KB/s = 1024B/s
1MB = 1024KB
1MB/s = 1024KB/s
1Mbps=1000 000bps
1M带宽:速率为1Mbps
1s = 1000ms

2.5 断点设置

2.5.1 为什么要设置断点?

yacas 复制代码
绕开前端js限制,直接测试服务端。

2.5.2 断点操作步骤

yacas 复制代码
1.设置断点
2.修改请求
3.修改响应
2.5.2.1 断点请求
yacas 复制代码
1、启动Fiddler
2、打开tpshop登录页面,输入账号、密码、验证码
3、设置请求断点
4、在请求中把手机号删除
5、点击 Run to Completion (所有页面都要释放)


2.5.2.2 断点响应
yacas 复制代码
1、启动Fiddler
2、打开tpshop登录页面,输入账号、密码、和错误的验证码
3、设置响应断点
4、在响应中修改 哈哈,登录成功了!!!
5、点击 Run to Completion 



相关推荐
月巴月巴白勺合鸟月半2 分钟前
一个医学编码的服务
服务器·前端·javascript
ycgg7 分钟前
深入理解 DOM 的 dispatchEvent API
前端
方也_arkling8 分钟前
【JS】定时器的使用(点击开始计时,再次点击停止计时)
开发语言·前端·javascript
JS_GGbond9 分钟前
Vue原型链:让你的组件继承“超能力”
前端·vue.js
乆夨(jiuze)11 分钟前
不是所有的链式调用,都是Promise函数,Promise 规范及其衍生的 Promise/A+ 规范
前端·javascript·vue.js
前端李易安27 分钟前
ERROR in ./node_modules/vue-router/dist/vue-router.mjs 被报错折磨半天?真相竟是……
前端·javascript·vue.js
monkey_slh27 分钟前
JS逆向实战——最新某东cfe滑块
开发语言·前端·javascript
禅思院30 分钟前
在win10上配置 Rust以及修改默认位置问题
开发语言·前端·后端·rust·cargo·mingw64·cargo安装位置
2503_9284115634 分钟前
12.17 vue递归组件
前端·javascript·vue.js
LYFlied35 分钟前
【每日算法】LeetCode 79. 单词搜索
前端·算法·leetcode·面试·职场和发展