谷歌浏览器（Chrome）自带的开发者工具是功能强大的抓包工具。以下是详细使用指南

打开开发者工具

常用方法：

1. 快捷键：

   

   • Windows/Linux：F12 或 Ctrl + Shift + I
   • Mac：Cmd + Option + I

2. 右键菜单：

   在网页任意位置右键 → “检查”

3. 菜单栏：

   点击右上角三个点 → 更多工具 → 开发者工具

网络抓包（Network面板）

进入Network面板

• 打开开发者工具后,点击顶部“Network”标签

基础操作：

• 开始/停止记录：圆形按钮（红色表示正在记录）
• 清除记录：垃圾桶按钮
• 保留日志：勾选“Preserve log”可保留页面跳转时的请求
• 禁用缓存：勾选“Disable cache”避免缓存干扰

查看请求详情：

• 点击任一请求，右侧会显示详细信息：
  • Headers：请求头、响应头
  • Preview：格式化预览响应内容
  • Response：原始响应数据
  • Cookies：Cookie信息
  • Timing：请求时间线

高级抓包技巧

过滤请求：

• 按类型过滤：XHR（Ajax请求）、JS、CSS、Img等
• 按关键字过滤：在过滤框输入关键词
• 按域名过滤：输入 domain:example.com
• 按状态码过滤：如 status-code:404

复制请求信息：

• 右键请求 → Copy → 可选择：
  • Copy as cURL（命令行重放）
  • Copy request headers
  • Copy response
  • Copy all as HAR（导出为HAR格式）

修改请求并重放：

• 右键请求 → Copy as fetch
• 在Console面板粘贴并修改参数后执行

断点调试：

• 在Sources面板 → XHR/fetch Breakpoints
• 可设置断点拦截特定请求

移动端抓包

远程调试（Android）：

1. 手机开启USB调试
2. 用USB连接电脑
3. Chrome访问 chrome://inspect/#devices
4. 点击对应设备的“Inspect”

模拟移动设备：

• 点击开发者工具左上角手机图标
• 可选择设备型号、网络速度、User Agent等

实用扩展插件

1. Talend API Tester - REST API测试
2. ModHeader - 修改请求头
3. EditThisCookie - Cookie管理
4. JSON Formatter - JSON美化

抓包实战示例

抓取API请求：

1. 打开Network面板
2. 勾选“Preserve log”
3. 在网站进行操作（如登录、搜索）
4. 过滤XHR请求
5. 分析请求参数和响应

调试技巧：

• 对可疑请求右键 → Block request URL（阻止请求测试功能）
• 使用Replay XHR重放请求
• 在Initator列查看请求调用栈

注意事项

1. HTTPS请求：Chrome可直接查看，无需额外配置
2. WebSocket：Network面板可监控WS连接
3. 性能影响：抓包时可能降低页面加载速度
4. 隐私保护：避免在生产环境泄露敏感数据

导出与分析

• 导出HAR文件：右键请求列表 → Save all as HAR
• 导入到其他工具：可导入到Postman、Charles等
• 性能分析：结合Performance面板分析加载性能

掌握这些技巧后,你可以有效分析网页的网络行为，调试API接口，优化网站性能。

标签： Chrome开发者工具 抓包工具