用手机访问当地环境的利器ngrok,使用Fiddler搭建手机调试环境

用手机访问当地环境的利器ngrok

2015/08/11 · HTML5 · 4
评论 ·
ngrok

初稿出处: 吕大豹   

我们在调试移动端页面,尤其是调节微信页面的时候,会赶上那样的情景,手机连着公司的wifi,开发条件(台式机)插着商家的网线,大家要用手机来访问开发环境下的页面。那一个时候,倘若网线和wifi是在同一个网段,那么直接在手机访问电脑的ip就足以访问到大家搭在地头的web服务。可是,很多时候,公司的网络并不是这么架设的,wifi和网线不在一个网段,那么,通过上述措施就无法访问到了。

偶尔调试必须在手机上进行,在chrome下的邯郸学步不可能满意。那时候如何是好吧?在此以前自己利用的是那样的法门,电脑上插一个360wifi(插USB孔的那种),然后共享出热点,手机连接到那么些热点上网,就足以访问到支付条件了。假如须要查阅http请求,在计算机上打开fiddler,设置一个代理,然后在堂哥大上设置wifi的代办为fiddler,(端口默许是8888)。那样来自手机的伸手就会被fiddler捕获到,你就能接纳fiddler的强有力功用来调节代码了。

地方这一个艺术挺方便的,不过急需一个纤维硬件,360wifi。你可以买一个,格外有利,百度也有相同的出品。那假若我们手下没有那么些硬件可如何做呢?接下去该主演出场了,那就是ngrok。

ngrok是个怎么样东西呢?其实它就是一个反向代理,大家机器上运行起那么些服务后,它可以把地面的一个端口代理到公网。代理到公网是哪些概念?公网啊,那就是大家都足以访问到了,没有其余网络范围。当然,我们的测试机,连接受此外网络下的手机也是足以的了。

唯独不幸的时,ngrok架设在美利坚合众国,已经被大家伟大的祖国给墙掉了。可是!一位良心网友在境内架设了一台服务器,大家可以任意使用,鼓掌!

废话说了这么多,大家来看望ngrok到底怎么利用呢?其实是一对一简单的。

一、下载相关文书

第一,从那位老兄架设的网站上(

亚洲必赢官网 ,二、运行服务

下载后的三个文本,咱们不管找一个目录放好就行,例如,我放在D盘,那样就行了:
亚洲必赢官网 1

接下来,打开cmd终端,输入如下命令来启动服务: ngrok -config ngrok.cfg -subdomain lvdabao 80

用-config参数来指定安顿文件,-subdomain指定访问的子域名称和当地的端口,出现以下界面,表明启动成功了:

亚洲必赢官网 2

只顾一点,这么些子域名称是可以随心所欲起的,但不可以与别人的重名,因为这几个名号是你的代办的唯一标识,之后用

三、进入调试界面

把劳动启动起来还不够,大家的末梢目标是要调节呀,大家得能捕获到http请求才行。要完成这几个也一定不难,因为ngrok已经为你准备好了。真是卓殊接近啊~

请看上边服务运作起来后的音信,有一项 Web Interface 127.0.0.1:4040 ,我们平昔访问它就足以拓展调试了,在你本地浏览器输入那几个地址,试试看呢。

亚洲必赢官网 3

很炫酷有没有,你可以看来http请求头和重回的始末,你须要的都有了。

再者,还有一个更好用的机能,看到这些Replay按钮了吗,点击它可以手动再发起四遍你选中的伏乞,大概无法更赞,那样大家调试某个数据接口时,也省了老去手机上刷新页面了,更加是调剂微信页面,不必每一遍都去刷该死的二维码了。

用手机访问当地环境的利器ngrok,使用Fiddler搭建手机调试环境。以此利器的中坚用法就介绍到此处,能满意我们起先提议的要求了。其实它还有更强有力的意义,有趣味的能够FQ去官网查阅文档。最后再一次为国内的那位仁兄点赞,大家也可以去他搭建的网站下边查算命关资料:

2 赞 5 收藏 4
评论

亚洲必赢官网 4

有的情节参考:

局地内容参考:

 

我们在测试微信公司号的时候,由于微信的限定,不可能把它获得chrome浏览器中举办调剂,所以就无法实时的来看页面变化情况,因此大家就需求一个可见时刻查阅大家页面变化的工具。固然选拔Fiddler也是存在有的题目,仍旧不可以直接在大家的浏览器里面调试,可是相相比于将修改后的页面上传来服务器,然后在用手机举行呼吁,不难了众多。

我们在测试微信集团号的时候,由于微信的范围,不可以把它获得chrome浏览器中开展调节,所以就不能实时的收看页面变化情状,由此大家就要求一个可以时刻查阅大家页面变化的工具。就算选用Fiddler也是存在一些题材,仍旧不能直接在大家的浏览器里面调试,可是相比较于将修改后的页面上传出服务器,然后在用手机举办呼吁,简单了很多。

局地内容参考:

1.第一大家需求设置一个fiddler,汉化不汉化的都足以,我给大家提供一个没有汉化的。链接:
密码:kjjg
,间接一溜确定,安装就行。安装落成之后,大家开展以下设置。Fiddler代理默许使用端口8888,大家在手机端设置http代理为Fiddler的代理服务器(一会上边有实际的步调),使得手机使用的央求都经过Fiddler来转载,从而完成查看手机端页面请求的功力。

1.先是大家须求设置一个fiddler,汉化不汉化的都得以,我给我们提供一个平昔不汉化的。链接:
密码:kjjg
,直接一溜确定,安装就行。安装收尾之后,大家开展以下设置。Fiddler代理默认使用端口8888,大家在手机端设置http代理为Fiddler的代理服务器(一会下边有切实的步子),使得手机使用的呼吁都通过Fiddler来转载,从而已毕查看手机端页面请求的听从。

咱俩在测试微信企业号的时候,由于微信的限定,不可以把它获得chrome浏览器中开展调节,所以就无法实时的收看页面变化情况,因此大家就必要一个力所能及时刻查看我们页面变化的工具。纵然选择Fiddler也是存在有的题目,仍旧不能间接在我们的浏览器里面调试,不过相相比较于将修改后的页面上传来服务器,然后在用手机进行呼吁,不难了不少。

           1)设置Fiddler的options。

           1)设置Fiddler的options。

1.先是我们须求安装一个fiddler,汉化不汉化的都足以,我给我们提供一个没有汉化的。链接:
密码:kjjg
,直接一溜确定,安装就行。安装已毕之后,大家开展以下设置。Fiddler代理默许使用端口8888,大家在手机端设置http代理为Fiddler的代理服务器(一会上面有切实可行的步骤),使得手机应用的哀求都由此Fiddler来转载,从而完毕查看手机端页面请求的法力。

                         
打开Fiddler->Tools->Fiddler Options在Connection面板里将“Allow
remote computers to
connect”勾选起来,确定后,关闭Fiddler并再一次打开Fiddler。

                         
打开Fiddler->Tools->Fiddler Options在Connection面板里将“Allow
remote computers to
connect”勾选起来,确定后,关闭Fiddler仁同一视复打开Fiddler。

           1)设置Fiddler的options。

亚洲必赢官网 5

亚洲必赢官网 6

                          打开Fiddler->Tools->Fiddler
Options在Connection面板里将“Allow remote computers to
connect”勾选起来,确定后,关闭Fiddler并再度打开Fiddler。

       
 2)此时,为了确保代理是正常干活的,我们可以在cmd里进行netstat -anop tcp查看Fiddler进度是或不是健康监听8888端口,即使服务没有例行打开,可以尝尝利用任何端口,端口修改的职位(可以在上一步里面一直改动)。

       
 2)此时,为了保险代理是健康办事的,大家得以在cmd里实施netstat -anop tcp查阅Fiddler进度是或不是正规监听8888端口,假如服务没有健康打开,可以尝试采纳其它端口,端口修改的职分(可以在上一步里面一向修改)。

亚洲必赢官网 7

大家先开辟任务管理器查看以下大家Fiddler的PID代码是不怎么。打开职责管理器的急速键是Ctrl+shift+ESC,正常情状下如图所示,大家的Fiddler.exe的PID是3156,倘使您的那个界面里面没有PID这一项,接着往下看。

大家先开辟职务管理器查看以下大家Fiddler的PID代码是稍稍。打开义务管理器的火速键是Ctrl+shift+ESC,正常情况下如图所示,大家的Fiddler.exe的PID是3156,如果您的那几个界面里面没有PID这一项,接着往下看。

       
 2)此时,为了确保代理是例行干活的,我们得以在cmd里进行netstat -anop tcp查阅Fiddler进度是或不是正常监听8888端口,要是服务没有健康打开,可以尝试使用其余端口,端口修改的岗位(可以在上一步里面从来改动)。

 亚洲必赢官网 8

 亚洲必赢官网 9

咱俩先开辟任务管理器查看以下大家Fiddler的PID代码是有点。打开职责管理器的神速键是Ctrl+shift+ESC,正常情形下如图所示,大家的Fiddler.exe的PID是3156,若是您的这么些界面里面没有PID这一项,接着往下看。

 

 

 亚洲必赢官网 10

在职务管理页面,拔取查看–接纳列,把PID那一栏打上对号,如图所示,那样在任务管理界面就有PID了。

在义务管理页面,拔取查看–选拔列,把PID那一栏打上对号,如图所示,那样在义务管理界面就有PID了。

 

亚洲必赢官网 11

亚洲必赢官网 12

在职务管理页面,选取查看–接纳列,把PID那一栏打上对号,如图所示,那样在义务管理界面就有PID了。

 

 

亚洲必赢官网 13

开拓大家的cmd,执行netstat -anop
tcp命令,如下图所示,大家能够见到,PID为3156,正在监听8888端口。那么接下去咱们要把手机端的代理设置为Fiddler的代办,代理设置必要一个ip和一个端口,ip就是Fiddler所运行的微机(安装Fiddler的微处理器)的局域网ip地址,端口默许是Fiddler代理的端口8888,请确保手机所在的网段可以访问到总括机所在的网段,同一个局域网里一般没什么问题(电脑用宽带,手机用wifi,一个网就行)。

开辟大家的cmd,执行netstat -anop
tcp命令,如下图所示,大家得以见到,PID为3156,正在监听8888端口。那么接下去大家要把手机端的代理设置为Fiddler的代办,代理设置必要一个ip和一个端口,ip就是Fiddler所运行的总计机(安装Fiddler的统计机)的局域网ip地址,端口默许是Fiddler代理的端口8888,请确保手机所在的网段可以访问到电脑所在的网段,同一个局域网里一般没什么问题(电脑用宽带,手机用wifi,一个网就行)。

 

亚洲必赢官网 14

亚洲必赢官网 15

打开我们的cmd,执行netstat -anop
tcp命令,如下图所示,我们可以见见,PID为3156,正在监听8888端口。那么接下去大家要把手机端的代理设置为Fiddler的代办,代理设置必要一个ip和一个端口,ip就是Fiddler所运行的微处理器(安装Fiddler的处理器)的局域网ip地址,端口默许是Fiddler代理的端口8888,请保管手机所在的网段可以访问到电脑所在的网段,同一个局域网里一般没什么问题(电脑用宽带,手机用wifi,一个网就行)。

 

 

亚洲必赢官网 16

 

 

 

2.查看大家设置fiddler软件的处理器的ip,如图所示,我的处理器ip是192.168.1.12,因为我用的是店铺的网络,ip是每日动态获取的,所以一旦大家不把ip换成固定的,就得每一趟使用fiddler的时候自己在手动的修改一下。

2.翻看大家设置fiddler软件的统计机的ip,如图所示,我的电脑ip是192.168.1.12,因为自身用的是商家的网络,ip是每一天动态获取的,所以假若大家不把ip换成固定的,就得每回使用fiddler的时候自己在手动的修改一下。

 

亚洲必赢官网 17

亚洲必赢官网 18

2.翻看大家设置fiddler软件的统计机的ip,如图所示,我的总结机ip是192.168.1.12,因为我用的是店铺的网络,ip是每天动态获取的,所以一旦大家不把ip换成固定的,就得每一次使用fiddler的时候自己在手动的修改一下。

 

 

亚洲必赢官网 19

 

 

 

 

 

 

 

 

 

3.给大家的无绳电话机安装代理,访问
192.168.1.12:8888,我用的是三星的s7,直接在链接的wifi上面长按就足以,代理主机名是大家的电脑网络的ip,代理服务器端口是大家fiddler监听的不得了,如图所示

3.给我们的手机安装代理,访问
192.168.1.12:8888,我用的是三星(三星)的s7,直接在链接的wifi上面长按就可以,代理主机名是我们的电脑网络的ip,代理服务器端口是我们fiddler监听的充足,如图所示

 

                                               
 亚洲必赢官网 20                         
 亚洲必赢官网 21

                                               
 亚洲必赢官网 22                         
 亚洲必赢官网 23

3.给大家的无绳电话机安装代理,访问
192.168.1.12:8888,我用的是三星(三星)的s7,直接在链接的wifi下面长按就足以,代理主机名是大家的电脑网络的ip,代理服务器端口是大家fiddler监听的万分,如图所示

 

 

                                               
 亚洲必赢官网 24                         
 亚洲必赢官网 25

4.尾声,大家须要配置一下大家电脑的hosts文件,路径如下,

4.说到底,我们需求配备一下大家电脑的hosts文件,路径如下,

 

亚洲必赢官网 26

亚洲必赢官网 27

4.尾声,大家必要安插一下大家电脑的hosts文件,路径如下,

 

 

亚洲必赢官网 28

将咱们的电脑ip写入,前边跟的是大家要调节的不胜网页的网址。

将大家的统计机ip写入,前面跟的是大家要调节的那么些网页的网址。

 

亚洲必赢官网 29

亚洲必赢官网 30

将大家的处理器ip写入,前面跟的是大家要调节的不得了网页的网址。

 

 

亚洲必赢官网 31

这么大家就可以调剂我们的手极端的页面了。

诸如此类我们就可以调剂我们的手极端的页面了。

 

5.题目:大家设置好了fiddler未来,再拜访https协议的网站的时候,可能会冒出下边的题材,如图:

5.题材:我们设置好了fiddler未来,再拜访https协议的网站的时候,可能会出现下边的问题,如图:

诸如此类我们就足以调节大家的手极端的页面了。

亚洲必赢官网 32

亚洲必赢官网 33

5.问题:大家设置好了fiddler将来,再拜访https协议的网站的时候,可能会出现下边的题目,如图:

以此问题造成大家不可以健康访问一些网站内容,比如百度,阿里等等,这是因为大家的fiddler开启了监听https,在设置里面把对号去掉就行了。在fiddler页面,点击Tools–Telerik
Fiddler Option–HTTPS,把督查https通道(decrypt HTTPS
traffic)的非常对号去掉

其一题目造成我们不可能健康访问片段网站内容,比如百度,阿里等等,这是因为我们的fiddler开启了监听https,在装置里面把对号去掉就行了。在fiddler页面,点击Tools–Telerik
Fiddler Option–HTTPS,把督察https通道(decrypt HTTPS
traffic)的非凡对号去掉

亚洲必赢官网 34

亚洲必赢官网 35

亚洲必赢官网 36

那个题材导致大家不可能健康访问一些网站内容,比如百度,阿里等等,那是因为大家的fiddler开启了监听https,在安装里面把对号去掉就行了。在fiddler页面,点击Tools–Telerik
Fiddler Option–HTTPS,把监督https通道(decrypt HTTPS
traffic)的不行对号去掉

 

 

亚洲必赢官网 37

 

 

 

网站地图xml地图