周末闲着没事,我用 AI 写出了 12 款微信小游戏和一个云托管后端
周末闲着没事我用 AI 写出了 12 款微信小游戏和一个云托管后端一篇可以照着做的保姆级教程AI 辅助开发微信小游戏/小程序的完整工作流 微信云托管后端从零部署到上线。一、先晒成果周末闲着没事我开启了这个 AI 副业实验。断断续续折腾了一阵子如今我手上有这样一份资产清单产品形态规模状态百鸟森林微信小游戏12 款玩法合集、约 2.5 万行 JS、30 只收集鸟、24 个音效已发布躺平旅行指北微信小程序8 个页面 6 个组件、地图聚合渲染、61 维城市对比已发布云托管后端Spring Boot 服务1 个环境同时服务上面 2 个端、7 张 MySQL 表、30 个 API按量计费重点不是我做了多少而是——我没有亲手写过一行代码包括音频、图片、设计。这些全部是 AI 辅助开发的产物。这篇文章把整个过程拆成两篇保姆教程上篇怎么用 AI 高效开发微信小游戏/小程序工作流 真实案例下篇怎么用微信云托管把后端跑起来从开通到上线每一步都有配置二、为什么选小游戏 AI这条路选副业赛道时我看过很多方向小游戏是我认为个人开发者性价比最高的一条零边际成本一次开发微信内直达 10 亿用户不用做 App 也不用管应用商店审核生态完整微信提供流量入口小游戏中心、分享、排行榜、广告组件激励视频/插屏和内购变现闭环是现成的AI 提效最狠小游戏的技术栈Canvas 2D JavaScript恰好是 AI 最擅长的领域——逻辑清晰、可单文件验证、无复杂依赖矩阵化打法可行一个后端可以同时服务 N 个小游戏做一款新玩法的边际成本极低。我的策略是一个合集打天下不做单一玩法而是做一个小游戏盒子主推 1~2 款核心玩法其余玩法都塞进合集里。用户对某一个玩法腻了还有 11 个入口留住他。三、上篇AI 辅助开发工作流保姆教程3.1 工具准备工具用途微信开发者工具必装小游戏唯一的调试/预览/上传环境一个 AI 编码助手CodeBuddy / Trae / Claude Code 均可核心生产力写代码、改 bug、做架构AI 文生图工具生成鸟图、图标、背景等美术素材Git 仓库Gitee/GitHub版本管理后面云托管部署也靠它3.2 从官方 quickstart 模板起步别让 AI 凭空造轮子新手最容易犯的错误是一上来就让 AI帮我写一个消除游戏。正确的姿势是第一步在微信开发者工具里新建项目选择官方小游戏快速启动模板 第二步删掉模板里的飞机大战代码保留 game.js / game.json / project.config.json 骨架 第三步让 AI 在这个骨架上做增量开发为什么因为官方模板已经帮你解决了微信小游戏和浏览器 Canvas 的差异这个最大的坑——wx.createCanvas()和document.createElement(canvas)不是一回事wx.getSystemInfoSync()拿到的屏幕信息和浏览器也不同。让 AI 基于模板写它产出的代码天然就是微信味的。我所有项目都是从同一个 quickstart 模板起步的这保证了技术路线统一。3.3 先搭场景管理器给 AI 一副骨架12 款玩法塞进一个小游戏如果每个玩法各自为政代码很快会变成屎山。我的解法是先让 AI 写一个SceneManager场景管理器所有玩法实现统一接口// 每个场景类都必须实现这 6 个方法classBaseScene{init(options){}// 进入场景时初始化start(){}// 场景开始update(dt){}// 每帧逻辑render(ctx){}// 每帧渲染onTouchStart(e){}// 触摸事件destroy(){}// 退出清理}然后统一注册sceneManager.register(menu,MainMenuScene);sceneManager.register(game,GameScene);// 消消鸟sceneManager.register(whack,WhackBirdScene);// 打地鸟sceneManager.register(bird2048,Bird2048Scene);// 合鸟2048// ...共 21 个场景这套骨架对 AI 协作的加成巨大每次新增一个玩法AI 只需要专注写一个 Scene 类不用担心它把主循环、触摸路由、资源加载搞坏。我新增第 12 款玩法弹弹球时AI 一次产出了 800 行场景代码 38KB 的物理系统即插即用。3.4 文档先行先写设计方案再写代码这是我用血泪换来的最重要经验。早期我直接对 AI 说帮我加个打砖块游戏结果第一版出来的东西完全不是我想要的来回返工三次。后来我改成方案先行动手前先让 AI 输出一份设计文档我的第 12 款玩法就先写了 13KB 的《弹球消消乐-MVP 设计方案.md》文档里必须包含玩法规则拆解数值、边界条件、失败/胜利判定优先级标注P0首版必须有/ P1二期/ P2锦上添花权衡分析每个技术选型为什么这么选我确认方案之后才让 AI 写代码。方案讨论阶段明确要求只给方案不改代码——这一句话能帮你省掉一半的返工。3.5 用 AI 生成素材30 只沙雕鸟是怎么来的我不会画画。百鸟森林的 30 只鸟全部由 AI 文生图生成方法是先定风格锚点写死一段 prompt 前缀如60×60 Q版沙雕鸟、粗轮廓线、圆滚滚、呆萌表情、纯色背景保证 30 张图风格统一批量生成 人工挑选每只鸟生成 3~4 张候选挑最搞笑的迭代修图对不满意的图用图生图 局部修改继续调比如把表情改得更丧一点。文案更是 AI 的强项。每只鸟有一整套人设数据——职位、性格、宣言、宿敌、搞笑冷知识比如咕咕鸟的冷知识是脑容量只够记住一件事还经常忘。这种带梗的文案 AI 一天能出 100 条我负责挑。一个重要工程兜底所有素材加载失败时回退到 emoji 绘制绝不报错。素材没到位之前游戏照样能玩开发不被美术阻塞。3.6 真实案例AI 是怎么解决硬核问题的案例 1三层卡牌的像素级遮挡检测消消鸟的核心玩法是 6×6 网格、3 层错位堆叠的卡牌只有没被上层挡住的卡才能点。怎么判定被挡住我把需求描述给 AI“两张卡的重叠面积超过卡片自身面积的 20% 才算遮挡避免微小边缘接触导致大面积不可点。”AI 给出的实现简洁又准确_isOverlapEnough(rectA,rectB){constoverlapWMath.min(rectA.xrectA.w,rectB.xrectB.w)-Math.max(rectA.x,rectB.x);constoverlapHMath.min(rectA.yrectA.h,rectB.yrectB.h)-Math.max(rectA.y,rectB.y);if(overlapW0||overlapH0)returnfalse;constoverlapAreaoverlapW*overlapH;returnoverlapArea/(rectA.w*rectA.h)0.2;// 重叠≥20%才算遮挡}再加一条自顶向下的扫描从最上层往下找到第一张有卡的层检查它是否被更上层遮挡。关键参数是层间偏移量取卡片尺寸的 25%保证相邻层遮挡 ≥56%跨两层也 ≥25%——这些边界值都是 AI 推导出来并写进注释的。案例 2关卡无死局校验防止玩家卡关消除游戏最怕出物理不可达的关卡目标要求合成 10 只鸟但卡片总数最多只够合 7 只——玩家怎么玩都过不去直接流失。我让 AI 设计了一套组合拳validateAndWarn(levelConfig){consttotalCardscardDistribution.reduce((sum,n)sumn,0);constmaxBirdsMath.floor(totalCards/3);// 物理上限3张卡合1只鸟constminScoremaxBirds*10;// 零连击最低分if(levelConfig.targetBirdsmaxBirds){console.warn(目标${targetBirds}只鸟但最多只能合${maxBirds}只——物理不可达);}if(levelConfig.targetScoreminScore){console.warn(目标分数过高建议降至 ≤${minScore});}}配套还有三道保险保证合成池发牌时每 3 张一组轮询分配确保卡池一定能凑出目标数量的三联BFS 求解器解谜类关卡推鸟出巢、水排序全部在服务端跑 BFS 验证可解才下发从已解状态反向打乱旋转类谜题先摆好全部朝上的完成态再随机打乱天然可解。案例 3低端机性能优化低端安卓机跑不动 60fps 是小游戏差评的重灾区。AI 帮我做了这几件事优化做法效果脏渲染每帧先算网格哈希数据没变直接跳过重绘静止时 CPU 几乎为 0离屏 Canvas 缓存背景层棋盘、槽位、装饰画一次存离屏画布之后每帧只drawImage每帧省几十次绘制调用脏矩形增量重绘弹弹球 1000 方块只重绘被击中的那几个方块所在矩形最低端机也不掉帧分级帧率检测内存/像素比低端机 30fps、闲置时降到 15fps省电不发烫分批加载图片每批 8 张、间隔 50ms解决真机并发请求丢失注意离屏 Canvas 有个非常隐蔽的坑AI 在注释里标出来了离屏画布是物理像素尺寸往主画布画的时候必须显式指定逻辑尺寸否则整张图会被放大 dpr 倍变得模糊。3.7 和 AI 协作的纪律血泪经验断断续续做下来我总结出几条必须守住的纪律方案阶段不改代码写码阶段不重构方案——两个阶段混着来必返工每次提交前自己过一遍代码——AI 会自信地写出看起来对但有边界 bug 的代码比如触摸事件穿透、异步竞态你要做那个最后把关的人要求零 lint 错误——一个连 lint 都不过的代码库AI 后续生成的代码质量会雪崩式劣化修完 bug 立即 commit push——AI 改坏了还能回滚命名规范提前定死——我用AAB 式中文命名消消鸟、打地鸟、合鸟2048口语化且见名知意AI 会遵循你给的示例大功能拆小步——一次让 AI 做 300 行以内的增量比一次让它写 3000 行靠谱得多。四、下篇微信云托管保姆教程游戏做出来了排行榜、云存档、每日运势、远程关卡下发都需要后端。个人开发者摆着三条路方案优点缺点自建服务器自由要买域名、备案、HTTPS 证书、运维个人劝退云函数/云开发免运维冷启动慢、Node 生态受限、复杂业务难组织微信云托管CloudBase Run免域名免备案、容器化、缩容到 0 按量计费、小程序调用免鉴权需要会写 DockerfileAI 会我选的云托管。下面是完整步骤每一步的配置都可以直接抄。第一步开通云托管打开 微信云托管控制台用你的小程序/小游戏账号登录点击新建环境环境名随意比如prod地域选离用户近的广州/上海开通后会得到一个环境 ID形如prod-xxxxxx记下来端上要用。提示云托管和微信云开发是两个产品。云托管是跑你自己的容器云开发是Serverless 函数。小游戏这种有复杂业务逻辑的云托管更合适。第二步准备 Spring Boot 工程不用从零搭直接用微信官方的 springboot 模板控制台新建服务时可以选模板或者手撸一个最小工程。我的技术选型Spring Boot 2.5.5 JDK 8稳妥AI 训练语料最多MyBatis MySQL一个标准三层结构controller → service → dao给 AI 一句话就能生成骨架“帮我生成一个 Spring Boot 工程包含一个 /api/health 接口返回 {status:‘ok’}JDK 8打包成可执行 jar。”第三步写 Dockerfile多阶段构建这是云托管部署的核心。多阶段构建能让最终镜像不带 Maven 和 JDK 编译器体积小、构建快# 阶段一编译 FROM maven:3.6.0-jdk-8-slim as build WORKDIR /app COPY src /app/src COPY settings.xml pom.xml /app/ # settings.xml 换成腾讯云 Maven 镜像国内构建速度起飞 RUN mvn -s /app/settings.xml -f /app/pom.xml clean package # 阶段二运行alpine 极小镜像 FROM alpine:3.13 RUN sed -i s/dl-cdn.alpinelinux.org/mirrors.tencent.com/g /etc/apk/repositories \ apk add --update --no-cache openjdk8-jre-base \ rm -f /var/cache/apk/* RUN apk add ca-certificates # 微信云调用需要的证书 WORKDIR /app COPY --frombuild /app/target/*.jar . EXPOSE 80 # 云托管默认监听 80 CMD [java, -jar, /app/springboot-wxcloudrun-1.0.jar]三个细节别漏EXPOSE 80云托管默认把容器的 80 端口映射到公网Spring Boot 要配server.port80换国内源alpine 的 apk 和 maven 的依赖都换成腾讯云镜像构建时间从十几分钟降到两三分钟装 ca-certificates不装的话调用微信 API 会 SSL 报错这个坑非常隐蔽。第四步container.config.json在工程根目录放一个container.config.json控制台模板部署时会读取它初始化服务配置{containerPort:80,minNum:0,maxNum:5,cpu:1,mem:2,policyType:cpu,policyThreshold:50,envParams:{},customLogs:stdout}minNum: 0是个人开发者的救命配置没有流量时容器缩容到零一分钱不花来请求时秒级拉起。配合 CPU 超 50% 自动扩容到最多 5 个副本突发流量也扛得住。第五步绑定代码库获得自动 CI/CD云托管控制台支持直接绑定 Git 仓库我用的 Gitee控制台 → 服务设置 → 代码库托管 → 绑定你的仓库和分支之后每次git push云托管自动执行拉代码 → 按 Dockerfile 构建镜像 → 滚动更新部署构建日志和控制台实时日志都能直接看不用再碰任何 CI 工具。也就是说我的整个运维动作就是git push。没有 Jenkins没有 GitHub Actions没有服务器 SSH。第六步开数据库云托管控制台可以直接开 MySQL我用的 TDSQL-C。三个建议和安全组同一 VPC内网连接零延迟连接信息用环境变量注入别写死在配置文件里spring:datasource:url:jdbc:mysql://${MYSQL_ADDRESS:localhost}:3306/${MYSQL_DATABASE:travel_guide}username:${MYSQL_USERNAME:root}password:${MYSQL_PASSWORD:}在application.yml里全部用${ENV_VAR:默认值}的写法本地跑默认值、线上读环境变量——密码永远不进 Git 仓库我早期把 dev 配置连密码提交了后来全部改成环境变量并轮换了密码别学我。第七步小游戏端调用免域名、免 HTTPS这是云托管最爽的地方小程序/小游戏调用云托管不需要配置任何域名白名单不需要 HTTPS 证书。端上代码// 小游戏端初始化app.js 或 main.js 里做一次constcloudnewwx.cloud.Cloud({resourceAppid:wxxxxxxxxxxxx,// 云托管环境归属的小程序 appidresourceEnv:prod-xxxxxxx// 环境 ID});cloud.init();// 调用后端constresawaitcloud.callContainer({path:/api/bird/home,method:GET,header:{X-WX-CORE:highway}});第八步零代码鉴权这是云托管的杀手锏传统方案里登录态是重灾区code2Session 换 openid、自建 session 表、token 过期刷新……在云托管里网关自动把用户身份注入请求头后端一行代码拿到 openidpublicstaticStringgetOpenId(HttpServletRequestrequest){Stringopenidrequest.getHeader(X-WX-OPENID);// 云托管网关自动注入if(openidnull||openid.isEmpty()){openidrequest.getHeader(X-WX-FROM-OPENID);// 跨环境调用资源复用时用这个}returnopenid;}没有解密、没有 session、没有 token。你只需要判断 openid 是否为空为空说明不是从微信内调进来的拒绝即可。第九步COS 对象存储同样免鉴权图片素材比如拼图成就图建议放腾讯云 COS。云托管提供了一个内部免鉴权 API换取临时密钥不需要自己管理 SecretKeyPOST http://api.weixin.qq.com/_/cos/getauth # 换取临时密钥带缓存 POST http://api.weixin.qq.com/_/cos/metaid/encode # 生成小程序可访问的 metaid工程实践上记住一条数据库只存 object key读取时统一走签名 URL出口。我封装了一个generateSignedUrl()作为 key→URL 的唯一出口签名有效期取临时密钥剩余寿命和 24 小时的较小值列表页只签第一张图省性能。第十步资源复用——一个后端服务多个小程序/小游戏这是我个人开发者矩阵打法的核心。我的 Spring Boot 后端同时服务旅行小程序和百鸟森林小游戏在云托管控制台把小游戏 的 appid 加入资源复用授权小游戏端new wx.cloud.Cloud({ resourceAppid: 小程序appid, resourceEnv: 环境 })就能直接调小程序的云托管环境后端用users.type字段区分用户来源travel/bird小游戏业务单独放bird/子包和主业务物理隔离数据库、COS、榜单定时任务全部共用成本直接砍半。第十一步远程配置——改数值不发版关卡、题库、出鸟概率、商店价格全部存进数据库的kv_store表小游戏启动时聚合拉取本地只留 5 关兜底。效果运营调数值比如把出鸟概率从 10% 调到 12%不需要重新提审小游戏云端挂了也不影响游戏运行自动降级用本地配置甚至可以做灰度按用户组下发不同配置。成本账单以我目前的量级日活几百、API 日调用几万次项目月成本云托管缩容到 0 按量≈ 一杯奶茶MySQL 基础版≈ 两杯奶茶COS 存储 流量≈ 一杯奶茶合计≈ 100 元以内等广告和内购收入覆盖这个成本剩下就是净赚。五、踩过的坑帮你省时间触摸事件穿透弹窗层没拦截 touchstart点弹窗把下面的卡牌点了——所有弹窗必须吞掉事件真机图片并发加载丢失一次并发加载几十张图低端安卓机随机丢请求——分批加载每批 8 张、间隔 50ms解决ctx.filter真机不支持灰度图只能getImageData逐像素算记得只算一次并缓存结果音频自动播放限制微信要求首次用户交互后才能播音BGM 必须在第一次触摸后再启动BGM 文件太大背景音乐压到 100KB 以内或干脆用音效代替个人主体的合规红线个人小游戏号不能开 UGC 和虚拟支付我做了一个FEATURES.COMMENT开关常量注释写明主体资质满足后改 true 即可恢复——功能先埋好合规留后门提审被拒的最大原因是内容不完整/功能过于简单首发务必保证玩法闭环完整别拿半成品提审所有云端调用都要有本地降级网络差的用户打开游戏不能卡在加载页——云端失败一律console.warn后走本地配置游戏照玩。六、变现路径与复盘微信小游戏个人开发者的主流变现组合激励视频广告主力复活、领双倍奖励、抽奖加速等场景插入eCPM 与留存正相关插屏/横幅广告场景切换时插屏注意别伤害留存虚拟支付需主体资质内购道具、皮肤、通行证矩阵互推我的 3 个产品互相导量一个小游戏的流失用户可能成为另一个的用户。我的复盘结论合集 单品12 款玩法互相导流留存显著高于单品AI 把开发成本打没了剩下的是设计成本玩法是否好玩、数值是否平衡、文案是否有梗这些才是真正的壁垒副业的复利在资产每一次开发沉淀下来的场景框架、云托管后端、素材管线都是下一个产品的加速器。第二款产品的开发周期只有第一款的三分之一。七、写在最后几个月前我连wx.createCanvas是什么都不知道今天我的小游戏在微信里被真实玩家玩着后端日志里每天滚动着他们的排行榜成绩。AI 没有让做产品变简单——它让会提问题、会做判断、会把控质量的人可以一个人干成一个小团队的活。技术不再是门槛品味和执行力才是。如果你也想开始我的建议只有一句话从官方模板起步先让 AI 帮你搭场景管理器然后一个玩法一个玩法往上加后端直接上云托管缩容到零——这条路我已经替你踩过坑了。下面是我开发的小游戏和小程序欢迎体验。

相关新闻

最新新闻

日新闻

周新闻

月新闻