如何将 PortPreview 与 Express.js 应用程序一起使用

要将 PortPreview 与 Express.js 应用程序一起使用，请监听 0.0.0.0（或 app.listen(PORT)，仅绑定到本地主机），运行 npx portpreview PORT，并注册 Webhook、OAuth 回调和 API 演示的 HTTPS URL。

为什么选择隧道快车

Express 仍然是 Node API 和 BFF 的默认 HTTP 层。当您在本地调试中间件订单和原始正文解析时，支付提供商、CRM Webhook 和 OAuth 服务器需要公共 HTTPS 端点。

• Webhook。 在 express.json() 之前将 express.raw() 安装到 Webhook 路径上。详情见Express webhook local testing。
• OAuth。将重定向 URI 设置为您的隧道源。参见OAuth callback testing。
• 共享 API。让移动或前端团队无需 VPN 即可访问您的本地 API。参见share local dev server。

快速启动

1. 启动 Express：端口 3000 上的node server.js 或 npm run dev。
2. 运行npx portpreview 3000。
3. 测试GET https://your-tunnel.portpreview.dev/health。
4. 将提供商 Webhook 配置为 POST https://your-tunnel.portpreview.dev/api/webhooks/...。

最小 Express 服务器

import express from 'express';

const app = express();
const PORT = process.env.PORT ?? 3000;

app.get('/health', (_req, res) => res.json({ ok: true }));

app.listen(PORT, () => {
  console.log(`Listening on http://localhost:${PORT}`);
});

Express 默认情况下侦听所有接口。如果显式绑定，请使用'0.0.0.0'，以便隧道进程可以转发流量。

信任代理标头

在 PortPreview 后面，您的应用程序会看到 X-Forwarded-Proto: https。生成绝对 URL 或安全 cookie 时启用信任代理：

app.set('trust proxy', 1);

用于分割前端的 CORS

如果另一个端口上的 React 或 Vue 开发服务器通过单独的隧道调用您的 Express API，请显式配置 CORS：

import cors from 'cors';
app.use(cors({ origin: process.env.FRONTEND_TUNNEL_URL }));

安全清单

• 在解析 JSON 之前验证 Webhook 签名。
• 切勿在共享隧道上公开未经身份验证的管理路由。
• 完成后停止隧道。参见tunnel security。

Express documentation涵盖中间件和路由。 Start PortPreview free。