内网HTML5网页实现外网访问需端口映射或内网穿透：路由器映射要求有管理权限和可用公网端口；frp/ngrok适用于无公网IP场景；关键须监听0.0.0.0、放行防火墙、注意跨域。
内网 HTML5 网页想让外网访问，本质是端口映射或反向代理问题
直接把本地 index.html 双击打开，或用 python -m http.server 8000 启服务，外网默认完全不可见——因为你的电脑没有公网 IP，且路由器/防火墙会拦截所有入站请求。必须让外网流量能“找到并穿过”你的网络边界，落到本地服务上。
用路由器端口映射（最常见但有前提）
适用于你有管理权限的家用/小型办公路由器，且 ISP 没封 80/443 等常用端口。
- 先在电脑上启动一个本地 HTTP 服务，比如
python3 -m http.server 8080（确保浏览器能通过http://localhost:8080访问） - 登录路由器后台（通常是
192.168.1.1或192.168.0.1），找「虚拟服务器」「端口转发」「NAT 映射」类选项 - 添加规则：外部端口（如
8080），内部 IP（如192.168.1.100），内部端口（8080），协议选TCP - 保存后，在外网用「你的公网 IP:8080」访问（可用手机切蜂窝网络测试）
- ⚠️ 注意：
ipconfig（Windows）或ifconfig查到的是内网 IP；公网 IP 要去路由器状态页看，或访问https://api.ipify.org
用 frp/ngrok 做内网穿透（无公网 IP 也能用）
当路由器不支持映射、你在校园网/企业网、或 ISP 封了端口时，这是更可靠的方案。原理是让本地客户端连到公网中转服务器，再由它把外网请求转发回来。
-
frp需自己租一台云服务器（如腾讯云轻量应用服务器，月付约 ¥30），部署frps（服务端），再在本地运行frpc（客户端）配置映射 -
ngrok有免费 tier（带随机子域名、每分钟连接数限制），执行ngrok http 8080即可获得类似https://abc123.ngrok.io的外网地址 - 二者都要求本地服务已启动且端口未被占用；
ngrok免部署但域名不可定制，frp可配自有域名 + HTTPS，但需维护服务端
别忽略的三个关键点
很多失败不是卡在映射本身，而是这些细节没处理：
立即学习“前端免费学习笔记（深入）”；
- 本地服务必须监听
0.0.0.0:8080，而非仅127.0.0.1:8080（Python 默认只绑本地回环，加参数--bind 0.0.0.0:8080或改用http-server -a 0.0.0.0 -p 8080） - Windows 防火墙 / macOS 防火墙可能拦截入站连接，需手动放行对应端口或关闭防火墙测试
- HTML5 页面若用
fetch('/api/data.json')这类相对路径请求，部署后仍走同源，但若后端接口在另一台机器，跨域问题会立刻暴露——此时需服务端加Access-Control-Allow-Origin或统一走代理
真正卡住人的，往往是本地服务没对外监听、防火墙静默丢包、或以为“能打开就是能外访”，结果连第一步都没走出去。
