用华为云 CodeArts Agent + OBS 静态托管，五分钟把 2048 小游戏部署到公网

前言

作为开发者，我们经常想快速做一个好玩的小项目并分享给朋友。传统流程需要：买服务器 → 配环境 → 部署 → 配域名 → 开放安全组，少说也要半小时。本文分享一条更轻量的路径：用华为云码道（CodeArts）代码智能体编写游戏，再用 OBS 对象存储静态托管一键上公网，全程不到五分钟，零服务器、零运维。

一、用 CodeArts Agent 生成 2048 小游戏

2048 是经典的数字合并游戏，规则简单却让人上瘾。我让 CodeArts Agent 直接生成一个纯单文件 HTML 版本——CSS 和 JS 全部内联，不依赖 npm、Vite 或任何构建工具，浏览器打开即玩。

核心需求：

• 4×4 网格，方向键 / WASD 操作（PC）+ 滑动手势（移动端）
• 相同数字合并得分，最高分本地持久化
• 游戏结束 / 达成 2048 判定
• 响应式适配 PC 与移动端

Agent 生成的核心合并算法（精简版）：

function move(dir) {
  const rows = dir === 'left' || dir === 'right';
  const rev = dir === 'right' || dir === 'down';
  for (let i = 0; i < SIZE; i++) {
    // 取出一行/一列，按方向决定是否反转
    let line = [];
    for (let j = 0; j < SIZE; j++) {
      line.push(grid[rows ? i : j][rows ? j : i]);
    }
    if (rev) line.reverse();
    // 紧凑 + 合并相邻相同值
    let compact = line.filter(Boolean);
    for (let k = 0; k < compact.length - 1; k++) {
      if (compact[k].v === compact[k + 1].v) {
        compact[k] = { v: compact[k].v * 2, merged: true };
        compact.splice(k + 1, 1);
      }
    }
    while (compact.length < SIZE) compact.push(null);
    if (rev) compact.reverse();
    // 写回
    for (let j = 0; j < SIZE; j++) {
      grid[rows ? i : j][rows ? j : i] = compact[j];
    }
  }
}

移动端手势识别只需监听 touchstart / touchend，比较位移差值判断方向：

board.addEventListener('touchend', function (e) {
  const t = e.changedTouches[0];
  const dx = t.clientX - tx, dy = t.clientY - ty;
  if (Math.abs(dx) > Math.abs(dy)) {
    move(dx > 0 ? 'right' : 'left');
  } else {
    move(dy > 0 ? 'down' : 'up');
  }
});

最终产物是一个约 11KB 的 index.html，无任何外部依赖。

二、配置 HuaweiCloud DevKit

为了让 Agent 能安全调用华为云能力，先安装 HuaweiCloud DevKit（一行命令搞定）：

npx --yes huaweicloud-devkit install --target codearts

安装后配置统一凭证（AK/SK），DevKit 会自动同步到 KooCLI 和 OBS：

npx --yes huaweicloud-devkit auth init

小贴士：中国大陆用户可先切换 npm 镜像加速：npm config set registry https://mirrors.huaweicloud.com/repository/npm/

安装完成运行自检，确认全绿：

npx --yes huaweicloud-devkit doctor --target codearts

三、部署到 OBS 静态托管

OBS（对象存储服务）不仅能存文件，还支持静态网站托管——把 HTML 扔上去就能公网访问，自带 HTTPS，无需服务器。

1. 创建桶并上传

用 KooCLI（hcloud）三步完成：

# 创建桶（名称全局唯一，建议加时间戳）
hcloud OBS mb obs://game2048-1792574180 -location=cn-north-4

# 上传 index.html
hcloud OBS cp index.html obs://game2048-1792574180/index.html -f

# 设置公开读权限（桶 + 对象两层都要设）
hcloud OBS chattri obs://game2048-1792574180 -acl=public-read
hcloud OBS chattri obs://game2048-1792574180/index.html -acl=public-read

2. 配置静态网站托管

KooCLI 暂不支持 SetBucketWebsite API，用 DevKit 提供的 MCP 工具一键配置：

huaweicloud_obs_set_website_config
  action: set
  bucket: game2048-1792574180
  region: cn-north-4
  indexDocument: index.html

3. 验证访问

curl -sI https://game2048-1792574180.obs.cn-north-4.myhuaweicloud.com/index.html

返回 HTTP/1.1 200 OK 即部署成功！用手机浏览器打开链接，2048 游戏立即可玩。

四、方案对比：为什么选 OBS？

对于纯前端项目（游戏、落地页、文档站），OBS 静态托管是最优解：HTTPS 自带、CDN 可叠加、按存储量计费（11KB 的游戏每月费用约 0.01 元）。

五、总结

整个流程回顾：

1. CodeArts Agent 生成 2048 单文件 HTML（11KB，零依赖）
2. HuaweiCloud DevKit 安装配置（一条命令）
3. OBS 静态托管 部署上公网（创建桶 + 上传 + 设 ACL）
4. curl 验证 200 OK，手机即可试玩

这条路径的核心优势是把 AI 编码能力和云原生托管结合：Agent 负责生成代码，OBS 负责全球分发，开发者只需描述需求。无需懂 Kubernetes，无需配 nginx，无需买服务器——这就是云原生时代的"个人开发者极简上线流"。

体验地址（手机可直接打开）：https://game2048-1792574180.obs.cn-north-4.myhuaweicloud.com/index.html

如果你也想试试，只需对 CodeArts Agent 说"帮我做一个 2048 小游戏并部署到华为云"，剩下的交给 AI 和 OBS。

标签建议：上云必读、代码智能体、应用开发、JavaScript、云计算