1 定义

前端：是用户看得见摸得着的东西，主要体现在页面的视觉效果以及交互设计上。
特性：界面/布局/兼容性/交互相关
前端的bug主要分为3类：HTML CSS javascript三类问题
出现样式的问题基本都是CSS的bug;
出现文本的问题基本都是html的bug
出现交互类的问题基本都是Javascript的bug
后端：则侧重于更深层面的东西，关于逻辑，关于数据，关于平台的稳定性与性能。后台主要负责实现具体的功能。
特性：数据/安全性/逻辑性/性能相关
后端的Bug如：
(1) 查看报错日志
查看报错日志，通过日志分析，需要有一定的经验，并且有一定的代码基础，才能更好地定位问题。
(2) 查看数据库的数据
了解所测功能的数据表结构，测试过程中，查看数据库的数据，确认数据的正确性。
(3) 查看缓存（如Memcache、apc、redis等缓存）是否正确

2 定位方法

经验法
软件测试人员应不断精进自己的技能，负责的项目多了，自然对功能的实现过程有了解，也就明白如何分类BUG了。例如：网页上的某个图片的分辨率不对，如果我们了解实现过程，可以想到一般情况下，是根据某个地址去服务器取图片的，数据库一般只保存地址，那么图片能正确显示，就说明后端的基本功能是满足需求的。如果具体图片分辨率有误，最可能的原因是前端显示过程出了差错。
日志查看法
当我们发现一个BUG，并不确定这个BUG属于前端还是后端，可以查看后端服务的日志，复现BUG时，查看日志中有没有相关信息。基本可以认为，如果日志没有输出，很可能这个功能并没有与后端交互，也就不存在后端的问题。反之，如果日志有输出，可以进一步查看有无错误日志信息，进一步分析。
查看后端服务log日志有无错误日志信息。
查看日志：https://baijiahao.baidu.com/s?id=1727360160265115655&wfr=spider&for=pc
接口查看法
这种方法常用于查看是后端返回给前端的数据有误，还是前端显示有误。大多数浏览器都有自带的接口查看工具，如Chrome，FireFox等都可以通过F12开启抓包，在NetWork中可以看到当前页面发送的每个http请求。
通过Chrome看到的接口情况如下：
我们需要对比通过后端接口拿到的数据和前端显示的数据，来确认问题出在哪里。如果数据错了，页面显示是错的，也是正常的，先从后端入手去解决。如果数据对了，但是显示错了，就需要问问前端的开发人员了。
抓包：传参内容不对，前端bug；响应内容不对，后端bug。

3 实战

问题：在某购物网站上购买了两件商品，一件打折，一件不打折。当你下完订单并且成功支付之后，再次去我的订单中查看订单内容时，发现两件商品只显示出来一件，打折的商品没有显示出来。
分析：

如何定位前后端Bug相关推荐

测试人员必备技能——如何利用F12快速定位前后端BUG
前言在测试人员测试过程中经常需要通过抓包来区分一些前后端的Bug,特别是Web端的测试,利用浏览器中的F12开发者选项,就能进行网站界面测试.调试,分析网页所出现的问题,查看html元素.查看响应事 ...
如何定位前后端Bug？
Bug分析 1.如何分析Bug? 1)抓包接口定位分析 2)看系统日志 1.如何分析Bug? 1)抓包接口定位分析 web项目的话,一般工作中使用方式比较多的是使用浏览器自带的F12抓包看接口请求. ...
如何区分前后端BUG？
软件测试工程师的职责是发现BUG,此外,如何体现个人价值?那么我们试想,只提出问题而不去解决,问题就永远得不到闭环.所以,一个资深的测试人员的基本功应该是这样的:深挖业务和功能需求,找出BUG,定位B ...
按F12，你真的会准确定位前后端问题吗？
1.怎么找接口? 最好在谷歌浏览器按f12查看,主要看network,就可以定位前后端问题. 如果按f12以后,点击network,可以看到.js和.png这些结尾的都不是接口. 点击network- ...
day06：如何定位分析前后端bug（详细版）
文章目录一. 为什么要区分? 二.如何定位分析? 三.借助什么工具? 四.如何复现bug? 五.案例分析一. 为什么要区分? 第一,前端bug提交给后端,后端bug提交给前端,不仅给开发双方带来了 ...
mysql定位前后端问题_Web 前后端分离的意义大吗？
意义很大,但是你的问题本身认识有偏差. 对于前后端分离,认识上有个误区,那就是很多人自称:我们老早就分离了,全AJAX,使用Angular或者什么什么就可以了. 这个说法是不合适的,打个比方,别人问的 ...
使用Fiddler定位前后端问题
以百度搜索为例: 1.打开Fiddler,设置过滤条件 2.打开浏览器,输入网址,抓包工具会开始读取(如果会话列表有数据记得清屏) 3.操作界面,查看会话列表 4.双击会话列表对应的数据包,查看接口数 ...
web应用F12查看报错（前后端bug判断、2XX/3XX/4XX/5XX常见状态码解析）
chrom浏览器为例 (1)打开开发者工具,在浏览器菜单栏选择工具-开发者工具,快捷键是F12 (2)打开之后切换到Network页签,操作就可以看到请求响应 (3)再选择响应的链接,切换到Previ ...
在测试过程中，我们是如何去定位前后端问题的？
我们在做web端测试时,难免会遇到这样的一个情况:出现的bug,不知道是前端还是后端,这篇就为大家简单介绍几种比较好用的方法吧场景: 清晰的记得那天是项目要上线,但是由于某种原因,页面可以打开,但是 ...

如何定位前后端Bug

文章目录

1 定义

2 定位方法

3 实战

如何定位前后端Bug相关推荐

最新文章

热门文章