AI开发者空间实战：把2048小游戏从0部署上云的完整闯关记录

一、背景

华为云开发者成长中心有一个「闯关做任务」的实践活动：把一个网页小应用从开发、沙箱部署、ECS 持久化部署，到发布到开发者作品展览馆，完整走一遍云端交付流程。我选择了经典的 2048 小游戏作为练手对象，并借助华为云 AI 开发者空间协同完成。本文把整个流程和踩到的坑做个记录，方便第一次上手的同学少走弯路。

二、本地：先让 AI 生成一个零依赖的 2048

第一步不追求复杂，目标是零依赖、单文件、可直接运行，这样后面无论是沙箱还是服务器都不会被环境依赖卡住。

我让 AI 生成了一个单文件 index.html，把 HTML、CSS、JavaScript 全部内联，核心功能包括：

• 键盘方向键（移动端支持触摸滑动）控制方块移动；
• 相同数字合并、计分、记录最高分；
• 随机生成新方块、判断游戏结束；
• 「重新开始」按钮与简单的响应式布局。

生成后在本地浏览器直接双击打开，确认玩法完整、样式正常，再进入部署环节。这一步的经验是：先把产物收敛成静态单文件，后面部署会省掉大量构建和依赖问题。

三、沙箱部署：快速验证

在正式购买/开通资源之前，先用沙箱环境快速验证产物能否对外提供访问：

1. 把 index.html 放到沙箱工作目录；
2. 用一个简单的静态服务器（如 Python 自带的 http.server）拉起服务；
3. 通过沙箱分配的访问地址，确认外网可以正常打开页面并能正常玩。

沙箱的特点是生命周期短、适合快速验证，适合用来确认「文件本身没问题、访问链路是通的」。验证通过后再进入持久化部署。

四、ECS 持久化部署：用 Nginx 托管静态页面

验证通过后，把 2048 部署到一台云服务器 ECS 上，使其可以长期访问。这里选用 Nginx 托管静态文件，步骤非常标准：

1. 安装并启动 Nginx；
2. 把 index.html 上传到站点根目录（如 /usr/share/nginx/html/）；
3. 确认 Nginx 默认监听 80 端口并已启动；
4. 本地 curl 验证服务正常。

# 安装（以常见发行版为例）
# 启动并设置开机自启
# 放置静态文件后访问 http://<服务器地址>

最容易踩的坑——安全组：服务明明起来了，但浏览器访问超时，十有八九是安全组没有放行 80 端口。需要在控制台的安全组规则里，为入方向放行 80（HTTP）/443（HTTPS）端口。这一步不在服务器里，而在控制台，最容易被忽略。

五、发布到开发者作品展览馆

服务可以稳定访问后，按开发者作品展览馆的要求准备：作品封面图、作品名称与简介、在线访问地址、源码地址等信息，提交后即可生成作品展示页，方便分享和留存。

六、小结与经验

整体走下来，一个静态网页应用上云的路径非常清晰：

本地验证 → 沙箱快速验证 → ECS + Nginx 持久化 → 安全组放行端口 → 作品发布

几个比较深的体会：

• 最耗时的往往不是写代码，而是环境配置与网络策略：Nginx 安装、端口监听、安全组放行，任何一环漏掉都会导致页面打不开；
• AI 开发者空间在「生成样板代码、给出部署命令、排查报错」上提效明显，能快速给出可执行的步骤；
• 但涉及安全组、资源开通与释放等操作，仍需要人在控制台确认，建议部署完成后逐项核对，避免资源遗留。

最后也提醒一句：体验完成后，按需/试用资源记得及时停止或释放，避免产生不必要的持续计费。希望这份记录对刚接触云服务器部署的同学有帮助。