当添加注册信息为性别保密,而登录后显示的个人信息却是女?

出现bug,是前端还是后端的责任,这个bug提给谁?–辅助技能判断

一、网络资源

在填写到提交给后台之间涉及到网络相关的知识。
在这里插入图片描述

URL(统一资源定位符)

请添加图片描述
说明:

  1. 协议有很多种,一般在日常生活中使用的就是http、https(安全)

  2. IP地址:给电脑分配一个唯一的位置(IPV4,IPV6)xx.xx.xx.xx

    由于IP地址并不好记,DNS服务器充当中间翻译,实现IP地址(计算机在网络中传输数据只认IP地址)和方便人记的域名相转换。

    域名---->IP对应:www.baidu.com

  3. 端口:找到服务器后,要确认其程序入/出口是否开放(端口号),才能去里面取数据。端口号可以不写,默认为协议中默认的端口号,记住两个常见的http:80,https:443
    在这里插入图片描述

  4. 资源路径,使用/ path/path,就和linux那里边一样

  5. 查询参数的格式:?参数名=参数值&参数名=参数值…

协议://域名或IP地址[:port]/path/[?参数名=参数值&参数名=参数值…]

http请求

客户端发送给服务器的称之为请求:
请添加图片描述
超文本:除了文本外还有视频,音频、图片…
请求与响应:敲上URL后找到服务器(请求),服务器显示(相应)

http请求说明

可以通过抓包获取
在这里插入图片描述

  1. 请求行内容:
    请添加图片描述
    说明:在早期的设计风格,post是万能的,可以增删改查,get是查。

请求方法 URL 协议/版本号
按什么方式发,发到哪里去,用的是什么协议,哪个版本号

  1. 请求头的内容
    客户端给服务器发消息时做的自我介绍,很多都是默认的属性,不过多介绍
  • content type请求体数据类型:
    表单类请求体:参数名=参数值 & 参数名 = 参数值
    JSON请求体:简单来说就是字符串的键值对{参数名:参数值,参数名:参数值…}

    请添加图片描述
    3.请求体:
    只有POST和PUT有请求体:
    请添加图片描述
    抓取数据包:打开一个网页,按住F12,保留日志,选择全部,
    在这里插入图片描述
  • 名称这里就是发送的各种数据包,点开会有详细的请求行,头,体。
    在这里插入图片描述
  • 介绍一种抓包工具charles,打开浏览器页面, 便会有各种网页数据包
    在这里插入图片描述

总结在这里插入图片描述

二、http响应

服务器返回给客户端的叫做响应:
请添加图片描述

1. 响应行:

请添加图片描述
重定向:发送的第一个请求之后,服务器发现你请求的是一个旧地址,服务器会返回一个新的地址,然后自动重新发一个新的数据包。
客户端错误:4开头,请求方法,域名写错…
服务器错误:服务器超时,服务器无响应…

2. 响应头

客户端发送请求给服务端的时候描述自身的一些信息放在响应头中
请添加图片描述

3. 响应体

请添加图片描述

4、网页中的请求头和体:

在这里插入图片描述
请添加图片描述

5、常见http相应状态码:

请添加图片描述

  • 301:永久重定向:第一次请求时发现资源位置早就已经变了,而且以后再也不会改回去了,下次来到这直接跳转成新的
  • 302:短期资源位置改变,过段时间又回来了。

6、面试题

  1. HTTP请求方法中,get请求和post请求有啥区别?
1.http请求方法中,get请求和post请求有啥区别?
- 是否有请求体:post有请求体,get没有请求体
- 参数位置:post发送请求携带参数一般在请求体中,get请求参数在URL中
- 参数大小:get请求携带参数大小受限制,post请求参数大小不受限制
- 是否安全:get请求不安全(URL中直接能看到),post请求相对安全
- 方法作用:get查询、post任意
- 是否缓存:get有缓存,post没有
- 支持编码:get请求的URL编码是ASCII,post请求的请求体数据编码任意类型
  1. 常见HTTP的响应状态码有哪些?分别表示啥意思?

  2. HTTP和HTTPS区别?

抓包

1、抓包的介绍:

请添加图片描述

  • 定位bug:前端页面出问题还是后端服务器返回值出问题了?

  • 弱网测试:APP测试中,人走到电梯等信号比较弱的地方,使用APP会不会出现异常。

  • 绕过界面限制进行测试:接口测试,与界面无关,相当于测服务端。

  • 页面渲染:
    在这里插入图片描述

抓包:在客户端和服务端设置的一个网络代理,也叫做代理服务器
请添加图片描述

2、抓包工具charles

proxy:概念
红点:正在抓包
锁:开启https抓包
左侧会话窗口,每一条就是数据包
overview总揽信息
contents:详细内容 包含上半框请求,下半框响应,上下框都有Raw以文本形式显示
Raw:以文本的形式显示信息

在这里插入图片描述
在这里插入图片描述
使用火狐浏览器,设置代理:
在这里插入图片描述
注意:每次使用火狐访问的时候你需要先打开服务器,否则就会出现服务器拒绝访问的错误。

原因就是客户端请求服务器端的中间需要经过代理,如果没有开启代理,就无法通过这个中转站请求到页面。

3、TP商城抓包介绍

这个访问可能会出现https网页是unkown的情况,大家可以照着这个博主这样弄:
UNKOWN解决办法
请添加图片描述
这是弄好了之后的样子:
在这里插入图片描述

看一下之前的一个问题,bug究竟是谁的问题?

当添加注册信息为性别保密,而登录后显示的个人信息却是女?
导致客户端和服务端显示性别不一致。

区分前后端bug?(重要)

如果抓不到请求或是请求有误,是前端的问题
如果有请求且正确但是无响应或响应错误,就是后端的问题。
如果有请求有响应且都正确,那就是前端页面渲染错误。

请添加图片描述
客户端:性别信息应该从哪个接口中获取?
答:登录接口—>登录之后才能看到个人信息中的性别

1、打开登录界面输入好信息
2、清理抓包工具抓到的数据包,此时点击的才是你当前操作的数据包,一般默认是第一个或者第二个

能抓到请求数据包,观察请求登录的数据包内容,发现没有错误

在这里插入图片描述

响应200OK成功抓取,在看响应体与数据库中的对应关系:也没有问题,数据库中记录0为保密,而响应的数据包也是0,并且注册的也是保密,说明后端没有问题

在这里插入图片描述

在这里插入图片描述
请添加图片描述

查看前端页面渲染:
在这里插入图片描述
小案例:这种情况应该抓哪里的包呢?
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
答案是应该抓,加入购物车的包,点击购物车的包

加入购物车,请求数据包是否有对应商品,响应数据包是否有添加成功+这个商品信息
打开购物车,查看请求数据包,查看响应数据包里面的数据是否与数据库相对应,再看看最后前端渲染是否有误。

  1. 添加购物车,数据库中status为1确实是代表添加成功,请求和响应数据包均没问题,页面显示也没问题
    请添加图片描述
  2. 点击购物车:响应数据与数据库对应上了,但是页面是空,前端的问题。
    请添加图片描述

三、弱网测试:

一般弱网测试基于的是APP测试,web端的网络比较稳定。就业班详细再讲,重点看页面延时和页面是否崩溃。
请添加图片描述
请添加图片描述

1、模拟弱网:小乌龟就是弱网设置奥

在这里插入图片描述

在这里插入图片描述
先正常进入TP商城主页面
在这里插入图片描述
打开弱网3G访问同一个主页,明显慢了:
在这里插入图片描述

2、使用fiddler时可以计算延迟时间(1KB或者1MB)

1MBbps = 8Mbps,我们一般使用的是MB,所以经常做除8操作。这里的MBps指的是MB/s,比的意思。

  • 下行速度表示下载速度,这里面算的是3G网络下载1MB的文件需要大概2.5S。
    在这里插入图片描述

3、Charles设置弱网操作界面

网络带宽其实可以理解为网速,我们平时在日常说的我家网络1000M,说的都是1000Mbps,而实际上换算成MBps就不算快了,也就是125MBps,每秒传输125MB的数据。

想要把上面介绍的移动联通这些的贷款输进去,需要将mbps转换为kbps,只需要乘1024即可,因为进制转换是1mb = 210kb。乘1000粗略计算也是可以的

在这里插入图片描述

  • 带宽利用率:不可能只服务一个网站,其他人也会用,所以一般不会到100%。
  • 可靠性:早上晚上不一样
  • 稳定性
  • 除了带宽一般其他的不会改

关注指标:实际延迟时间会大于它
在这里插入图片描述

4、绕过界面做服务端测试(在抓包工具中打断点)接口测试

一般边界值测试需要使用到绕过界面测试。针对无效类的异常数据。
先进行页面测试看有没有做拦截限制,再进行绕过界面看后台有没有做拦截限制。

这样一个场景,如果你输入一个大于11位的不合法手机号进行注册,其实在界面处就会拦截,根本发不了请求到后台,这个过程可以进行抓包,发现抓不到。

如果一个不法分子绕过界面给后台发数据,那么如果后台没有做一定的防范就会导致被不法分子砖空子。

请添加图片描述
首先输入一个不合法的10位数字手机号

发现数据包被页面拦截了。说明做了页面拦截
在这里插入图片描述
接下来我们需要将手机号换成合法的11位保证这个数据包能够发出去,然后进行拦截,再去修改这个数据包,将其以错误的形式发给后台,看后台有没有做限制。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
接下来就全部按excute实施下一步
在这里插入图片描述
得到这样的信息:

  • 账号没有问题
  • 后台返回的限制信息也没有问题,也做了限制
    在这里插入图片描述
    在这里插入图片描述

这样一套操作下来可以确认这个功能完全没有问题:页面做了限制拦截,后台做了限制处理

总结:

面试:如何定位前后端bug?

定位思路

①确认请求是否有问题,请求有问题–>前端

②确认响应是否有问题,响应有问题–>后端

如何确定响应的问题? - 返回的数据和数据库是否一致

③请求响应都没有问题,但页面显示错–>前端

在这里插入图片描述

四、缺陷管理请添加图片描述

多功能较少,不易使用的优先级比较低
请添加图片描述
最后一个也是bug,属于用户体验不好

请添加图片描述
请添加图片描述

1、 缺陷要素描述

请添加图片描述

请添加图片描述
缺陷优先级和用例优先级一样,bug类型是可以选择的,不用记住,缺陷状态就是缺陷流转到谁那了,状态是什么。
请添加图片描述请添加图片描述

请添加图片描述
请添加图片描述

2、缺陷报告的编写

注册抢88现金
这里有个缺陷:推荐人手机号未注册,却显示免费注册成功了。
在这里插入图片描述
在这里插入图片描述

3、扩展面试题:不可复现的bug怎么办?

  • 从内部出发向外找原因

替换排除法

  • 找外援(打印调试日志)

  • 从严重级出发,严重级低,暂时可以不考虑(后续尝试复现);严重级高,需要分析排查

  • 思考排查测试过程,测试步骤是啥,测试环境是否有差异(替换法)

  • 寻求协助:测试老员工,开发协助(记录出现问题的时间,查询对应时间段的日志,通过日志分析)

  • 如果没有日志,需要开发给一个带有调试日志版本的系统,后续连续跟踪三个 版本后,再未复现,此时放弃

  • 后续版本再次出现,直接转/提正式bug,详细描述你的复现过程,并附带日志信息

五、总结:星号的是重点

在这里插入图片描述

Logo

AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。

更多推荐