目录

1. 什么是 Fiddler？
2. Fiddler 的工作原理
3. 第一部分：安装 Fiddler
4. 第二部分：Fiddler 基础界面与配置
   • 界面概览
   • 必要的初始配置（信任 HTTPS 证书）
5. 第三部分：抓取与分析网络请求
   • 开始抓取
   • 理解会话列表
   • 查看请求/响应详情
6. 第四部分：Fiddler 常用功能与技巧
   • 使用筛选器
   • 断点调试
   • 修改请求/响应
   • 性能分析面板
7. 第五部分：Fiddler 高级用法（示例）
   • 手机抓包（模拟弱网环境）
   • 导出/导入会话
8. 第六部分：常见问题与注意事项

什么是 Fiddler？

Fiddler 是一个功能强大的 Web 调试代理工具，你可以把它想象成一个位于你的电脑和互联网之间的“中间人”或“交通警察”。

• 它做什么？ 它会截获你的电脑（或手机）上所有应用程序发出的 HTTP/HTTPS 请求，以及服务器返回的响应。
• 为什么用它？
  • 开发与调试： 查看前端页面到底请求了哪些接口，传了什么参数，返回了什么数据，帮助排查接口问题、性能问题。
  • 性能分析： 分析页面加载速度，找出哪些资源加载慢。
  • 接口测试： 手动构造请求，直接调用后端 API，进行测试。
  • 安全分析： 分析网站是否存在安全漏洞。
  • 学习与研究： 学习网站的架构、通信协议等。

Fiddler 的工作原理

Fiddler 的工作原理基于 HTTP 代理。

1. 你在浏览器或 App 中访问一个网站（如 www.example.com）。
2. 请求并不会直接发送到 www.example.com，而是先发送到 Fiddler 所在的代理地址（默认是 0.0.1:8888）。
3. Fiddler 接收到这个请求后，会将其显示在自己的界面上。
4. Fiddler 代表你的电脑，将请求转发到真正的目标服务器 www.example.com。
5. 服务器返回响应给 Fiddler。
6. Fiddler 同样将响应显示在界面上，然后再转发给你的浏览器或 App。

整个过程对你来说是透明的,你感觉不到中间有 Fiddler 的存在，但所有数据流都经过了它的“审查”。

第一部分：安装 Fiddler

步骤 1：下载

• 访问 Fiddler 官方下载页面：https://www.telerik.com/fiddler
• 点击 "Download Fiddler" 按钮，它有免费版和付费版，对于个人学习和普通调试，免费版完全够用。
• 下载完成后,你会得到一个名为 FiddlerSetup.exe 的安装文件。

步骤 2：安装

1. 双击运行安装文件。

2. 安装位置：可以选择默认路径，也可以自定义。

3. .NET 运行时：Fiddler 需要 .NET Framework 运行环境，如果你的系统较新，安装程序会自动检测并提示你安装，按照提示操作即可。

4. 信任根证书：这是最关键的一步！ Fiddler 能抓取 HTTPS 流量，是因为它会作为一个“中间人”，自己生成一个假的证书来伪装成目标网站，你的浏览器需要信任 Fiddler 的这个“根证书”，否则它会报证书不安全的错误。

   • 在安装过程中,会弹出一个窗口询问你是否信任 Fiddler 的根证书。务必勾选 "Yes"。
   • 如果错过了这个窗口,别担心，安装完成后，可以手动操作：点击菜单栏的 Tools -> Options... -> HTTPS 标签页，然后点击 Actions 按钮，选择 Trust Root Certificate。

5. 完成安装：点击 "Install" 或 "Finish"，等待安装完成。

步骤 3：启动 Fiddler

安装完成后,Fiddler 会自动启动，你会看到一个类似下图的主界面，Fiddler 已经开始监听本机的网络流量了。

第二部分：Fiddler 基础界面与配置

界面概览

• 菜单栏 & 工具栏：包含所有功能和快捷操作。
• 会话列表：这是 Fiddler 的核心区域，它会按时间顺序列出所有被截获的网络请求（也叫“会话”或 "Session"），每一行代表一个请求，包含方法、协议、主机名、路径、状态码、响应大小、耗时等信息。
• 请求/响应详情：当你选中会话列表中的任意一行时，这个区域会显示该请求的详细信息。
  • Inspectors 标签页：可以查看请求/响应的原始内容、头信息、body、图片、JSON/XML 格式等。
  • TextView：显示原始文本。
  • HexView：以十六进制格式显示。
  • Headers：显示请求头和响应头。
  • TextView (Body)：显示请求体或响应体。
  • JSON/XML：body 是 JSON 或 XML 格式，这里会以树形结构高亮显示，非常方便查看。
  • Auth：认证信息。
  • Cookies：Cookie 信息。
  • TextView (Raw)：显示完整的请求/响应原始数据。
• 状态栏：显示当前 Fiddler 的状态（如是否正在捕获）、过滤规则、搜索框等。

必要的初始配置（信任 HTTPS 证书）

如果安装时没有成功信任证书,现在必须手动配置，否则无法抓取 HTTPS 流量。

1. 点击顶部菜单栏的 Tools -> Options...。
2. 在弹出的窗口中,切换到 HTTPS 标签页。
3. 勾选以下两个关键选项：
   • Decrypt HTTPS traffic：必须勾选，这是让 Fiddler 解密 HTTPS 流量的核心开关。
   • Ignore server certificate errors (unsafe)：勾选此项可以避免 Fiddler 在抓取某些自签名证书的 HTTPS 网站时出现错误，对于调试环境，通常建议勾选。
4. 点击 Actions -> Trust Root Certificate，然后确认安装证书。
5. 重启 Fiddler 或浏览器，使配置生效。

第三部分：抓取与分析网络请求

开始抓取

Fiddler 启动后默认是“开启抓取”状态，状态栏会显示 Capturing...，如果抓取被暂停，点击工具栏上的 "Capture Traffic" 按钮（像一个播放按钮）即可重新开始。

查看请求/响应详情

1. 打开你的浏览器（如 Chrome、Edge），访问任意网站，https://www.baidu.com。
2. 切换回 Fiddler 界面，你会看到会话列表中出现了很多新的请求，其中包含 baidu.com 的域名。
3. 选中其中一个请求,www.baidu.com 的那条。
4. 在下方的 Inspectors 区域，你可以查看：
   • Headers：查看请求头，User-Agent（浏览器信息）、Accept（接受的类型）等。
   • TextView (Body)：查看请求体，通常是 POST 请求发送的表单数据。
   • Headers (Response)：查看响应头，Content-Type类型）、Set-Cookie（服务器设置的 Cookie）等。
   • JSON/XML (Response)：如果返回的是 JSON 数据，这里会清晰地展示出键值对，非常直观。

第四部分：Fiddler 常用功能与技巧

使用筛选器

当访问一个复杂网站时,会话列表会瞬间被大量请求塞满，很难找到目标，这时就需要使用筛选器。

1. 点击工具栏上的 "Filters" 按钮，或菜单栏的 Rules -> Filters...。
2. 在弹出的窗口中,你可以设置各种过滤规则。
   • Show only the following hosts：只显示特定主机的请求，只想看 api.example.com 的请求，就在这里输入 api.example.com。
   • Hide the following hosts：隐藏特定主机的请求，可以隐藏 www.google-analytics.com、stats.g.doubleclick.net 等无关的统计脚本请求，让列表更干净。
   • Status Codes：按状态码筛选，比如只显示 4xx (客户端错误) 或 5xx (服务端错误) 的请求。
3. 设置好后,点击 Actions -> Run Filterset now，或者直接关闭窗口，筛选器会自动生效。

断点调试

断点是 Fiddler 最强大的功能之一，它可以让你在请求发送前或响应返回后“暂停”下来，让你有机会修改请求数据或响应数据，然后再放行。

1. 设置断点：
   • 在会话列表中,右键点击你想要拦截的请求。
   • 选择 Breakpoints -> Before Requests (请求前断点) 或 After Responses (响应后断点)。
   • Before Requests：请求被发送到服务器前暂停，此时你可以修改请求的 URL、Header、Body 等。
   • After Responses：服务器返回响应，但响应还未到达浏览器前暂停，此时你可以修改服务器返回的数据、Header 等。
2. 触发断点：
   • 设置断点后,在浏览器中重新触发该请求。
   • Fiddler 界面会弹出一个 "Tamper with requests/responses" 的窗口，并暂停在那一行。
3. 修改与放行：
   • 在弹出的窗口中,你可以直接编辑请求或响应的内容。
   • 修改完毕后,点击 Run to Completion (放行) 或 Abort Session (终止请求)。

修改请求/响应

除了通过断点修改,你也可以直接在会话详情中修改。

1. 在会话列表中选中一个请求。
2. 在 Inspectors 区域，切换到 Headers 标签页，你可以直接修改请求头。
3. 切换到 TextView (Body) 标签页，你可以修改请求体或响应体。
4. 修改后,右键点击该会话，选择 Reissue (重新发送请求) 或 Repick from cache (从缓存重新获取)，或者使用快捷键 Ctrl+R (重新发送请求)。

性能分析面板

这个面板可以帮你快速定位页面加载的性能瓶颈。

1. 在浏览器中打开一个你想要分析的页面。
2. 在 Fiddler 的会话列表中，选中该页面的主请求（通常是 HTML 文件）。
3. 点击菜单栏的 View -> Hosts -> Timeline，或者直接点击工具栏的 "Timeline" 按钮。
4. 会弹出一个时间轴图,横轴是时间，纵轴是各个请求，通过这个图，你可以清晰地看到哪些资源加载耗时最长，以及它们的加载顺序。

第五部分：Fiddler 高级用法（示例）

手机抓包

要让手机上的 App 也能通过 Fiddler 抓包，需要进行以下配置：

1. 获取电脑 IP 地址：在 Fiddler 的状态栏，找到 Fiddler is listening on port 8888，后面的 IP 地址就是你的电脑 IP（通常是 168.x.x）。
2. 配置手机 Wi-Fi：
   • 连接和电脑同一个 Wi-Fi 网络。
   • 进入手机的 Wi-Fi 设置，找到当前连接的网络，点击 "修改网络" 或 "高级选项"。
   • 在代理设置中,选择 "手动"。
   • 代理主机名填入你电脑的 IP 地址，代理端口填入 8888。
3. 在手机上安装 Fiddler 的根证书：
   • 手机需要信任 Fiddler 的证书，否则 App 会因为证书不安全而拒绝连接。
   • 在电脑的 Fiddler 中，点击菜单栏 Tools -> Options... -> HTTPS。
   • 点击 Export Root Certificate to Desktop，将证书导出到桌面。
   • 将证书文件（.cer）通过微信、QQ 等方式发送到手机。
   • 在手机上打开这个证书文件,根据提示安装到“受信任的凭据”或“证书存储”中。
4. 开始抓取：手机上打开 App，访问网络，Fiddler 就能抓到手机的数据包了。

模拟弱网环境

Fiddler 可以模拟网络延迟和丢包，方便测试 App 的弱网表现。

1. 点击菜单栏 Rules -> Performance -> Simulate Modem Speeds。
2. 开启后,所有请求都会被人为地增加延迟（模拟 56K 拨号上网的速度）。
3. 你还可以通过 Rules -> Customize Rules... 来编写更复杂的模拟规则，比如随机丢包。

第六部分：常见问题与注意事项

• Q: Fiddler 抓不到浏览器的请求？

  • A: 检查 Fiddler 是否正在运行（状态栏是否显示 Capturing），检查浏览器是否设置了其他代理（VPN 或系统代理），尝试禁用其他代理软件。

• Q: 抓不到 HTTPS 请求，浏览器提示证书不安全？

  • A: 这是最常见的问题，请务必按照教程，在 Tools -> Options -> HTTPS 中勾选 Decrypt HTTPS traffic 并信任根证书，之后需要重启浏览器和 Fiddler。

• Q: 为什么 Fiddler 抓不到 App 的请求？

  • A: App 可能使用的是 HTTPS 并且做了证书校验（不信任中间人证书），有些 App 甚至使用的是非 HTTP/HTTPS 协议（如 WebSocket、Socket），对于前者，可以尝试在 Options -> HTTPS 中勾选 Ignore server certificate errors，对于后者，Fiddler 无能为力。

• Q: Fiddler 会不会泄露我的个人信息？

  • A: Fiddler 本身是一个本地工具，它抓取的数据都在你自己的电脑上，但请务必注意：不要将包含敏感信息（如密码、Token）的会话截图或分享给他人。

• 安全提醒：Fiddler 功能强大，但请不要用于非法用途，如窃取他人数据、破解网站等，请遵守法律法规和道德规范。