启动Chrome时开启远程调试

关键功能详解

• 筛选请求：可过滤XHR/JS/图片等类型
• 查看详细信息：点击任一请求查看：
  • Headers：请求头、响应头、参数
  • Preview/Response
  • Timing：请求时间线
• 导出数据：右键 → Save all as HAR

高级抓包技巧

移动端调试

// 手机连接电脑调试
1. 手机和电脑同一WiFi
2. 浏览器输入：chrome://inspect/#devices
3. 启用USB调试连接手机

断点调试

• XHR/Fetch断点：Sources → XHR Breakpoints
• 修改请求：右键请求 → Block request URL

命令行监控

配合外部工具

代理工具

• Charles/Fiddler：设置代理端口8888
• mitmproxy：命令行代理工具
• Whistle：国产跨平台代理

浏览器设置代理

1. 安装SwitchyOmega扩展
2. 配置代理服务器
3. 配合抓包工具使用

常见问题解决

抓不到HTTPS请求？

1. 安装证书：

   • 抓包工具生成CA证书
   • 导入到系统/浏览器信任证书

2. Chrome设置：

   chrome://flags/#allow-insecure-localhost
   设置为 Enabled

请求被过滤？

• 关闭广告拦截扩展
• 检查Network面板的筛选条件
• 使用无痕模式排除插件影响

实用技巧

1. 性能分析：

   • 使用Performance标签记录性能
   • Lighthouse生成优化建议

2. 自动化脚本：

   // 控制台直接发送请求
   fetch('/api/data', {method: 'GET'})
     .then(res => res.json())
     .then(console.log)

3. 复制为cURL：

   • 右键请求 → Copy → Copy as cURL
   • 可直接在终端或Postman中使用

注意事项

• 生产环境谨慎操作,避免影响用户体验
• 涉及敏感数据需遵守法律法规
• 移动端抓包需要真机调试权限

这些方法能满足日常开发调试需求,如需更专业功能可考虑配合Wireshark等网络分析工具。