项目部署测试之内网穿透

本文详细指导如何注册Ngrok,开通免费隧道,下载并配置客户端,实现本地项目通过外网访问。涵盖注册、隧道设置、客户端操作及不同端口转发技巧。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >


前言

本地项目只能在内网测试,如果要使用外网测试怎么办?
比如:公司的登录接口:localhost:8080/login.html. 那就可以使用内网穿透!

一、注册ngrok

官网地址

1.先注册一个账号

在这里插入图片描述

2.登录后开通隧道(以免费的为例)

在这里插入图片描述
在这里插入图片描述

3.开通后如图:

备注: 我的隧道命了名,并添加了前缀(需要上一步可以填写)

在这里插入图片描述

4. 下载客户端

点击教程,再点击如下图Ngrokc客户端(可根据需要选择其他版本)

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

5.运行客户端

5.1 下载完直接将压缩包加压,加压后进入windows_amd64文件夹

在这里插入图片描述

5.2 在上图中使用cmd命令进入,并输入Sunny-Ngrok启动工具.bat命令

在这里插入图片描述

5.3 输入前面开通的隧道id

在这里插入图片描述

5.4 运行成功如图

在这里插入图片描述

5.5 使用

此时在外网将你的项目域名 localhost:8080 换成 http://xxx.free.idcfengye.com
,其他不变就可以了!

5.6 如果你的项目端口是其他端口如:8888,则可以开通隧道时就填8888端口。或者在隧道管理修改。

6.其他

如果需要开通多个端口并用ngnix代理转发,留言我后期补上。


随心所往,看见未来。Follow your heart,see light!

欢迎点赞、关注、留言,收藏及转发,一起学习、交流!

### 前端部分公部署的方法 对于前后端分离项目中的前端部分,要将其部署至公上,通常涉及几个关键步骤。这些步骤不仅限于特定的技术栈,而是适用于大多数现代Web应用。 #### 选择合适的托管服务提供商 为了使前端应用程序能够被全球用户访问,可以选择云服务商提供的静态站托管功能来部署前端代码。这类平台支持自动HTTPS加密传输,并提供CDN加速服务以提升加载速度[^1]。 #### 使用反向代理服务器配置域名解析 当决定好托管位置之后,下一步就是设置DNS记录指向所选的服务商IP地址或CNAME。如果采用的是VPS自建站点,则需安装如Nginx这样的HTTP服务器作为反向代理,用于处理来自互联的请求并将它们转发给实际运行的应用实例。此外,在防火墙规则里开放必要的TCP端口号也是必不可少的操作之一[^4]。 #### 自动化构建与发布流程 借助CI/CD工具链可以简化持续集成和交付的过程。每当开发者提交新的更改时,GitHub Actions、GitLab CI等自动化流水线会触发一系列任务:拉取最新源码版本、执行测试套件验证质量、编译打包成生产环境可用的形式最后通过SCP协议或者其他方式同步文件到远程主机上指定路径下[^2]。 ```bash scp -r ./dist/* user@your.server.ip:/var/www/html/ ``` 上述命令展示了怎样利用`scp`指令快速复制本地构建产物(`./dist`)内的所有内容到达目标机器相应目录中去。 #### 容器化解决方案 考虑到跨不同操作系统之间的一致性和可移植性问题,Docker成为了一个理想的选择。创建一个简单的Dockerfile定义所需的基础镜像及其依赖关系,再配合docker-compose.yml描述多容器应用场景下的网络连接和服务交互逻辑,从而轻松实现在任何地方一键式搭建完整的开发调试环境或是投入线上运营的目的[^5]。 ```dockerfile FROM node:lts-alpine as build-stage WORKDIR /app COPY package*.json ./ RUN npm install COPY . . RUN npm run build FROM nginx:stable-alpine COPY --from=build-stage /app/dist /usr/share/nginx/html EXPOSE 80 CMD ["nginx", "-g", "daemon off;"] ``` 此段脚本先是基于Node.js官方镜像完成Vue项目的构建工作,接着切换到Nginx映像负责分发已生成好的HTML/CSS/JS资源文件。 ### 实现安全可靠的外部接入机制 针对位于私有网络内部的服务想要对外界公开接口的情况,除了直接修改路由器配置允许WAN侧流量穿透进来之外,还可以考虑运用第三方中介——即所谓的“隧道”技术(比如Ngrok),它可以在不改变现有架构的前提下迅速建立起一条通往内资产的安全通道;或者是建立专门的API Gateway节点充当入口哨兵角色,统一管理鉴权认证策略以及速率限制等功能特性。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值