持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第15天,点击查看活动详情
记录网络请求
默认情况下,只要 DevTools 处于打开状态,DevTools 就会在 network 面板中记录所有的网络请求。
停止记录网络请求
- 点击面板上的
,它变成灰色表示 DevTools 不再记录请求。
清除请求
点击面板上的 清除 requests 表中的所有请求。
跨页面加载保存请求
要跨页面加载保存请求,点击 Preserve log 选项,会保存所有请求。
在页面加载期间捕获屏幕截图
捕获屏幕截图以分析用户在等待您的页面加载时看到的内容。
将鼠标悬停在屏幕截图上以查看该屏幕截图的截取点。概述窗格上会出现一条黄线。
单击屏幕截图的缩略图以过滤掉在捕获屏幕截图后发生的任何请求。
双击缩略图以放大它。
重放 XHR 请求
禁用浏览器缓存
DevTools 禁用浏览器缓存。这更准确地模拟了首次用户的体验,因为请求是在重复访问时从浏览器缓存中提供的。
手动清除浏览器缓存
要随时手动清除浏览器缓存,请右键单击请求表中的任意位置并选择清除浏览器缓存。
离线 和 慢速网络连接 模拟
模拟完全离线的网络体验,也可以切换模拟 2G、3G 和其他连接速度。选择 Custom > Add 添加自定义。
DevTools 在Network 选项卡旁边显示一个警告图标,提醒限制已启用。
手动清除浏览器 cookie
要随时手动清除浏览器 Cookie,请右键单击请求表中的任意位置并选择清除浏览器 Cookie。
覆盖用户代理
过滤请求
隐藏数据 URL
数据 URL是嵌入到其他文档中的小文件。您在请求表中看到的任何以开头的请求data:都是数据 URL。
选中隐藏数据 URL复选框以隐藏这些请求。
查看 HTTP 标头
查看有关请求的 HTTP 标头数据:
- 单击请求表的名称列下的请求 URL。
- 单击标题选项卡。
查看响应正文的预览
查看响应正文的预览:
- 单击请求表的名称列下的请求 URL。
- 单击预览选项卡。
此选项卡主要用于查看图像。
查看响应正文
查看请求的响应正文:
- 单击请求表的名称列下的请求 URL。
- 单击响应选项卡。