使用Fiddler代理调试本地手机页面
从事前端开发的同学一定对 Fiddler 不陌生,它是一个非常强大的http(s)协议分析工具。我们知道如何在电脑上调试页面请求,但在手机端你没有这么多强大好用的调试工具来调试你的webapp,如果你需要查看在手机上打开页面时,所产生的http请求却又不知道怎么做,那就继续往下看。(当然,大部分情况下,你可以直接在电脑上用Chrome或Firefox模拟手机浏览器来看)
Fiddler支持代理的功能,也就是说你所有的http请求都可以通过它来转发,Fiddler代理默认使用端口8888,不知道的同学有可能因此无法使用FQ,因为端口冲突。利用这点,我们可以在手机端设置http代理为Fiddler的代理服务器,使得手机应用的请求都通过Fiddler来转发,从而实现查看手机端页面请求的功能。
1,安装设置Fiddler
(1)首先我们打开Fiddler->Tools->Fiddler Options在HTTPS面板里将Decry HTTPS traffic和Ignore server certificate errors(unsafe)勾选起来,确定。

(2)其次Fiddler->Tools->Fiddler Options在Connection面板里将Allow remote computers to connect
勾选起来,端口使用默认8888,确定后,关闭Fiddler并重新打开Fiddler。

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

从上图我们看到,进程ID为8392的Fiddler正在监听8888端口,说明代理已经在工作了。那么接下来我们要把手机端的代理设置为Fiddler的代理,代理设置需要一个ip和一个端口,ip就是Fiddler所运行的电脑的局域网ip地址,端口默认是Fiddler代理的端口8888,请确保手机所在的网段可以访问到电脑所在的网段,同一个局域网里一般没什么问题。
2, 手机访问本地环境(手机和电脑必须是同一个局域网络,常用方法是连接同一个网络或者电脑开启热点)
在电脑上利用360免费wifi开启热点,比如hello_111/123456,利用手机连接这个无线网络后,选择修改网络,显示高级选项,代理服务器主机名输入以太网适配器,以太网2的ip地址,代理服务器端口输入8888。

3,在手机上访问本地环境下h5页面,进行调试。
注:大部分服务升级https了,所以代理需要支持https,在fiddler中生成密钥,客户端(手机)下载密钥后,即可正常访问。
tools-fiddler options--https---Actions---Trust Root certificate即可。
手机端浏览器中输入198.168.11.10:8888(电脑ip加代理端口),会打开fiddler echo service页面,选择you can download fiddler root certificCate ,即可手机端下载密钥。即可正常访问。
手机可以连接笔记本,也可以连接笔记本所处同一局域网,代理服务器填写笔记本ip即可。
有时手机连不上电脑,需要将电脑防火墙关闭。
使用Fiddler代理调试本地手机页面的更多相关文章
- 如何用 fiddler 代理调试本地手机页面
最近在做移动端的页面,但是移动端的调试很蛋疼.虽然说 90% 的功能都能用 chrome 下的模拟器来模拟解决,但是剩余的 10% 却只能在真机上调试.比如说一两个像素的误差,比如说只有真机上才能重现 ...
- 使用 Fiddler 代理调试本地手机页面
文件下载:http://files.cnblogs.com/files/dtdxrk/fiddler4_4.6.2.0_setup.rar 从事前端开发的同学一定对 Fiddler 不陌生,它是一个非 ...
- fiddler 代理调试本地手机页面
https://www.cnblogs.com/zichi/p/4944581.html
- 绕过限制,在PC上调试微信手机页面
场景 假设一个手机页面,开发者对其做了限制,导致只能在微信客户端中打开.而众所周知手机上非常不利于调试页面,所以需要能在电脑上打开并进行调试.这里针对常见的三种页面做一下分析,一一绕过其限制,(当然不 ...
- 在PC上调试微信手机页面的三种方法
场景 假设一个手机页面,开发者对其做了限制,导致只能在微信客户端中打开.而众所周知手机上非常不利于调试页面,所以需要能在电脑上打开并进行调试.这里针对常见的三种页面做一下分析,一一绕过其限制,(当然不 ...
- 使用eclipse+fiddler+微信web开发者工具调试本地微信页面
前面已经说了调试服务器上的微信页面,放链接:http://www.cnblogs.com/Gabriel-Wei/p/5977850.html 还有fiddler调试链接:http://www.cnb ...
- 使用fiddler4做代理调试手机页面
由于一般手机不能改host,手机页面如果涉及到各个域名ip的混合使用,在手机上调试看效果非常麻烦. 使用fiddler4做代理,手机跟电脑连到同一个局域网,手机上网通过电脑做个代理上网,那么一切请求就 ...
- 利用fiddler和mock调试本地微信网页
利用fiddler和mock调试本地微信网页 微信公众号网页是比较特殊的页面,普通页面直接打开即可访问,但对于需要请求微信相关接口的部分需要安全域名认证.这导致了使用mock数据进行开发的页面没办法走 ...
- 技术方案:在外部网址调试本地js(基于fiddler)
1 解决的问题 1) 场景1:生产环境报错 对前台开发来说,业务逻辑都在js中,所以报错90%以上都是js问题. 如果生产环境出现报错,但是测试环境正常.这时修改了代码没有环境验证效果, ...
随机推荐
- 解决CentOS内网机通过Windows下架设代理来访问网络
新分配的CentOS运行在内网环境下,无法连接Internet,为了能够使用yum部署OpenVas工具,需要在内网下一台Windows主机架设代理,作代理服务器来令虚拟机上网. 代理服务器选择了CC ...
- Fundamentals of Garbage Collection
[Fundamentals of Garbage Collection] 1.Reclaims objects that are no longer being used, clears their ...
- linux之cut
[linux之cut] -b:字节 -c:字符 -d:自定义域 -f:域范围 参考:http://wenku.baidu.com/view/9399bc8383d049649b66588b.html
- CSS使文字、大小不固定的图片垂直居中
一:单行文字垂直居中 使用line-height为父元素高度即可. 二:多行文字垂直居中 使用display:table-cell属性. 将父元素设置为display:table-cell,同时ver ...
- ios 单个ViewController屏幕旋转
如果需要旋转的ViewController 使用了UINavigationController,对UINavigationController进行如下扩展 @implementation UINavi ...
- Luogu 4512 【模板】多项式除法
高级操作,感觉非常神仙. 题目中的字母太难懂了,重新定义一下. $$A(x) = B(x) * C(x) + D(x)$$ 其中,$A(x)$的次数是$n$,$B(x)$的次数是$m$,$A, B$都 ...
- linux中的 tar命令的 -C 参数,以及其它一些参数
tar命令的-C参数 $ tar -cvf file2.tar /home/usr2/file2 tar: Removing leading '/' from members names hom ...
- IntelliJ IDEA 2017版 SpringBoot徒手书写HelloWorld
1.打开编译器,选择File---->New---->Project 2.弹出设置界面,选择如图样式的1.2.3 3.设置包名称 4.继续next 5.finish完成即可 6.自动生成目 ...
- S5PV210定时器
在S5PV210内部,一共有4类定时器件.这4类定时器件的功能.特征是不同的. 1.PWM定时器(1)这种是最常用的,平时所说的定时器一般指的是这个.像简单单片机(譬如51单片机)中的定时器也是这类. ...
- Linux 基础教程 43-su和sudo命令
在使用Linux系统中,有时候还需要做身份切换,这是为什么? 使用普通账号:系统日常操作的好习惯 虽然使用root对系统进行各种操作不受权限等方面的限制,但却存在重大的安全隐患,假如有人不 ...