Fiddler调试技巧

Fiddler是个很强大的抓包代理工具，它在远程调试、模拟请求等方面都提供了强大的功能支持。下面将列出一些在我工作中使用到的比较实用的技巧。

手机连接代理调试

这个是移动端开发中非常常用的技巧，在PC端可以直接在chrome上F12查看网络请求等数据，但在手机端却看不到这些数据，所以我们可以利用Fiddler来抓包调试。非常简单，直接手机上配置Fiddler代理地址即可，代理地址为你PC端ip:Fiddler端口号：

Fiddler连接远程服务器

代理服务器就像一个个拦截器，网络请求可以经过多个代理服务器，所以你可以在你的Fiddler上配置下一个代理服务器。例如，为了本地开发时域名跟生产保持一致，我们可能使用nginx代理服务器做处理，那么如果你将页面代理到本地Fiddler上而不做其他配置，就没有经过原来的nginx代理，这样可能会导致一些问题，所以你可以在Fiddler上配置下一个代理。配置方法也很简单，如下图：

伪造数据返回

在开发过程中，可能会遇到后端接口未给出，前端页面已开发完成了，这时难道我们就只能苦等后端给接口来联调吗？no！这时我们可以自己做本地调试：根据接口文档拟一份json数据，Fiddler拦截请求并返回本地json数据：

强大的Fiddler Script

Fiddler Script是Fiddler的一个脚本文件，是用JScript.NET语言编写的，类似C#，可以修改其代码，修改后无需重启Fiddler代码会马上生效。可以上Fiddler插件官网下载FiddlerScript Editor，支持语法高亮等。不多说，直接贴图：

下面举两个修改Script脚本的栗子：

模拟低网速网络环境

页面的一些样式问题可能是由于低网速造成的，如果想调试这种情况，哈，Fiddler刚好也有这种技能哦。下面是Script脚本中定义请求延时和响应延时的相关代码：

默认值是300和150，可以按需修改数值，然后再应用：（如果不打勾，上面的m_SimulateModem为false，不会有网络延迟）

模拟跨域

聪明的童鞋可能看出上面“伪造数据返回”可能会有跨域问题，如果前后端异域（什么是跨域？请参考我的另一篇文章），就会有跨域的问题。根据CORS原理，可以使用Fiddler来解决这种问题。假设前端域名client.com发ajax请求给后端server.com，可如下配置解决跨域问题：

console日志打印

为了调试方面，我们经常会使用console打印日志到控制台，在Chrome开发者工具下可以看到输出结果。但是在移动端呢，可能我们会选择用alert这种龊到爆的方式解决吧(╯^╰〉，好吧，我之前就是用这么龊的方法。。
后来被我发现了一个好用的插件，微信团队产的rosin。他们家的文档写得很详细了，这里就不再赘述了，请看文档：http://alloyteam.github.io/Ro...