课程大纲

一、录制请求

① tab导航选择“网络”（Network），即可进入网络抓包界面，进入界面默认开启录制模式，显示浏览器当前标签页的请求列表。

② 查看请求列表，包含了当前标签页执行的所有请求和下载的资源，列表显示每条请求的相应内容。

还可以在字段行单击右键，勾选想要查看的字段。

③ 单击列表项的“名称”，可以查看请求的详细内容。接口请求和资源类请求的详情字段稍有不同。

接口类请求详情

资源类请求详情

二、请求详情介绍

（此篇不再赘述http请求的详解，您可以查看“接口基础知识”合集进行学习）

请求详情字段包含：

• 标头（Headers）
• 载荷（Payload）
• 响应（Response）
• 预览（Preview）
• 启动器（Initiator）
• 时间（Timing）
• Cookie

标头（Headers）：请求常规信息、响应头、请求头。

载荷（Payload）：请求体。会自动编排格式后显示，可以查看源代码，如果是url参数，还可以查看url编码格式的数据。

响应（Response）：服务器返回内容。

预览（Preview）：响应解析后的内容。

如：返回内容是html标签，预览则解析为html网页进行显示；返回内容是资源类，可能两者一样如css、js文件都显示文件内容。

响应	预览

启动器（Initiator）：触发请求的源头。显示是通过哪个页面或者脚本发起了该请求。用于调试和追踪请求的起源。

时间（Timing）：完成请求消耗的时间。包含请求开始时间、DNS 解析时间、连接时间、服务器响应时间、内容下载时间等。可以用来分析、优化请求性能。

Cookie：请求和响应的Cookie。

三、前后端缺陷定位

在测试基础理论课程中，我们讲过bug从前到后的定位方法，《测试基础：缺陷（bug）生命周期和缺陷（bug）管理规范》

3、缺陷（bug）定位方式
按照以下顺序（从前到后）依次排查，直至定位到问题：

1. 结果与预期不符，尝试复现确认，避免偶然性问题。检查操作是否正确、对需求的理解、技术方案是否理解正确、网络原因；
2. 排查前端。使用浏览器右键“检查”（F12），查看是否请求了接口、接口返回是否正确；
3. 服务器日志信息是否正确；
4. 排查后端接口。使用接口请求工具（如postman/jmeter），使用测试数据请求后端接口，查看返回是否正确、服务器日志信息是否正确；
5. 排查后端逻辑。查看服务器日志，检查后端代码逻辑、sql语句等是否正确；
6. 排查数据库。查看数据库数据，检查数据是否存在、正确；
7. 排查环境。根据系统实现方式，查看前端/后端配置文件、后台、底层可能的因素、测试环境因素。

关于第2点“排查前端”再细化，即打开“检查”工具后出现以下几种情况，可区分前后端问题：

进一步简要查找前端问题，可如下操作：

① 通过“网络”右上角问题提示，可排查是否js错误；

② 查看tab导航“控制台”，排查js错误。