功能测试必备：抓包工具之谷歌开发者工具介绍及使用场景

大家好啊，我是大田

2022.03.31，日更第54 / 365 天。

如果想在 Web 端抓取网络报文，就打开一个浏览器页面，按快捷键 F12 ，点击 NetWork，即可看到。

一、四个操作：

1、小红点代表抓包标志，点击一下变灰，就停止抓包了

2、清空操作，清空当前页面报文

3、查看报文

4、过滤操作（过滤器）：一般默认都选择ALL

二、举个例子看一下报文：

如下图所示（一般关注前三个就可以了）

1、Response ：响应数据，看接口返回数据或者是 html 代码。

2、Headers ：代表头信息，Request URL 一般需要我们去对照接口文档去看。

3、Preview ：预览数据，简化版页面。

三、总结开发者工具使用场景：

1、直接在谷歌浏览器中使用。如果你既没安装 Fiddler 也没安装 Charles 那么你可以直接使用谷歌浏览器的 F12 开发者工具。

2、能调试接口（ 按照上文的四个步骤 ）。

3、谷歌浏览器开发者工具不能直接设置断点，而火狐浏览器开发者工具是可以设置断点的。

4、不能抓取移动端数据报文。

ps：一般在测试工作中，是将开发者工具和 Fiddler 结合或者将开发者工具和 Charles 结合使用。

往期推荐文章：

1、功能测试必备：抓包工具的作用及常用抓包工具有哪些？

2、测试人员如何提升技术视野？

3、软件测试工作中质量度量

今天就到这啦，关注我看更多软件测试干货，end ~