“网络”面板:分析网络负载和资源
使用集合让一切井井有条
根据您的偏好保存内容并对其进行分类。
使用 Network 面板分析网页加载和检查网络资源。
概览
通过 Network 面板,您可以:
有关探索部分最常用的网络面板功能的指导教程,请查看检查网络活动。
打开“网络”面板
如需打开 Network 面板,请打开开发者工具,然后点击顶部操作栏中的 Network。
或者,要通过命令菜单打开网络面板,请按以下步骤操作:
- 打开开发者工具。
- 按如下键打开命令菜单:
- macOS:Command + Shift + P
- Windows、Linux、ChromeOS:Ctrl + Shift + P
- 开始输入
Network
,选择显示网络面板,然后按 Enter 键。
录制网络活动
当您打开开发者工具时,只要开发者工具已打开,网络请求就会自动记录在 Network 面板中。
除了录制,您还可以执行以下操作:
检查网络请求
所有网络请求都会记录在面板中央的 Requests 表格中。
如需详细了解默认显示的列以及您可以添加的其他列,请参阅查看请求日志。
点击某项请求的名称,查看相关标签页,其中包含有关该请求的其他信息,包括:
- Headers:所选资源的 HTTP 标头。
- 载荷:请求的查询字符串参数和表单数据。
- 预览:HTML 的基本呈现。
- 响应:所选资源的 HTML 源代码。
- 发起者:导致请求资源的原因。
- 时间:所选资源的网络活动细分数据。
- Cookie:请求及其响应的 Cookie。
对网络请求进行过滤和排序
Network 面板为您提供了两种对 Requests 表格中的请求进行排序的方法:
您可以通过以下几种方法在 Requests 表中过滤请求:
搜索网络标头和响应
要了解如何在特定字符串或正则表达式中搜索所有资源的 HTTP 标头和响应,请参阅搜索网络标头和响应。
更改加载行为
您可以通过在网络面板中更改加载行为来测试网页的用户体验。
使用网络面板,您可以执行以下操作:
保存和导出网络请求数据
如需保存和导出网络请求数据,请参阅以下内容:
如未另行说明,那么本页面中的内容已根据知识共享署名 4.0 许可获得了许可,并且代码示例已根据 Apache 2.0 许可获得了许可。有关详情,请参阅 Google 开发者网站政策。Java 是 Oracle 和/或其关联公司的注册商标。
最后更新时间 (UTC):2024-07-26。
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"没有我需要的信息"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"太复杂/步骤太多"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"内容需要更新"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"翻译问题"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"示例/代码问题"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"其他"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"易于理解"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"解决了我的问题"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"其他"
}]
{"lastModified": "\u6700\u540e\u66f4\u65b0\u65f6\u95f4 (UTC)\uff1a2024-07-26\u3002"}
[[["易于理解","easyToUnderstand","thumb-up"],["解决了我的问题","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["没有我需要的信息","missingTheInformationINeed","thumb-down"],["太复杂/步骤太多","tooComplicatedTooManySteps","thumb-down"],["内容需要更新","outOfDate","thumb-down"],["翻译问题","translationIssue","thumb-down"],["示例/代码问题","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["最后更新时间 (UTC):2024-07-26。"],[],[]]