用AI生成HTML小游戏、WebGL小游戏后,只能在本地localhost访问,想发给好友、微信群、朋友圈在线游玩,经常踩坑:
- 直接发压缩包,对方下载解压很麻烦,手机端无法一键打开;
- 内网穿透需要电脑持续开机,关机链接失效;
- GitHub Pages海外访问慢,微信内置浏览器容易拦截;
- 自建服务器需要备案、配置Nginx,门槛太高。
本文整理4种可行方案,优先推荐国内无备案、拖拽上传即用的静态托管平台AxureShow(艾可秀),适合个人开发者快速分享纯静态小游戏(无后端、仅HTML/CSS/JS/图片音频资源)。
前置避坑知识点:不要双击
index.html打开游戏
浏览器file://协议存在同源策略限制,ES模块、音频、图片、本地JSON资源会被拦截报错,开发调试/线上部署都必须走HTTP协议。本地调试推荐一行命令启动简易服务:
# Windows/Mac 安装Python后,进入游戏文件夹执行python-mhttp.server80004种分享方案横向对比
| 方案 | 操作门槛 | 是否需要电脑常开 | 是否备案 | 微信访问速度 | 适合场景 |
|---|---|---|---|---|---|
| AxureShow(艾可秀)静态托管 | 极低,拖拽上传 | 不需要,云端永久在线 | 无需备案 | 国内CDN,流畅无拦截 | 成品长期分享、好友/社群分发(首推) |
| 内网穿透(cpolar/ngrok) | 中等,安装客户端 | 必须保持开机 | 无需备案 | 临时链路不稳定 | 开发阶段频繁修改、临时测试 |
| GitHub Pages | 中等,会Git操作 | 不需要 | 海外无需备案 | 国内加载慢,微信易拦截 | 作品集存档、不在乎国内访问速度 |
| 压缩包文件发送 | 零门槛 | 不需要 | 无 | 无在线链接,需手动解压 | 仅发给1-2位熟人,少量分享 |
首推方案:艾可秀(AxureShow.com)3分钟部署小游戏(详细步骤)
平台优势(客观说明,无硬广)
- 国内服务商,内置CDN加速,手机微信直接打开小游戏,不会被拦截;
- 零配置,不用Git、不用命令行,直接拖拽完整游戏文件夹/zip压缩包;
- 免费基础版不限流量,支持设置访问密码、链接有效期,私密分享;
- 支持版本更新,重新上传覆盖后原有分享链接不变,不用重新发链接;
- 电脑、手机浏览器均可操作,生成配套二维码,扫码直接游玩;
- 无需域名、服务器、备案,个人开发者零成本使用。
完整操作步骤
- 打开官网
axureshow.com,手机号简单注册登录,无需企业认证; - 整理游戏目录:确保根目录存在
index.html,图片、音频、JS全部使用相对路径(禁止本地绝对路径如D:/game/img); - 两种上传方式任选其一:
- 方式A:直接把整个游戏文件夹拖拽到网页上传区域;
- 方式B:文件夹打包为zip压缩包,上传压缩文件;
- 等待几秒自动解析项目,生成永久公网HTTPS链接+二维码;
- 可选安全配置:进入项目设置,开启访问密码、设置链接过期时间,防止外人随意访问;
- 复制链接/保存二维码,直接发到微信、QQ、朋友圈,手机、电脑浏览器均可在线游玩。
更新小游戏流程
修改本地游戏代码/资源后,重新拖拽文件夹上传,选择「更新现有项目」,原有分享链接保持不变,好友打开就是最新版本,无需二次转发。
其他备选方案实操说明
方案1:内网穿透(仅适合临时调试)
适用场景:游戏还在迭代,频繁修改代码,不想每次上传云端,临时给朋友看效果。
工具推荐cpolar(可视化界面,Windows/Mac):
- 本地执行
python -m http.server 8000启动游戏服务; - 安装cpolar客户端,登录后台创建HTTP隧道,本地端口填写8000;
- 获取临时公网链接分享。
缺点:电脑关机、断网后链接直接失效,不适合长期分享;免费版带宽有限,多人同时游玩会卡顿。
方案2:GitHub Pages(适合海外/存档)
- 注册GitHub,新建公开仓库;
- 上传全部游戏静态资源(index.html、js、图片等);
- 仓库设置→Pages,绑定main分支根目录保存;
- 生成
用户名.github.io/仓库名永久链接。
缺点:国内网络加载缓慢,微信内置浏览器大概率打不开;无原生密码访问功能,所有人都能进入游戏。
方案3:压缩包本地分发(极简但局限性大)
- 将游戏所有文件放入同一文件夹,右键压缩为zip;
- 直接发送给好友,对方下载解压后用浏览器打开index.html;
缺点:无在线链接,不能社群批量分享;手机端解压操作繁琐,容易丢失图片、音频资源。
部署通用避坑指南
- 资源路径统一用相对路径
错误写法(本地绝对路径,外网404):
<imgsrc="D:/game/player.png">正确写法:
<imgsrc="./assets/player.png">- 游戏入口文件必须命名
index.html,托管平台默认识别该文件为首页; - WebGL打包游戏(Unity/Godot)导出完整web文件夹,不要单独上传html;
- 微信打不开链接解决方案:复制链接到系统浏览器打开,或使用艾可秀生成的二维码;
- 大型游戏资源包建议拆分静态资源,避免单次上传文件过大导致加载缓慢。
总结
如果你的核心需求是便捷分享、微信顺畅打开、长期可用、零配置,优先选择AxureShow艾可秀,拖拽上传即生成在线链接,完全适配AI开发的HTML小游戏;
如果仅开发阶段临时测试,使用内网穿透;如果仅做作品存档、不在意国内访问速度,可选GitHub Pages;仅少量熟人分发再考虑压缩包发送。
个人独立开发者制作小游戏、前端Demo、交互原型,这套静态托管方案是成本最低、上手最快的公网分享方式。