告别 ngrok 限制!微软内置神器 Dev Tunnels,1分钟免费将本地项目暴露到公网

大家好,我是提米哥。

平时大家在本地写代码,项目跑在 localhost:3000,自己看没问题。但如果想让队友帮忙看下效果、想测试 Stripe 或微信支付的 Webhook 回调、或者想直接发个链接给客户看 Demo,怎么办?

很多人的第一反应是用 ngrok。但 ngrok 免费版限制多(比如限制请求数、只能开1个隧道),还要专门去注册账号、下载安装。

今天提米哥给大家介绍一个微软官方出品的“隐藏福利”——Dev Tunnels。如果你用的是 Visual Studio 或 VS Code,它已经内置在你的编辑器里了!完全免费、不用额外安装、不用注册新账号,1分钟就能搞定内网穿透。

🎯 什么是 Dev Tunnels?

简单来说,Dev Tunnels 就是微软提供的一项“内网穿透”服务。它能给你本地的 localhost 生成一个临时的公网 URL。

外部请求(比如手机、队友的电脑、Webhook 服务器)访问这个公网 URL 时,微软的 Azure 服务器会帮你把流量安全地转发到你本地的电脑上。你甚至不需要去路由器或防火墙里配置端口映射。

🆚 为什么选 Dev Tunnels 而不是 ngrok?

提米哥给大家总结了 Dev Tunnels 对比 ngrok 的核心优势:

  • 零安装成本:直接集成在 Visual Studio 和 VS Code 中,拿来就用;ngrok 需要单独下载安装。
  • 账号现成:直接用你现有的微软或 GitHub 账号登录;ngrok 需要单独注册。
  • 完全免费且无严苛限制:Dev Tunnels 对开发者免费;ngrok 免费版有每分钟 40 次请求和单隧道限制。
  • 固定 URL (Persistent URL):在 VS 和 CLI 模式下支持固定 URL;ngrok 的固定 URL 需要花钱买付费版(每月 8 美元起)。
  • 深度集成:在微软系 IDE 中无缝衔接;ngrok 需要自己手动敲命令配置。

(注:Dev Tunnels 目前不支持自定义域名,且仅支持 HTTP/HTTPS 流量,不适合纯 TCP 隧道需求。)


🛠️ 3种实战用法,挑你最顺手的

方式一:Visual Studio 开发者(最简单,改1行配置)

适合 .NET 和 ASP.NET 开发者。

1. 打开配置文件
在解决方案资源管理器中,找到 Properties 文件夹下的 launchSettings.json

2. 添加隧道配置
在你的启动配置中,加上 devTunnelEnableddevTunnelAccess 这两个属性:

{
  "profiles": {
    "MyWebApp": {
      "commandName": "Project",
      // 你本地的运行地址
      "applicationUrl": "https://localhost:7175;http://localhost:5175",
      // 开启 Dev Tunnel 功能
      "devTunnelEnabled": true,
      // 设置访问权限为公开,任何人有链接都能访问
      "devTunnelAccess": "public"
    }
  }
}

3. 正常运行项目
直接按 F5 运行。Visual Studio 会自动帮你建好隧道,并在“输出”窗口打印出公网 URL,类似这样:
Hosting port 7175 at https://lxm0ltdt-7175.usw2.devtunnels.ms/
把这个链接发给别人就行了,每次按 F5 都会自动连上。

方式二:VS Code 开发者(鼠标点3下)

适合 Node.js、Python、Go 等所有语言的开发者。

1. 正常启动你的项目
比如在终端运行 npm run dev,让项目跑在 localhost:3000

2. 打开端口面板
按下 Ctrl+Shift+P(Mac 是 Cmd+Shift+P),输入 Ports: Focus on Ports View,或者直接点击底部面板的 PORTS (端口) 标签页。

3. 转发端口并公开
– 如果列表里没有 3000 端口,点击 “Forward a Port” (转发端口),输入 3000
– 右键点击 3000 端口,选择 Port Visibility (端口可见性),改为 Public (公开)

4. 获取链接
端口列表里会直接显示一个类似 https://xxxx-3000.usw2.devtunnels.ms/ 的公网地址,复制拿走即可。
(注意:首次使用 VS Code 会弹窗让你用 GitHub 或微软账号登录授权。)

方式三:命令行 CLI(极客专属,不依赖 IDE)

适合不想开 IDE,或者在服务器/远程机器上操作的同学。

1. 安装 CLI 工具
Linux / macOS 用户:

# 使用官方脚本一键安装 Dev Tunnels CLI
curl -sL https://aka.ms/DevTunnelCliInstall | bash

Windows 用户 (使用 winget):

# 使用 Windows 包管理器安装
winget install Microsoft.DevTunnels

2. 登录账号

# 执行登录命令,会弹出浏览器让你用微软或 GitHub 账号授权
devtunnel user login

3. 启动隧道

# 先确保你的本地服务跑起来了,比如跑一个 Python 简易服务器
python -m http.server 8080

# 然后开启隧道,将 8080 端口暴露出去
devtunnel host -p 8080

终端会输出你的公网 URL,搞定!

附:CLI 常用命令速查
devtunnel list:查看你创建的所有隧道。
devtunnel show <id>:查看某个隧道的详细信息。
devtunnel delete <id>:删除不需要的隧道。
devtunnel host -p 8080 --allow-anonymous:开启公开访问,免登录。
devtunnel echo http -p 8080:创建一个测试用的回显服务器。


🔐 访问权限怎么控制?

不管是 VS 还是 VS Code,Dev Tunnels 都提供了 3 个级别的权限控制,不用担心本地代码被陌生人偷窥:

  • Private (私有):只有你自己能访问,且必须登录同一个微软账号。
  • Organization (组织):只有你们公司/组织内部的人(通过 Azure AD 验证)才能访问。
  • Public (公开):任何人只要有这个链接就能访问(适合发给客户看 Demo 或测试 Webhook)。

🔥 提米哥推荐的实战场景

  • 测试 Webhook 回调:开发 Stripe、GitHub、微信公众号、LINE 机器人时,直接让官方服务器把回调打到你的本地 localhost。
  • 给客户演示 Demo:代码还没写完,不想部署到测试服?直接发个临时链接给客户看效果。
  • 手机真机调试:不用搞什么模拟器,直接用手机浏览器访问公网 URL,测试移动端适配。
  • 团队联合 Debug:前端和后端联调,后端把本地 API 穿透出来,前端直接连,边跑边 Debug。
  • OAuth 登录测试:测试第三方登录的 Callback URL 时,不用每次都改线上配置。

⚠️ 新手避坑指南

  • 隧道的生命周期:在 VS Code 里创建的临时隧道,关掉编辑器就失效了;在 VS 或 CLI 里可以创建持久化隧道,直到你手动删除。
  • 必须登录:Dev Tunnels 不支持完全匿名的“裸奔”模式,为了安全,你必须用微软或 GitHub 账号登录一下。
  • 仅支持 Web 流量:它专门为 HTTP/HTTPS 设计,如果你想穿透 SSH 或纯 TCP 游戏私服,它不太合适。
  • 流量走向:你的数据是经过微软 Azure 的中继服务器转发的,不是 P2P 直连,所以不用担心本地 IP 泄露,但也意味着受限于微软服务器的网络状况。

提米哥总结一句:Dev Tunnels 就是一个自带于你开发工具中的“免费版无限制 ngrok”。下次再遇到需要暴露本地端口的情况,别去到处找破解版 ngrok 了,直接用内置的它!

直达网址:https://learn.microsoft.com/en-us/azure/developer/dev-tunnels/get-started

类似文章