小工具大用途！Vercel 的一个本地开发端口神器

摘要

随着本地 Vibe Coding 的项目越来越多，端口管理越来越麻烦。同时跑前端、后端、文档服务，终端里一堆端口号，上午还记得 3000 是前端、8080 是 API，下午开了新项目就全乱了。Vercel 出的一个本地开发代理工具 portless，目前 7.6k star，正好解决这个问题。

portless 是什么？

portless 是一个本地开发代理工具，它把 http://localhost:3000 这样的地址，变成 https://myblog.localhost。端口号不见了，换成了你自己起的名字，自动带 HTTPS，不需要改任何应用代码。

使用对比

原来的启动方式：

next dev  # 访问 http://localhost:3000

用 portless 之后：

portless myblog next dev  # 访问 https://myblog.localhost

就这一个改动就行了。

工作原理

portless 在本地跑一个反向代理，监听 443 端口（或 8443 非特权端口）。启动应用时，portless 会自动在 4000-4999 之间分配一个随机端口。除了自动分配，它还会生成一张 CA 证书，写入到系统的信任库，之后就可以使用 HTTPS 的方式来访问了。

实战测试

Go 后端

先写一个最简单的 Go HTTP 服务，关键是要读 PORT 环境变量。

启动命令：

portless myapi go run main.go

输出示例：

-- Proxy is running
-- myapi.localhost (auto-resolves to 127.0.0.1)
-- Using port 4165 -> https://myapi.localhost:8443
Running: PORT=4165 HOST=127.0.0.1 go run main.go
Starting server on port 4165...

portless 把端口 4165 分配给了 Go 进程，自己在 8443 监听（非特权端口，避免 sudo），两个端口之间做代理转发。访问 https://myapi.localhost:8443/api/health，正常返回 JSON。当然，也可以直接分配使用 443，省去端口输入。

Next.js 前端

在 next.config.ts 里加一行，允许 portless 域名的跨域请求：

const nextConfig: NextConfig = {
  allowedDevOrigins: ['myblog.localhost', '*.myblog.localhost'],
};

然后启动：

portless myblog next dev

portless 分配端口给 Next.js，代理到 https://myblog.localhost:8443，Next.js 的 HTTPS 开发环境就有了。

同时跑两个服务

两个终端，各跑各的：

# 终端 1
portless myapi go run main.go
# -> https://myapi.localhost:8443

# 终端 2
portless myblog next dev
# -> https://myblog.localhost:8443

两个服务共用同一个代理进程，通过子域名区分。

Worktree 场景

portless 文档里说会自动检测 git worktree，给不同分支分配不同子域名。比如主分支是 myblog.localhost，在 fix-nav 分支的 worktree 里运行，自动变成 fix-nav.myblog.localhost。

实际测下来，自动检测没触发，可能是测试方式问题。手动指定名字反而更可靠，意图更清晰：

# 主分支
portless myblog next dev
# -> https://myblog.localhost:8443

# fix-nav worktree，换个名字
portless fix-nav.myblog next dev
# -> https://fix-nav.myblog.localhost:8443

实用命令备忘

# 查看当前注册的所有路由
portless list

# 注册一个静态端口（Docker 容器或其他固定端口服务）
portless alias mydb 5432

# 指定固定端口，不让 portless 自动分配
portless myapi --app-port 8080 go run main.go

# 局域网模式，让同一 WiFi 下的手机也能访问
portless proxy start --lan
portless myblog next dev
# 手机访问 http://myblog.local

# 清理所有状态（CA 证书、hosts 记录、进程信息）
portless clean

核心价值

portless 最有价值的几个场景：

本地同时跑多个服务：以前靠记端口，现在靠记名字，认知负担低很多。api.myproject.localhost 比 3001、3002、3003 好记多了。
测试需要 HTTPS 的功能：Cookie 的 Secure 属性、navigator.clipboard、Service Worker，这些在 http://localhost 上跑不起来或者行为不一致，portless 给了一个干净的本地 HTTPS 环境。
多 worktree 并行开发：不同分支分配不同子域名，不抢端口、不冲突，可以同时对比两个分支的效果。
局域网调试：--lan 模式用 mDNS 广播，手机或同事的电脑不需要配任何东西，直接访问 myblog.local。

来源：

On this page