遇到即记之ngrok--免费HTTPS、本地开发调试、Webhook测试必备工具

遇到即记之ngrok--免费HTTPS、本地开发调试、Webhook测试必备工具

ngrok内网穿透工具详解

工具: ngrok - 内网穿透解决方案
用途: 将本地服务暴露到公网,实现临时公网访问
适用场景: 开发调试、Webhook测试、临时演示、移动端测试、HTTPS测试

📑 目录


📖 什么是ngrok?

ngrok 是一个反向隧道工具,它能够在你本地运行的服务器和公网之间建立一个安全的隧道。简单来说,它可以把你的 localhost:3000 变成一个可以通过互联网访问的网址,比如 https://abc123.ngrok.io

核心概念

  • 本地服务: 运行在你电脑上的应用(如 http://localhost:3000
  • ngrok客户端: 运行在你电脑上的程序,连接到ngrok服务器
  • ngrok服务器: ngrok提供的云端服务器,负责转发请求
  • 公网URL: ngrok分配给你的临时公网地址(如 https://xxx.ngrok.io

总结: ngrok通过建立安全隧道,将本地服务映射到公网,让你无需购买服务器和配置域名,就能快速实现公网访问。特别适合开发测试场景。


🎯 核心功能

1. HTTP/HTTPS隧道 ⭐

自动HTTPS支持是ngrok的核心优势:

# 将本地3000端口暴露到公网(自动提供HTTP和HTTPS) ngrok http 3000

输出示例:

Forwarding http://abc123.ngrok.io -> http://localhost:3000 Forwarding https://abc123.ngrok.io -> http://localhost:3000 

HTTPS特性:

  • 自动提供: 即使本地服务是HTTP,ngrok也会自动提供HTTPS访问
  • 免费SSL证书: 使用Let’s Encrypt证书,完全免费且自动续期
  • 浏览器信任: 所有主流浏览器都信任,无安全警告
  • 适用场景: 微信小程序、PWA、移动App、Webhook等需要HTTPS的场景

常用命令:

# 基本使用 ngrok http 3000# 只允许HTTPS(禁止HTTP) ngrok http 3000 --scheme=https # HTTPS + 基本认证 ngrok http 3000 --basic-auth="admin:password123"# 本地服务已使用HTTPS ngrok http https://localhost:3000 

总结: HTTP/HTTPS隧道是ngrok最常用的功能,特别是自动HTTPS支持,让开发者无需配置SSL证书就能获得安全的HTTPS访问,这是ngrok相比其他工具的核心优势。

2. TCP隧道

支持任意TCP协议(如数据库、SSH等):

# 暴露MySQL数据库(3306端口) ngrok tcp 3306

3. Web界面监控

ngrok提供本地Web界面(默认 http://127.0.0.1:4040),可以:

  • 查看所有HTTP请求和响应
  • 重放请求进行调试
  • 查看请求头、响应头、请求体等详细信息

4. 自定义域名(付费)

付费用户可以绑定自定义域名:

ngrok http 3000 --domain=myapp.example.com 

总结: ngrok提供了HTTP/HTTPS隧道、TCP隧道、Web监控界面和自定义域名等功能,其中自动HTTPS支持是最突出的特性,让开发者能够快速获得安全的公网访问能力。


💡 使用场景

1. 本地开发调试

开发微信小程序、移动App时,需要调用本地API

ngrok http 3000# 将生成的 https://xxx.ngrok.io 配置到小程序/App中

2. Webhook开发测试

开发需要接收第三方回调的应用(如支付回调、GitHub Webhook)

ngrok http 5000# 配置Webhook URL: https://xxx.ngrok.io/webhook

3. 临时演示环境

快速给客户或同事演示本地开发的功能

ngrok http 3000# 直接分享 https://xxx.ngrok.io 给客户访问

4. PWA/权限API测试

PWA的Service Worker、浏览器摄像头/麦克风权限等需要HTTPS

ngrok http 3000# 使用 https://xxx.ngrok.io 访问应用

总结: ngrok主要适用于开发调试、Webhook测试、临时演示和需要HTTPS的场景。它能够快速解决本地服务无法被外部访问的问题,特别适合需要HTTPS但不想配置SSL证书的场景。


✅ 优点

  1. 简单易用: 一条命令即可使用,无需复杂配置
  2. 快速部署: 几秒钟就能将本地服务暴露到公网
  3. HTTPS支持 ⭐: 自动提供HTTPS,免费SSL证书,适合需要安全连接的场景
  4. 请求监控: 内置Web界面查看请求详情,方便调试
  5. 多协议支持: HTTP/HTTPS、TCP、WebSocket
  6. 跨平台: 支持Windows、macOS、Linux

总结: ngrok的最大优势是简单易用和自动HTTPS支持。一条命令就能将本地服务暴露到公网,并且自动提供免费的SSL证书,这对于需要HTTPS但不想配置证书的开发者来说非常方便。


❌ 缺点

  1. 免费版限制: URL随机变化、连接数限制、带宽限制、会话时长限制
  2. 性能问题: 流量经过ngrok服务器转发,有延迟,不适合高并发场景
  3. 安全性: 免费版URL公开,任何人都可以访问(除非设置认证)
  4. 依赖第三方: 依赖ngrok服务器可用性,不适合生产环境
  5. 成本: 高级功能需要付费

总结: ngrok虽然功能强大,但免费版有较多限制,不适合生产环境使用。主要问题是URL随机变化、性能受限和安全性考虑,因此仅建议用于开发测试环境。


🚀 安装和使用

Windows安装

方法1: 直接下载(推荐)
  1. 访问 ngrok官网
  2. 下载Windows版本(zip文件)
  3. 解压到任意目录(如 C:\ngrok
  4. 将ngrok.exe所在目录添加到系统PATH环境变量
方法2: 使用包管理器
# 使用Chocolatey choco install ngrok # 或使用Scoop scoop install ngrok 

注册和配置

  1. 注册账号: 访问 ngrok.com 注册免费账号
  2. 获取Authtoken: 登录后,在Dashboard中找到"Your Authtoken"

配置token:

ngrok config add-authtoken YOUR_AUTH_TOKEN 

基本使用

# 暴露HTTP服务 ngrok http 3000# 只允许HTTPS ngrok http 3000 --scheme=https # HTTPS + 基本认证 ngrok http 3000 --basic-auth="admin:password123"# 暴露TCP服务 ngrok tcp 3306# 自定义域名(付费) ngrok http 3000 --domain=myapp.example.com 

配置文件

创建配置文件 %USERPROFILE%\.ngrok2\ngrok.yml(Windows):

version:"2"authtoken: YOUR_AUTH_TOKEN tunnels:web:addr:3000proto: http schemes:[https]# 只允许HTTPSapi:addr:8080proto: http auth:"admin:password123"

使用配置文件启动:

ngrok start web 

总结: ngrok的安装和使用非常简单,只需注册账号、配置token,然后一条命令就能启动。配置文件方式适合需要管理多个隧道的场景,可以预先定义好各种配置。


💻 代码开发中的应用

前端开发

// .env.developmentVITE_API_BASE_URL=https://abc123.ngrok.io/api // 在代码中使用const response =awaitfetch(`${import.meta.env.VITE_API_BASE_URL}/users`)

微信小程序开发(必须HTTPS)

// app.jsconstAPI_BASE_URL='https://abc123.ngrok.io/api'// 必须使用HTTPS wx.request({url:`${API_BASE_URL}/user/info`,method:'GET',success:(res)=>{ console.log(res.data)}})

Webhook开发

// server.jsconst express =require('express')const app =express() app.use(express.json()) app.post('/webhook',(req, res)=>{ console.log('收到Webhook:', req.body) res.json({success:true})}) app.listen(3000,()=>{ console.log('服务器运行在 http://localhost:3000') console.log('使用 ngrok http 3000 暴露到公网') console.log('配置Webhook URL: https://xxx.ngrok.io/webhook')})

获取ngrok URL的API

// 自动获取ngrok HTTPS URLasyncfunctiongetNgrokUrl(){try{const response =awaitfetch('http://127.0.0.1:4040/api/tunnels')const data =await response.json()// 获取HTTPS URLconst httpsTunnel = data.tunnels.find(t=> t.proto ==='https')return httpsTunnel?.public_url ||null}catch(error){ console.error('无法获取ngrok URL:', error)returnnull}}

总结: ngrok在代码开发中的应用非常广泛,特别是在需要HTTPS的场景下。无论是前端开发、微信小程序、Webhook开发,ngrok都能提供便捷的HTTPS访问能力,大大简化了开发流程。


🔒 安全注意事项

  1. 敏感数据保护:
    • ❌ 不要暴露包含敏感数据的服务
    • ❌ 不要在生产环境使用免费版ngrok
    • ✅ 仅用于开发、测试、演示环境
  2. URL保密: 不要将ngrok URL提交到代码仓库
  3. 监控日志: 定期检查ngrok Web界面的请求日志

认证保护: 强烈建议设置认证

ngrok http 3000 --basic-auth="username:password"

总结: 使用ngrok时一定要注意安全,特别是免费版URL是公开的。建议设置认证保护,不要暴露敏感数据,仅用于开发测试环境,并定期检查访问日志。


🆚 与其他工具对比

特性ngrokfrplocaltunnel
易用性⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐⭐
免费HTTPS
Web监控界面
配置复杂度

选择建议:

  • 快速临时使用: ngrok、localtunnel
  • 需要自定义域名: ngrok(付费)、frp(自建)
  • 需要完全控制: frp(自建服务器)

总结: ngrok在易用性和免费HTTPS方面有明显优势,适合快速临时使用。如果需要更多控制或自定义域名,可以考虑frp等自建方案。


📝 常见问题

Q1: ngrok免费版URL会变化吗?

A: 是的,免费版每次启动都会生成新的随机URL。如果需要固定URL,需要付费订阅。

Q2: ngrok可以用于生产环境吗?

A: 不推荐。ngrok适合开发测试环境。生产环境应该使用云服务器 + 域名 + SSL证书。

Q3: ngrok的HTTPS证书是免费的吗?

A: 是的,ngrok使用Let’s Encrypt签发的免费SSL证书,免费版也完全支持HTTPS。

Q4: 本地服务是HTTP,ngrok能提供HTTPS吗?

A: 完全可以!这是ngrok的核心功能。即使本地服务是 http://localhost:3000,ngrok也会自动提供 https://xxx.ngrok.io 访问。

Q5: 如何只允许HTTPS访问,禁止HTTP?

A: 使用 --scheme=https 参数:

ngrok http 3000 --scheme=https 

Q6: ngrok支持WebSocket吗?

A: 是的,ngrok完全支持WebSocket协议。

Q7: 如何查看ngrok的请求日志?

A: 访问 http://127.0.0.1:4040 可以查看所有请求和响应的详细信息。

Q8: ngrok连接断开怎么办?

A: 检查网络连接,重新启动ngrok:ngrok http 3000

总结: 常见问题主要集中在URL变化、HTTPS支持、生产环境使用等方面。记住ngrok是开发工具,免费版HTTPS是核心优势,但不适合生产环境。


🎓 最佳实践

  1. 团队协作: 使用ngrok快速分享本地开发进度
  2. 调试技巧: 使用ngrok Web界面(4040端口)查看请求详情
  3. 成本优化: 开发环境使用免费版即可

开发工作流:

# 1. 启动本地服务npm run dev # 2. 在另一个终端启动ngrok ngrok http 3000# 3. 复制HTTPS URL到配置文件# 4. 开始开发测试

总结: 最佳实践包括建立规范的开发工作流、利用ngrok进行团队协作、使用Web界面进行调试,以及合理选择免费版或付费版。关键是理解ngrok的定位,将其作为开发工具而非生产解决方案。


📚 总结

核心要点

ngrok是一个简单易用的内网穿透工具,通过建立安全隧道将本地服务暴露到公网。它的核心优势是自动HTTPS支持,无需配置SSL证书就能获得安全的HTTPS访问。

适用场景总结

强烈推荐使用的场景:

  1. 本地开发调试 - 特别是需要外部访问的场景(如移动App、小程序开发)
  2. Webhook开发测试 - 接收第三方回调(支付、GitHub等)
  3. 临时演示环境 - 快速给客户或同事演示功能
  4. 需要HTTPS的场景 - 微信小程序、PWA、浏览器权限API等必须HTTPS的场景
  5. 移动端测试 - 在手机上测试本地开发的Web应用

不推荐使用的场景:

  1. 生产环境 - 不适合长期使用,应该使用专业的部署方案
  2. 高并发场景 - 性能受限,不适合高流量应用
  3. 敏感数据服务 - 免费版URL公开,安全性不足
  4. 需要固定域名 - 免费版URL随机变化,需要付费才能固定

核心优势

  1. 零配置HTTPS - 自动提供免费SSL证书,这是ngrok最大的优势
  2. 简单易用 - 一条命令即可使用,无需复杂配置
  3. 快速部署 - 几秒钟就能将本地服务暴露到公网
  4. 请求监控 - 内置Web界面,方便调试和排查问题

使用建议

  1. 开发阶段: 使用免费版即可,充分利用自动HTTPS功能
  2. 安全防护: 设置基本认证,不要暴露敏感数据
  3. 生产环境: 使用云服务器 + 域名 + SSL证书的专业方案
  4. 团队协作: 利用ngrok快速分享开发进度,提高协作效率

关键提醒

ngrok是开发工具,不是生产解决方案。
在开发阶段使用ngrok可以大大提高效率,特别是需要HTTPS的场景。
但生产环境应该使用专业的部署方案,确保稳定性和安全性。

快速开始

# 1. 注册账号并配置token ngrok config add-authtoken YOUR_AUTH_TOKEN # 2. 启动本地服务npm run dev # 运行在 localhost:3000# 3. 启动ngrok(自动提供HTTPS) ngrok http 3000# 4. 使用生成的 https://xxx.ngrok.io 访问服务

记住: ngrok的核心价值在于快速、简单、自动HTTPS,让开发者能够专注于业务开发,而不用为网络配置和SSL证书烦恼。正确理解和使用ngrok,可以大大提高开发效率!


🔗 相关资源


最后更新: 2026-01-27
文档版本: 2.0(精简版)

Read more

【AI】——SpringAI通过Ollama本地部署的Deepseek模型实现一个对话机器人(二)

【AI】——SpringAI通过Ollama本地部署的Deepseek模型实现一个对话机器人(二)

🎼个人主页:【Y小夜】 😎作者简介:一位双非学校的大三学生,编程爱好者, 专注于基础和实战分享,欢迎私信咨询! 🎆入门专栏:🎇【MySQL,Javaweb,Rust,python】 🎈热门专栏:🎊【Springboot,Redis,Springsecurity,Docker,AI】  感谢您的点赞、关注、评论、收藏、是对我最大的认可和支持!❤️ 目录 🎈Java调用Deepseek  🍕下载Deepseek模型  🍕本地测试  🍕Java调用模型 🎈构建数据库  🍕增强检索RAG  🍕向量数据库  🍕Springboot集成pgvector 🎈chatpdf 🎈function call调用自定义函数 🎈多模态能力 🎈Java调用Deepseek 本地没有安装Ollama、Docker,openwebUI,可以先学习一下这篇文章:【AI】——结合Ollama、Open WebUI和Docker本地部署可视化AI大语言模型_ollma+本地大模型+open web ui-ZEEKLOG博客

OmniSteward:LLM Agent 赋能,语音文字随心控,智能家居与电脑的超级管家

OmniSteward:LLM Agent 赋能,语音文字随心控,智能家居与电脑的超级管家

目录 * 一、前言 * 二、项目概述 * 三、功能特性 * 四、技术架构 * 五、安装与使用 * 1、系统要求 * 2、安装步骤 * 3、环境变量配置 * 4、启动方式 * 4.1 命令行模式(CLI) * 4.2 Web模式 * 六、应用场景与未来展望 * 七、结语 一、前言 在科技日新月异的今天,人工智能正以前所未有的速度改变着我们的生活方式。从智能手机的语音助手到智能家居的自动化控制,AI技术逐渐渗透到生活的各个角落,为我们带来了便捷与高效。OmniSteward正是在这样的背景下应运而生,它作为一款基于大语言模型的全能AI管家系统,致力于打破人机交互的壁垒,为用户打造一个智能、高效、便捷的生活和工作环境。无论是忙碌的上班族希望在工作中提高效率,还是追求高品质生活的家庭用户渴望轻松掌控家居设备,OmniSteward都有可能成为他们理想的智能伙伴,引领我们进入一个全新的智能生活时代。 二、项目概述 OmniSteward是一个正在积极开发中的全能管家系统,

【UAV】基于射频和深度学习的无人机检测与识别:构建大型开源无人机数据库的初步探索【附MATLAB+python代码】

【UAV】基于射频和深度学习的无人机检测与识别:构建大型开源无人机数据库的初步探索【附MATLAB+python代码】

文章来源:微信公众号:EW Frontier QQ交流群:1074124098(如满私信留言获取最新群) 注:本文为参考文章~代码为对其部分内容进行复现~ 若有侵权联系删除。 摘要 民用无人机的普及可能引发技术、安全和公共安全问题,这些问题亟待解决、规范和预防。安全机构一直在不断探索能够检测无人机的技术和智能系统。然而,相关技术的突破因缺乏无人机射频信号开源数据库而受阻,这些射频信号可通过远程传感和存储,为开发最有效的无人机检测与识别方法提供支持。本文为构建不同飞行模式下各类无人机射频信号数据库迈出了重要一步。我们系统地收集、分析并记录了不同无人机在不同飞行模式(如关闭、开启并连接、悬停、飞行和视频录制)下的原始射频信号。此外,我们利用所开发的射频数据库设计了智能算法,用于检测和识别入侵无人机。研究采用三个深度神经网络,分别实现无人机存在检测、无人机存在及类型识别,以及无人机存在、类型及飞行模式识别。通过 10 折交叉验证过程验证每个深度神经网络的性能,并使用多种指标进行评估。分类结果显示,随着类别数量的增加,性能普遍下降。平均准确率从第一个深度神经网络(2 类)的 99.7%