当前位置:首页 > 博客人生 > 博客教程

文章摘要:大家好,我是小沈子,今天分享一个非常实用的小教程,不花钱,不用买服务器,不用自己部署各种服务,只需要一个小工具,直接让别人访问到你电脑上做好的网站,这种方法尤其适用于你要参加竞赛,需要给评委演示项目的场景。

没有域名、服务器,就不能上线网站了么?

发布时间:2023-09-17 作者:小沈子 分类: 编程 Ngrok 内网穿透

前言

没有服务器和公网IP,想让别人访问自己做好的网站,怎么办?

项目用的依赖服务太多了,想上线太麻烦了,怎么办?

协作开发时想让同事直接访问自己本地运行的项目,怎么办?

正文

大家好,我是小沈子,今天分享一个非常实用的小教程,不花钱,不用买服务器,不用自己部署各种服务,只需要一个小工具,直接让别人访问到你电脑上做好的网站,这种方法尤其适用于你要参加竞赛,需要给评委演示项目的场景。

那在阅读之前先请大家思考一个问题:

为什么别人无法直接访问你电脑上运行的网站和服务呢?

答案很简单,大多数情况下我们的个人电脑都处于局域网内,缺少可公开访问的公网IP地址,因此其他用户在网络上就找不到你,就没办法和你建立网络连接,那怎么解决这个问题呢?

一种可行的方法是内网穿透。通过一定的网络配置将内网的电脑暴露到公共网络,可以简单理解为有一个中间服务,由于他知道你电脑的地址,就可以帮助其他用户访问到你的计算机,那如何实现内网穿透呢?

微信图片_20230917161237.png

很简单,使用ngrok一分钟就能搞定,那首先我们访问它的官网注册登录,注册登录成功后根据自己的操作系统选择下载软件的安装压缩包,然后将下载好的zip包解压,得到一个可执行文件:

微信图片_20230917161426.png

接下来我们参考官方文档:

在本地执行ngrok命令,添加当前用户的身份验证令牌,进入到刚刚解压的可执行文件所在的目录执行即可:

微信图片_20230917161915.png

微信图片_20230917162047.png

现在呢,你的账号信息已经保存到本地的ngrok配置文件中了,接下来只需要执行ngrok http 80 命令就能启动内网穿透服务了,注意要将输入的端口号改为自己本地项目实际占用的端口号。那小沈子想在这里做个小调研,大家最常用的的口号是什么呢?欢迎在评论区分享。

现在我的电脑已经有一个前端网站了,占用的端口是85,回车即可自动为我们生成一个域名,相当于在他们的服务器上创建了一个隧道,连接了我们本地的服务端口,然后在浏览器访问该域名就能访问到本地启动的前端项目了。是不是很方便呢?

640.png

值得一提的是生成的域名还是https的安全域名!

虽然我们已经成功启动了内网穿透,成功的访问到了网站,但是现在每次启动得到的访问域名都是随机生成的,这不利于我们持续访问。

试想一下:你在电脑上做了个网站给你的女神表白,结果呢,刚发给女神网址,网址就变了,那岂不是很尴尬,所以我们需要一个静态的不变的域名,可以在官网找到静态域名配置,第一次进入配置页时,如果还没有添加域名,可以免费创建一个,创建好域名后可以直接复制服务启动命令。

图片

640 (2).png

然后在终端中执行该命令即可,其实就是在启动内网穿透时指定了domian参数,通过这种方式,我们每次的内网穿透域名就都是固定的了。

640 (3).png

如果你是一名后端开发人员,要让前端人员访问你本地开发好的接口,通过这种方式就很简单了,不用反复打包,然后到线上或者测试服务器更新部署项目。

接下来让我们更进一步,以上讲的都是单服务的内网穿透,但如果你是一个全栈开发者,你的本地可能不仅有前端还后端服务那么如何利用ngrok 同时内网穿透多个服务呢?

这就需要我们修改ngrok 配置文件,手动配置隧道连接,首先根据官方文档的指引,找到自己电脑上的默认ngrok.yml配置文件:

640 (4).png

然后在编辑器中修改这个文件:

640 (5).png

比如我这里配置前端和后端两条隧道填写对应的本地服务端口,之后呢可以通过ngrok start命令写上隧道名称,指定启动我们哪个隧道或者执行ngrok start-all命令同时启动所有隧道就会发现生成了两个不同的子域名,分别指向前端和后端服务,但通过上面的方式,每次启动内网穿透得到的域名依然是随机的。我们可以通过ngrok.yml文件的domain配置来指定域名,然后执行命令启动我全部服务。

微信图片_20230917172411.png

注意这里会报错:

640 (6).png

由于ngrok 限定了每个域名只能绑定一个端口,不过也有解决方案可以在配置文件中指定subdomain给每一个端口分配一个子域名。但很遗憾这种方式是需要额外付费的,所以这里就不多说了,那如果我们想要用固定域名访问本地的多个端口怎么办呢?大家有什么更好的解决方案呢?欢迎大家留言分享自己的解决方法。

Ngrok的好处是:简单方便,如果你有一定的探索能力,也可以试试更灵活的开源软件:frp !

640 (7).png

最后,大家千万千万不要忘记三件事

1、用完内网穿透后,记得把服务关闭,否则别人能直接访问你的电脑服务,可能会有一定的安全风险。

2、你的token千万别泄露,比如录视频教程或截图的时候,不小心录进去了,那如果是这种情况,一定要及时重置三。

3、收藏转发,大家的每次转发收藏都会让小编的精神感到愉悦,给大家带来更好的知识分享,谢谢大家的阅读。


上一篇: windows2008+iis7环境SSL部署https证书(单/多站点)


下一篇: WindowsServer2012安装IIS失败解决办法

赞助打赏

  • 支付宝扫码
  • 微信扫码