Chrome开发者工具Network面板可抓包HTTP/HTTPS请求：打开检查→切Network→开Preserve log→筛XHR/Fetch→查Headers与Response→硬刷清缓存。
如果您需要捕获网页与服务器之间传输的HTTP/HTTPS请求数据，以便分析接口行为、调试前端逻辑或构建爬虫，谷歌浏览器内置的开发者工具可直接完成抓包任务。以下是具体操作步骤：
一、打开开发者工具并进入Network面板
Network面板是Chrome中用于实时捕获和展示所有网络请求的核心模块，它能记录页面加载及后续交互过程中发出的全部资源请求，包括HTML、JS、CSS、XHR、Fetch等类型。
1、在目标网页任意空白区域右键，选择“检查”。
2、或使用快捷键：Windows/Linux按Ctrl+Shift+I，Mac按Cmd+Option+I。
3、点击顶部标签栏中的“Network”选项卡切换至网络监控界面。
4、确认左上角圆形录制按钮为红色；若为灰色，请点击启动实时捕获。
二、确保捕获完整请求链路
默认状态下，页面跳转或刷新会清空Network面板历史记录，导致关键请求丢失。启用Preserve log可保留跨页操作产生的全部请求日志，尤其适用于单页应用（SPA）或多步表单流程分析。
1、在Network面板顶部Controls区域，勾选“Preserve log”复选框。
2、执行页面跳转、点击按钮、提交表单或触发路由变化等操作。
3、返回Network面板，确认此前各阶段请求仍保留在列表中，可连续比对耗时与响应内容。
三、过滤并定位目标请求
面对大量并发请求，需通过分类与关键词组合筛选快速聚焦有效数据。Fetch/XHR类型通常承载动态API调用，是分析后端接口的首要关注对象。
1、点击Network面板顶部过滤栏中的“XHR”或“Fetch”标签，仅显示异步请求。
2、在过滤搜索框中输入关键词，例如接口路径片段（如/api/user）、参数名（如token）、响应字段（如username）等。
3、若仍存在多个匹配项，可右键某请求 → 选择“Reveal in Network Panel”，或使用全局搜索（Ctrl+F / Cmd+F）在Preview或Response中查找明文内容。
四、查看请求与响应详情
点击任一请求条目后，右侧展开面板提供完整的协议级信息，涵盖请求头、响应头、原始响应体、预览视图及时间轴分布，是验证参数构造与服务端行为的关键依据。
1、在Headers标签页下，查看Request URL、Request Method、Status Code、Remote Address等General信息。
2、向下滚动至“Request Headers”与“Response Headers”区域，确认User-Agent、Cookie、Authorization、Content-Type等关键字段是否符合预期。
3、切换至Preview或Response标签页，查看JSON/XML格式的响应数据结构；若为二进制内容，可切换至Response → “View source”查看原始字节流。
五、清除缓存并强制重新加载以排除干扰
浏览器缓存可能导致请求未真实发出，从而无法捕获到目标接口。硬刷新可绕过缓存机制，确保所有资源均从服务器重新拉取，使抓包结果反映真实网络行为。
1、在Network面板开启前提下，按下快捷键：Windows/Linux按Ctrl+Shift+R，Mac按Cmd+Shift+R。
2、或右键刷新按钮 → 选择“清空缓存并硬性重新加载”。
3、观察Requests Table中是否出现大量状态码为200（而非304）的请求，确认缓存已被绕过。
