大家好啊,我是大田

2022.03.31,日更第 54 / 365 天。

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

一、四个操作:

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

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

3、查看报文

4、过滤操作(过滤器):一般默认都选择ALL

谷歌自带抓包工具(抓包工具之谷歌开发者工具介绍及使用场景)(1)

谷歌自带抓包工具(抓包工具之谷歌开发者工具介绍及使用场景)(2)

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

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

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

谷歌自带抓包工具(抓包工具之谷歌开发者工具介绍及使用场景)(3)

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

谷歌自带抓包工具(抓包工具之谷歌开发者工具介绍及使用场景)(4)

3、Preview :预览数据,简化版页面。

谷歌自带抓包工具(抓包工具之谷歌开发者工具介绍及使用场景)(5)

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

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

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

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

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

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

往期推荐文章:

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

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

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

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

,