使用 Fiddler 代理调试本地手机页面

转载至：http://www.yyyweb.com/2782.html

从事前端开发的同学一定对 Fiddler 不陌生，它是一个非常强大的http(s)协议分析工具，如果你不知道它是什么，可以自行 Google 一下，本文不再作科普，简单的说它可以代替Chrome开发人员工具中 Network 面板或 Firefox 的 HttpWatch 插件的功能。

我们知道如何在电脑上调试页面请求，但在手机端你没有这么多强大好用的调试工具来调试你的webapp，如果你需要查看在手机上打开页面时，所产生的http请求却又不知道怎么做，那就继续往下看。（当然，大部分情况下，你可以直接在电脑上用Chrome或Firefox模拟手机浏览器来看）

Fiddler支持代理的功能，也就是说你所有的http请求都可以通过它来转发，Fiddler代理默认使用端口8888，不知道的同学有可能因此无法使用FQ，因为端口冲突。

利用这点，我们可以在手机端设置http代理为Fiddler的代理服务器，使得手机应用的请求都通过Fiddler来转发，从而实现查看手机端页面请求的功能。

首先我们打开Fiddler->Tools->Fiddler Options在Connection面板里将Allow remote computers to connect勾选起来，确定后，关闭Fiddler并重新打开Fiddler。

 

此时，为了确保代理是正常工作的，我们可以在cmd里执行netstat -anop tcp查看Fiddler进程是否正常监听8888端口，如果服务没有正常开启，可以尝试使用其他端口，端口修改的位置，如上图位置。

 

 

从上图我们看到，进程ID为8392的Fiddler正在监听8888端口，说明代理已经在工作了。那么接下来我们要把手机端的代理设置为Fiddler的代理，代理设置需要一个ip和一个端口，ip就是Fiddler所运行的电脑的无线局域网ip地址，端口默认是Fiddler代理的端口8888，请确保手机所在的网段可以访问到电脑所在的网段，同一个局域网里一般没什么问题。

无线局域网ip的查看方式

无线局域网ip的查看方式直接在cmd中输入ipconfig命令后查看，如下红框内的则为无线局域网ip：

 

 

手机端的代理设置

 手机端的代理设置方法如下，每个手机修改网络的方式不同，根据自己的手机来定哦，下面是我自己的手机

 

 长按上图中wifi的信号标（此wifi就是你电脑的网络）然后出现了修改网络的弹框，点击修改网络，进入如下对画框：

 

 点击上图的代理弹出相应的对话框，然后选择手动，然后输入无线局域网的ip，和fiddler那里设置的端口，设置好后点击保存就完事啦：

 

 

 

接下来让我们来测试一下效果。

在手机端打开豆瓣，看下Fiddler监听到的请求：

 

正如我们所期望的，你可以开始调试你的手机端webapp请求了。

 

 

FAQ：
1.为什么我访问页面提示代理服务器连接失败？
在确认所有设置都没有错的情况下，可以尝试关闭防火墙或带防火墙功能的杀毒软件，如果关闭后可以访问，可以在防火墙设置里为Fiddler放行。