Ngrok内网穿透

前言

ngrok是什么？

Ngrok 是一个反向代理，通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。Ngrok是外国发布的一个开源项目，也有一个公开的运行服务，但被国内墙掉了。国内一个机构建立并运营了一个Ngrok运行服务，虽然有时不太稳定，但对于调试人员来说是足够的。地址http://www.ngrok.cc/ 。其支持HTTP的80端口和TCP端口转发。下面介绍使用方法。

为什么要了解Ngrok内网穿透？

作为一个web开发者，我们有时候会需要临时地将一个本地的web网站部署到外网，以供他人体验评价或协助调试等等

如何通过Ngrok实现内网穿透

注册账号

1.首先百度搜索https://www.ngrok.cc/

注册账号

登录

购买服务（免费）

微信关注公众号

关注公众号后就能去购买服务了

选择免费的服务


直接下一步 "确认开通"

下载工具

把下载的压缩包解压

进入windows_amd64

启动 Sunny-Ngrok启动工具.bat

把隧道id输入

然后回车，启动后的效果如图

当启动了sunny-ngrok的客户端以后, 就这个用sunny-ngrok提供的域名 http://xiaofang523.free.idcfengye.com , 来访问本地的127.0.0.0:9201(端口自己设置), 如果Vue项目启动, 外网就可以通过域名来访问Vue项目. 但是如果出现 Invalid Host header, 需要设置一下

// vue.config.js文件中
 module.exports = {
   devServer: {
     disableHostCheck: true
   }
 }

本机运行效果

通过外网访问地址,效果如图:

注意：

• 免费的Ngrok内网穿透服务是速度比较慢的，也容易掉线

• 这个Ngrok内网穿透服务仅仅只是在项目上线前或者给客户交付的时候可以临时使用一下

• 本地服务需要一直启动，这样Ngrok内网穿透才能起作用，别人才能通过外网来访问你电脑的启动的项目