如何通过外网环境访问本地的Web项目

具体场景:开发的项目目前还没上线,领导需要一款测试版在客户面前演示一下,但是目前本地项目都是在自己的电脑上通过Tomcat来进行测试的 。而电脑连接的是公司的WIFI,查看了很多博文说需要进行端口映射,原理大概是:外网环境可以通过路由器的WAN口IP(即公网IP)访问到这台路由器,由于这台路由器连接很多电脑,而需要准确的找到你的电脑,就需要添加一个端口映射,具体设置方法可以在网上找找非常多。但是由于大部分路由器的WAN口IP都是NAT转过之后的,导致外网访问不了(我的就是)。因此我就没采用端口映射这个方法,而是采用了下面的两种方法,都可以实现:

一、Ngrok内网穿透

  具体做法:

     1、下载windows_amd64.zip包(可根据自己的需求自行选择)网址https://www.ngrok.cc/

如何通过外网环境访问本地的Web项目

如何通过外网环境访问本地的Web项目

解压windows_amd64.zip,以备后用

如何通过外网环境访问本地的Web项目

二、打开https://www.ngrok.cc,注册账号

三、开通隧道

如何通过外网环境访问本地的Web项目 
如何通过外网环境访问本地的Web项目

隧道名称:可以随便填写,只是为了使用者在往后之后这个隧道是干嘛的 
前置域名:服务器免费赠送的域名,请不要带上后缀,如果要sunny.ngrok.cc 只需要填写 sunny 即可 ,千万不要填写成sunny.ngrok.cc否则域名会是sunny.ngrok.cc.ngrok.cc 
本地端口:可以为同一个局域网内任意一台机器进行映射,只需要填对ip和端口就行,例如:192.168.1.1:80 
http验证用户名:非必填项,在需要的时候填写,否则可以不填 
http验证密码:非必填项,在需要的时候填写,否则可以不填

四、查看自己开通的隧道

 如何通过外网环境访问本地的Web项目
注意,这里有一个隧道ID,还有一个域名

五、启动ngrok

如何通过外网环境访问本地的Web项目

 

把第四步的隧道id复制,填入: 
如何通过外网环境访问本地的Web项目

回车: 
如何通过外网环境访问本地的Web项目 
如图,这里已经成功启动ngrok了。

六,访问本地项目

在本地启动一个项目,例如访问地址为:http://localhost:8080/ydysjb/dzappjsps/index.html

加入需要外网访问该地址,只需把ip改成自己的域名,结果为: 
http://ydysfwq.free.idcfengye.com/ydysjb/dzappjsps/index.html
这样,我们就可以在本地,和其他公司或部门的人(不在一个局域网),degug调试自己的代码啦。

注意:此版本虽然是免费的但是软件运行速度比较慢

二、Holer内网穿透

1. 下载软件包holer-client.zip

2. 使用前请先安装Java 1.7或者更高版本;

3.解压holer-client.zip,修改配置文件
holer-client/conf/holer.conf
只需设置HOLER_ACCESS_KEY

HOLER_ACCESS_KEY=HOLER_CLIENT-2F8D8B78B3C2A0AE

4. Start holer

启动Holer服务
cd holer-client/bin

Windows:
Run command startup.bat or double click startup.bat

5. 公网和内网的地址映射关系

Holer Access Key Internet Address Local Address
HOLER_CLIENT-2F8D8B78B3C2A0AE holer.org:65530 127.0.0.1:8080
HOLER_CLIENT-3C07CDFD1BF99BF2 holer.org:65531 127.0.0.1:8088
HOLER_CLIENT-2A623FCB6E2A7D1D holer.org:65532 127.0.0.1:80
HOLER_CLIENT-AF3E6391525F70E4 holer.org:65533 127.0.0.1:3389
HOLER_CLIENT-822404317F9D8ADD holer.org:65534 127.0.0.1:22

6. Demo
如果您本地的tomcat服务地址:
http://127.0.0.1:8088
代理到公网上的服务地址为:
http://holer.org:65531
只需要在配置文件里修改HOLER_ACCESS_KEY即可:
holer-client/conf/holer.conf
HOLER_ACCESS_KEY=HOLER_CLIENT-3C07CDFD1BF99BF2
重启Holer,然后就可以通过URL http://holer.org:65531来访问您的Web应用。

注意:此版本运行速度正常,但不是免费的。收费比较便宜如下图

如何通过外网环境访问本地的Web项目

 

而ngrok也有收费版的基本是10/月。两种都可以实现外网访问本地项目