必须通过firefox开发者工具的network面板调试网页加载、接口异常和性能问题：先用快捷键打开并启用录制，再触发请求、筛选定位，查看headers/response详情，启用持久日志保留跨页记录，最后可导出har文件供离线分析。
如果您在使用火狐浏览器（Firefox）时需要调试网页加载过程、排查接口异常或分析资源加载性能，则必须通过开发者工具的 Network 面板查看完整的网络请求详情。以下是具体操作步骤：
一、打开 Firefox 开发者工具并切换到 Network 面板
Network 面板是 Firefox 内置的网络流量监控模块，用于实时捕获页面发起的所有 HTTP/HTTPS 请求，包括请求头、响应头、响应体、状态码、耗时及资源类型等信息。
1、在目标网页处于激活状态时，按下 Ctrl + Shift + E（Windows/Linux）或 Cmd + Option + E（macOS）快捷键，直接打开开发者工具并定位至 Network 面板。
2、若开发者工具已打开但未显示 Network 面板，点击顶部标签栏中的 Network 选项卡即可切换。
3、确保左上角的录制按钮（圆形图标）处于高亮激活状态，否则将不会捕获任何请求；若为灰色，则需点击一次以启用网络监听。
二、触发并筛选目标网络请求
Network 面板默认仅记录页面刷新后的新请求，因此需主动触发目标行为（如点击按钮、提交表单），才能捕获对应请求。同时可利用过滤功能快速定位特定资源。
1、在网页中执行预期操作（例如点击“登录”按钮），使前端发起新的 XHR 或 Fetch 请求。
2、在 Network 面板顶部的过滤输入框中，输入关键字（如 api、login、.js）以缩小列表范围。
3、点击左侧请求列表中的某一项，在右侧区域将自动展开其详细信息，包括 Headers、Cookies、Preview、Response、Timing 等子标签页。
三、查看请求与响应的完整内容
选中任一请求后，右侧面板提供结构化视图，用于逐层检查协议交互细节，其中 Headers 和 Response 是诊断问题的核心区域。
1、在 Headers 标签页中，可查看 Request URL、Method、Status、Remote Address，并向下展开 Request Headers 和 Response Headers 全部字段。
2、在 Response 标签页中，若服务器返回 JSON、HTML 或文本内容，将直接以可读格式渲染；若为二进制数据（如图片、PDF），则显示为十六进制预览。
3、右键点击某请求条目，选择 Copy → Copy as cURL 可复制该请求的命令行调用形式，便于复现或调试。
四、启用持久日志与重放功能
默认情况下，Network 面板仅保留当前页面生命周期内的请求；启用持久日志后，可在跨页面跳转或刷新后继续保留历史记录，便于追踪多步流程。
1、点击 Network 面板右上角的齿轮图标（设置按钮），勾选 Enable persistent logging。
2、刷新页面或导航至其他路由后，先前捕获的请求仍保留在列表中，不会被清空。
3、右键任意已记录请求，选择 Resend，可重新发送该请求（含原始 Header 与 Body），用于验证服务端响应是否一致。
五、导出网络活动数据供离线分析
当需要将请求记录提交给后端团队或进行跨环境比对时，可将整个 Network 日志导出为标准 HAR（HTTP Archive）文件，该格式被多数分析工具支持。
1、确保 Network 面板中已捕获所需全部请求。
2、右键请求列表空白处，选择 Save all as HAR...。
3、指定保存路径并确认，生成的 .har 文件可用 Chrome DevTools、HAR Analyzer 或 curl 等工具解析。
