Bug的前后台分类及定位技巧

必备工具：Firefox debug工具

一般浏览器F12即可

 

---

如何区分页面的bug问题归属：前端or后端

前端bug主要分为3个类别：HTML,CSS,Javascript三类问题

给个最大的区别方式方法：

• 出现样式的问题基本都是CSS的bug
• 出现文本的问题基本都是html的bug
• 出现交互类的问题基本都是Javascript的bug

 

---

1 页面布局，元素大小，颜色，层级等样式；

点击，hover，弹窗，视频，图片轮播，跑马灯等页面效果   属于前端问题

->技巧

可以在html及css中查看到错误，有的问题肉眼不好判断，必须用数值对照，例如字号，色值，元素大小，距离大小等

 

2 元素不存在

• 查看是否接口交互数据
• 交互数据的接口返回值是否存在
• 返回值结构是否正确（值对应错误的情况，或者前后台解析不一致），返回值是否合法（可能会有转换错误的问题）

 

3 元素显示错误

同上2

 

4 检验类问题

• 区分:后台问题，接口会返回错误
• 业务上的bug:一般性检验仅前台做，重要的，例如涉及金钱类的，前后台都需要检验（一方不做也属于bug，因为前台不可靠，可通过多种方式规避前台检验，或者使用接口的方式直接传数据进入后台）

 

5 数据计算类问题，逻辑类问题（业务相关）

 

6 经常查看console,请求数据看是否异常

举例:

• 反复请求同一资源
• 请求资源速度慢
• 异常报错，也许一般情况下不影响功能
• 打印密码等敏感信息

 

7 存储类问题

视频或者图片丢失，是否上传路径错误

-通过html可以查看

保存之后，回显错误或者其他功能调用该数据错误（发短信等）

-极可能未存入数据库，或者存储与解析不一致，字段溢出

 

8 权限类问题

• 表现:提示无权限，或者可以查看非权限下内容
• 类型:可配置权限，代码定义权限
• 配置权限产生的问题，配置错误
• 业务数据权限（业务上需要控制权限的内容，跨客户查数据等）

 

9 安全性问题

• 敏感信息加密
• 防刷，反复点击，并发请求