做有态度的前端团队

网易FEG前端团队

内网穿透ngrok工具快速启动bat

前言

很久很久以前,我们在做移动开发时,调试bug的方式主要是:

1、每次改完上传到测试环境,手机刷新(不够实时,麻烦耗时)

2、手机申请内网权限(申请的机子很有限,遇到奇葩机子出问题时再申请权限根本行不通)

然后,我们开始寻找可以实时远程调试的工具,比如weinre,小组也有相关文章介绍:
Weinre+Gulp+BrowserSync结合实现远程调试
但我们小组最终选择的是内网穿透 ngrok 工具,统一搭配,方便组员快速使用,使用指南:
内网穿透 ngrok 工具使用指南

ngrok.bat

有了工具,那就得用上,提高生产力才对得住搭建这个工具的大神啊。但是用了那么多次,还是不很习惯去用,为什么?有点麻烦!
通过上面的使用指南,每次使用需要4步:

1、找到本地的ngrok工具文件夹,启动cmd命令

2、运行cmd命令启动ngrok,一长串,可以感受下(我没有记住过)

.\ngrok.exe -config ngrok.cfg -subdomain yourdomain 8080

3、因为没有记住第二步的命令,我每次都需要打开使用指南。。。所以就有了这第三步!

4、手动打开最终的访问域名

在繁忙的开发时,这样操作太麻烦,太耗时了,以至于有时候宁愿把码传到测试环境,也懒得用穿透工具。
有什么办法可以提供效率么?这时候bat文件排上用场了。
这里说的bat文件,是指window的批处理文件,是将一系列命令按一定的顺序集合为一个可执行的文本文件,其扩展名为BAT(或者CMD)。
我们预想的这个批处理文件是可以减少或过滤上面使用ngrok工具的繁琐步骤,最好能双击启动就能用。所以需要做到以下事情:

1、因为ngrok工具是公用的,所以批处理文件除了需要输入自定义域名外,其它命令都不需要输入

2、输入自定义域名,回车后自动打开浏览器访问

3、能在桌面快速启动

这里不对批处理文件的语法和命令做详细介绍,有兴趣自行google,直接贴出实现上面预想的代码:

@echo off&setlocal enabledelayedexpansion&title 快速启动 ngrok 工具
color 0A
echo                ===========内网穿透 ngrok 工具===========
:start
cls
echo 请输入您想自定义的域名:
set /p input_name=
set link=http://%input_name%.tt.w3cmark.com/
start chrome "%link%"
.\ngrok.exe -config ngrok.cfg -subdomain !input_name! 8080

只需要把上面的代码复制,进入到ngrok工具的解压文件夹,右键新建文本文档,粘贴保存为ngrok.bat即可。另外,上面的8080端口也可以自行修改,因为小组用的fis默认端口就是8080,所以这里也默认使用这个端口了。
然后直接双击打开ngrok.bat,输入你想自定义的域名,比如 lijun,按回车键:

QQ截图20160725205754.png

chrome浏览器就会自动打开生成后的域名,刷新即可访问本地测试服务器的内容啦。
结束使用后,Ctrl + c 即可退出。

如果,你觉得每次都要输入自定义域名很麻烦,可以改写一下,用任意编辑器打开ngrok.bat文件:

@echo off&setlocal enabledelayedexpansion&title 快速启动 ngrok 工具
color 0A
echo                ===========内网穿透 ngrok 工具===========
:start
cls
set link=http://xxxx.tt.w3cmark.com/
start chrome "%link%"
.\ngrok.exe -config ngrok.cfg -subdomain xxxx 8080

只需要把上面的两个有xxxx的地方写死成自己想自定义的域名(因为工具是公用,所以域名不能一样,否则别人占用就无法使用了),然后保存后再双击打开,就能直接启动啦,又剩了一步输入:

QQ截图20160725210435.png

最后,我们还可以选中ngrok.bat文件右键——发送到——桌面快捷方式,通过桌面的快捷方式,每次直接在桌面快速启动,不需要再进入到ngrok的解决文件夹啦。

QQ截图20160725210737.png

当然,快捷方式这一步我们可以直接用命令在每次启动时指定进入某个路径,再做后面的操作,然后我们就可以直接把ngrok.bat文件放到桌面了。这个方法这里暂时不探讨了,有兴趣自行实现哈!
(PS:ngrok工具有时候会出现连不上,这时候你就要去劳烦组长那边去重启服务了)

手机阅读请扫描下方二维码:

添加新评论

ali-40.gifali-41.gifali-42.gifali-43.gifali-44.gifali-45.gifali-46.gifali-47.gifali-48.gifali-49.gifali-50.gifali-51.gifali-52.gifali-53.gifali-54.gifali-55.gifali-56.gifali-57.gifali-58.gifali-59.gifali-60.gifali-61.gif