目录
🍃作者介绍:双非本科大三网络工程专业在读,阿里云专家博主,专注于Java领域学习,擅长web应用开发、数据结构和算法,初步涉猎Python人工智能开发和前端开发。
🦅主页:@逐梦苍穹
📕您的一键三连,是我创作的最大动力🌹
如果想要让自己简历上的项目经历显得更真实,最好是把项目上线并且提供地址给招聘方访问。
没有服务器,那玩意儿要钱,咋办?
项目用的服务太多了,数据库 Redis 消息队列 ES 什么的,想上线太麻烦了,咋办?
今天就给大家分享两个免费的神器,不用买服务器、不用自己部署各种服务,直接让别人访问到你电脑上的网站!
1 、简介
先思考一个问题:为什么别人无法直接访问你电脑上运行的网站和服务?
答案很简单。大多数情况下,我们的个人电脑都处于内网,即没有可公开访问的独立 IP 地址,因此其他内网用户找不到你,就没办法和你建立网络连接。
为了实现上述需求,我们采取的方法是 内网穿透 。
什么是内网穿透呢?
它的作用是:将内网的电脑 "暴露" 到公共网络。可以简单理解为一个中间人,由于他知道你的电脑地址,所以能建立一条隧道,帮助其他用户访问到你的计算机。
![](https://file.jishuzhan.net/article/1757980742714920962/d9504569c8936a798ee09ce9516407d7.webp)
这次要使用的免费内网穿透工具是 Ngrok和cpolar。
2 、Ngrok
首先我们访问 Ngrok 官网,使用 GitHub 或者Google邮箱进行注册登录。
2.1 、下载安装
![](https://file.jishuzhan.net/article/1757980742714920962/60cea1bf1059d7bfd9a028cbf9b7aff7.webp)
![](https://file.jishuzhan.net/article/1757980742714920962/77f63a5296334b547b66bb31dd50f95b.webp)
用谷歌登录,现在会出现一个需要验证的页面:
![](https://file.jishuzhan.net/article/1757980742714920962/6c8a4d1f78f2858d2dfc08227dd8a874.webp)
去手机的Google Play商店搜索谷歌验证器,获取一个验证码输入即可:
![](https://file.jishuzhan.net/article/1757980742714920962/1b65ca63127b2f4ea3af8ddc2f944749.webp)
注册登录成功后,根据自己的操作系统选择下载 Ngrok 的安装压缩包:
![](https://file.jishuzhan.net/article/1757980742714920962/06d618c147d6bc4c00447dcb0c600be8.webp)
2.2 、运行
接下来我们参照官方文档,在本地执行 ngrok 命令添加用户的 authtoken:
![](https://file.jishuzhan.net/article/1757980742714920962/bbd32fc89d899576b44d89a2b68d9fef.webp)
直接复制上图的命令,进入到 ngrok 文件所在的目录执行,如下图:
![](https://file.jishuzhan.net/article/1757980742714920962/a23f16cd76d18ca5f7c414606c588796.webp)
现在,你的账号信息已经保存到本地的 ngrok 配置文件中了,接下来只需要执行 ngrok http <端口号> 命令即可启动内网穿透服务。
如下图,注意将端口号改为自己本地项目占用的端口号,比如前端一般是 80、后端一般是 8080。
![](https://file.jishuzhan.net/article/1757980742714920962/6ff354d4e19c5a04c17becf981e71a3d.webp)
Ngrok 自动为我们生成了一个域名,指向本机的服务:
![](https://file.jishuzhan.net/article/1757980742714920962/e53b41b0c54230fff7ff4c22b813ad2a.webp)
在浏览器访问该域名,就能访问到自己电脑上启动的项目了。
2.3 、固定域名
通过上述命令直接启动内网穿透,每次得到的访问域名是随机生成的,这不利于我们持续访问。
可以从 ngrok 官网找到静态域名的配置:
![](https://file.jishuzhan.net/article/1757980742714920962/f9edad34b4e104718139ad93d1b93798.webp)
![](https://file.jishuzhan.net/article/1757980742714920962/9a451a918a9ff676bab5074f37b176c8.webp)
第一次进入域名配置页面时,如果没有域名,可以免费创建一个。
创建好域名后,复制下图的 ngrok 启动命令:
![](https://file.jishuzhan.net/article/1757980742714920962/2118f2c69e9345244e771239209996ab.webp)
然后在终端中执行该命令即可,本质上就是在启动 ngrok 时指定了 domain 参数:
![](https://file.jishuzhan.net/article/1757980742714920962/ef4fca62836168ca426d035cf346d196.webp)
通过这种方式,每次的内网穿透域名就都是固定的。
2.4 、配置多服务
以上是单服务的内网穿透,但实际情况下,我们本地可能不仅有前端、还有后端服务,那么如何利用 Ngrok 同时内网穿透多个服务呢?
这就需要我们修改 ngrok 的配置文件,手动配置隧道。
首先根据官方文档的指引,找到自己电脑上的默认 ngrok.yml 配置文件:
![](https://file.jishuzhan.net/article/1757980742714920962/2b1dd7ce6039f8a4e296ff49ccbad8ef.webp)
然后在编辑器中修改这个文件,比如配置前端(frontend)和后端(backend)两条隧道,对应的本地服务端口分别为 80 和 8080;
通过这种方式,每次启动内网穿透得到的域名依然是随机的。
我们可以通过修改 ngrok.yml 文件的 domain 配置来指定域名。配置文件内容如下:
![](https://file.jishuzhan.net/article/1757980742714920962/8125e5dcdf3e31eb9b6e9b53635185b7.webp)
通过 ngrok start <隧道名称> 配置指定启动哪个隧道:
bash
ngrok start frontend
ngrok start backend
或者执行 ngrok start --all 命令同时启动所有隧道,运行结果如下,同时在 ngrok-free.app 域名下分配了 2 个子域名,并指向对应服务:
![](https://file.jishuzhan.net/article/1757980742714920962/c5f63f93390638dd0b2173cd660398aa.webp)
访问不同的域名,就能访问到前端或后端了
3 、cpolar
3.1 、下载安装
![](https://file.jishuzhan.net/article/1757980742714920962/604f684775173546ad9a17ec0cb5ce57.webp)
安装过程中,一直下一步即可。
3.2 、运行
cpolar 指定authtoken
复制authtoken:
![](https://file.jishuzhan.net/article/1757980742714920962/fbf039eb475eb4db4c85cb267455b098.webp)
执行命令:
![](https://file.jishuzhan.net/article/1757980742714920962/716f02752c295b389d013d7e19458d94.webp)
获取临时域名
执行命令:
![](https://file.jishuzhan.net/article/1757980742714920962/1f39f3d9ef036b82a390aca336cf99d8.webp)
获取域名:
![](https://file.jishuzhan.net/article/1757980742714920962/517312c7893c00566b85dd3a9c760d1e.webp)