《吐血整理》高级系列教程-吃透Fiddler抓包教程(24)-Fiddler如何优雅地在正式和测试环境之间来回切换-中篇

1.简介

在开发或者测试的过程中，由于项目环境比较多，往往需要来来回回地反复切换，那么如何优雅地切换呢？宏哥今天介绍几种方法供小伙伴或者童鞋们进行参考。

2.实际工作场景

2.1问题场景

（1）已发布线上APP出现接口错误，如何测试线上APP访问本地请求？

（2）已发布线上H5页面，静态资源或js调试，如何映射本地js？

2.2一般解决方案

猜测（一般明显问题）、找到原发布包，修改请求资源url重新打包测试。需要前后端协调配合，耗时费力。

2.3聪明人解决方案

fiddler映射响应：

通过fidder拦截，将需要加载的资源映射到本地开发环境，而无需切换测试版APP

例如线上资源：http://online.com/api/page

映射加载本地资源：http://127.0.0.1/api/page

3.切换实战

3.1插件（Stave插件）

Stave是一个Fiddler扩展插件，让Fiddler能将URL映射到本地目录，实现批量文件自动响应。

Fiddler自带的AutoResponder每条自动响应规则只能对应一个本地文件， 在文件数目较多的时候，使用起来很不方便，往往需要部署到本地web服务，有了Stave插件(扩展)，一个URL匹配可以对应一个本地目录，URL规则也支持通配符，前端调试方便多了。

除支持URL映射到目录之外，还支持URL到URL的替换。

Stave扩展并不影响原本的AutoResponder功能，两者可以共同起作用。具体操作步骤如下：

1.下载Stave插件，这个可费了大劲了，首先宏哥得FQ访问这个插件的官网，可以访问官网了，结果一下载，才发现已经不维护了，下载链接已经失效了，然后在csdn上找到了一个，结果还要积分，充值后用价格不菲的积分下载了，完全不能用，后来才发现后边有评论已经说了不好用，怪我咯没有看请就着急地下载了，果然是心急吃不了热豆腐，后来辗转查资料各种找，终于下载了一款可以用的。如果你也发现下载特别费劲，那就关注宏哥的公众号“北京宏哥”后，发送“stave”关键字，来获取下载此插件安装包的方式吧！如下图所示：

2.双击安装包后，出现安装完成的，如下图所示：

3.重启Fiddler后，在右边的选项卡中没有看到这个插件，宏哥然后点击上图中的“Show detail”后，查看插件的安装目录，如下图所示：

4.根据安装目录找到安装的插件文件，如下图所示：

5.将Stave.dll文件拷贝到安装Fiddler的插件目录下，如下图所示：

6.重启Fiddler，可以在Fiddler的选项卡中看到这个Stave插件，一个音乐符号的图标，如下图所示：

从上图我们不难看出：本身stave插件的实列如上2个，第一个是替换单个文件的，第二个是替换目录的。接下来跟随宏哥一起来看看它们的如何配置的，具体步骤如下：

1.选中一个实例，右键-->编辑，如下图所示：

2.点击“编辑”后，打开编辑界面，如下图所示：

可以看到如上配置，我们回归今天文章的主题先来实践下吧！例如：还是要将百度首页的切换成博客园首页，具体操作步骤如下：

1.首先点击右侧,右键 --> 添加,如下图所示：

2.弹出添加规则页面，添加规则，点击“确定”，如下图所示：

3.浏览器访问百度，发现网址是www.baidu.com,但是浏览器访问的却是博客园首页，如下图所示：

3.2插件（Willow）

我们可以把Willow插件当作是AutoResponder工具和Tools —> HOSTS...功能的加强版。但是Willow插件对于Windows系统中的hosts文件的管理更加的丰富，可以根据不同的环境，比如测试环境，开发环境等，采用不同的主机规则。同理Willow插件对于AutoResponder工具也是一样的，Willow插件可以用工程的方式，来区分不同环境所需要的主机规则和自动响应规则，这个功能就非常的实用。

这款插件宏哥在讲解和介绍Fiddler的精选插件部分就已经重点介绍过了，这里就不做赘述了，宏哥这里直接演示如何使用，具体操作步骤如下：

1.在Willow插件中，右键Add Project(Ctrl+P)。如下图所示：

2.填写项目的名称为：demo，如下图所示：

3.选中项目，右键Add Rule(Ctrl+U)，如下图所示：

4.填写Match(原始会话)和Action(替换动作)，如下图所示：

5.再次刷新百度首页后，发现网址是www.baidu.com,但是浏览器访问的却是博客园首页，这是因为在访问百度首页网址的时候，Fiddler自动地将其替换成博客园的首页网址。如下图所示：

6.这款插件会把重定向的会话标识上颜色，如下图所示：

4.小结

 Willow插件比Stave插件强大很多，而且Stave的功能，Willow插件都可以做到，这样Willow可以完全替代Stave插件，可能是因为这个原因官网不维护了，也可能是由于资金等其他原因。好了，今天时间也不早了，宏哥就讲解和分享到这里，感谢你耐心地阅读！！！