在浏览器打开:http://localhost:4040
在ngrok Web界面顶部,应该显示:
Forwarding https://xxx.ngrok-free.dev -> http://localhost:8080
关键检查点:
如果显示的是其他端口(如8081)→ ngrok配置错误!
正确的启动命令:
ngrok http 8080
错误的启动命令:
ngrok http 8081 → 端口错误ngrok tcp 8080 → 协议错误(应该用http)重要: 你的应用context-path是 /api
正确的URL格式:
https://xxx.ngrok-free.dev/api/wechat/case/stepCode/dealings?stepCode=500
错误的URL格式:
https://xxx.ngrok-free.dev/wechat/... → 缺少 /apihttps://xxx.ngrok-free.dev/api/api/wechat/... → 重复了 /api查看左侧请求列表:
查看请求详情:
502 Bad Gateway → ngrok无法连接到后端(最可能的原因)404 → URL路径错误401 → 认证失败(但至少请求到达了后端)根据你的情况(完全没有日志),最可能的原因是:
症状: ngrok显示 Forwarding ... -> http://localhost:8081(或其他端口)
解决方案:
ngrok http 8080-> http://localhost:8080/api症状: 前端请求的是 https://xxx.ngrok-free.dev/wechat/...(缺少/api)
解决方案:
修改前端代码,确保URL包含 /api:
// 错误的
const url = 'https://xxx.ngrok-free.dev/wechat/case/stepCode/dealings';
// 正确的
const url = 'https://xxx.ngrok-free.dev/api/wechat/case/stepCode/dealings';
症状: 在ngrok Traffic Inspector中看到502错误
解决方案:
尝试使用 127.0.0.1 而不是 localhost:
ngrok http 127.0.0.1:8080
检查Windows防火墙设置
重启ngrok和后端应用
发送一个测试请求(通过ngrok)
https://你的ngrok域名/api/wechat/case/stepCode/dealings?stepCode=500ngrok-skip-browser-warning: true查看ngrok Traffic Inspector
查看后端日志
如果发现ngrok端口配置错误:
# 1. 停止当前ngrok(在ngrok窗口按Ctrl+C)
# 2. 重新启动ngrok(确保端口是8080)
ngrok http 8080
# 3. 确认输出显示:
# Forwarding https://xxx.ngrok-free.dev -> http://localhost:8080
请提供以下信息: