三分钟使用ngrok实现项目本地部署公网访问(内网穿透)

1.官网注册

官网地址:https://ngrok.com/

tips:若使用邮箱注册自行认证
请添加图片描述

2.下载对应部署电脑 压缩包(此处笔者使用自己电脑因此以Windows11作为案例)

解压下载的ngrok压缩包,在对应目录进入命令提示符装口(也可直接在对应目录顶部显示栏输入cmd按回车键 或 在目录空白处右击“在终端中打开”);

请添加图片描述

3.执行部署

tips:注意后续需要执行的ngrok命令都需要在本地解压的ngrok目录下执行

进入命令提示符窗口以后执行(官网提供的添加账户信息)命令,添加自己账户信息

ngrok config add-authtoken 2xxxxxxxxxxxxxxxxxxxxxxxxx

请添加图片描述

执行命令将自己本地对应服务端口暴露到公网,实现穿透

ngrok http 8080

穿透以后会提供一个外部访问地址,即可外部网络访问自己本地部署的服务

请添加图片描述

4.固定域名

完成上述三点,即可实现外网访问。但是会存在一个访问地址每次启动都会不一致问题,此时需要去官网完成相关配置。

  • 进入配置页 新增域名

请添加图片描述

  • 复制固定域名完成本地部署

请添加图片描述

复制配置以后,在命令提示符页面按 ctrl+c 先停掉本地之前部署好的内网穿透,执行拷贝的命令。

ngrok http --domain=nearby-xxxx-xxxx.ngrok-free.app 8080

这样就完成固定域名操作

5.前后端项目穿透

若自己本地启动了前后端项目需要穿透到外网如何实现(一个是自己可以通过配置nginx或者其他网关,此处只穿透这个网关即可;或者按照笔者下列处理方式)。

查看官网文档:https://ngrok.com/docs/secure-tunnels/ngrok-agent/reference/config/

  • 首先查看配置文件地址,使用命令ngrok config check

请添加图片描述

  • 修改配置文件(在已有的基础上添加如下配置,添加前后端两个隧道)
tunnels:
  frontdemo:
    proto: http
    addr: 9527
    # domain: alan-httpbin.ngrok.dev
  backdemo:
    proto: http
    addr: 8080
    # domain: demo.inconshreveable.com
    # inspect: false
  • 启动隧道(命令提示符窗口执行)
#前后端都启动
ngrok start --all
#只启动前端/后端
ngrok start frontdemo
ngrok start backdemo

请添加图片描述

  • 5
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值