第50课 · 用 AI 制作微信小程序

前面我们用 AI 做过网站、做过工具、做过数据驾驶舱。这节课来一个更有成就感的——做一个微信小程序。

你可能觉得小程序是程序员才能碰的东西。但实际上，做小程序和做网站的流程几乎一模一样：跟 AI 说需求 → AI 写代码 → 调试 → 上线。唯一的区别是，小程序用微信专属的语言编写，而 AI 完全能搞定。

区别主要在发布环节——小程序住在微信这个「商场」里，得走商场管理方的流程：注册账号、配置域名、提交审核、发布。这些流程看起来繁琐，但搞清楚逻辑后，跟着走就行。

本节要点

小程序和网站的区别：本质一样，只是换了微信生态的语言和发布流程
整体流程：跟 AI 说想法 → AI 写代码 → 开发者工具里调试 → 注册账号 → 配域名 → 提交审核 → 发布
注册小程序账号：个人主体怎么选、类目怎么选、AppID 是什么
ICP 备案与域名：小程序对域名的硬性要求，以及备案的底层逻辑
小程序备案（2023 年新规）：小程序本身也要备案，和域名备案是两码事
审核与发布：代码怎么提交、审核要等多久、发布后别人怎么搜到你
微信认证：花 30 块解锁搜索和分享，让别人能用上你的小程序

1. 小程序到底是什么？

先用人话把概念讲清楚，不然后面的操作全是懵的。

1.1 小程序 vs 网站 vs App

	网站	微信小程序	手机 App
在哪打开	浏览器	微信里	手机桌面
要下载吗	不用	不用，微信里搜一下	要下载安装
开发难度	中等	中等（和网站差不多）	高
审核流程	域名备案就行	微信团队审核	苹果/安卓商店审核

你看，小程序的体验接近 App，但开发难度和网站差不多。它就像一个住在微信里的小型 App——不用下载，微信里搜一下就能用。

打个比方：做网站像在街边开店，城管管一管就行；做小程序像入驻一个商场（微信），得经过商场管理方的审核。门槛高了一点点，但商场帮你带来了人流。

1.2 做小程序和做网站的流程对比

步骤	做网站	做小程序
想法	✅	✅
跟 AI 说需求	✅	✅
AI 写代码	HTML/CSS/JS	WXML/WXSS/JS（微信专属语言）
本地预览	浏览器打开	微信开发者工具编译
调试	看报错 → 问 AI	看报错 → 问 AI
注册	域名	小程序账号 + AppID
上线	部署到服务器	提交审核 → 发布

开发部分几乎一样——都是跟 AI 说需求、看报错、让 AI 修。区别全在注册和发布环节。

2. 整体流程：六步走

做一个小程序，从头到尾就六步：

① 跟 AI 说想法，AI 写代码
       ↓
② 安装微信开发者工具，导入代码编译预览
       ↓
③ 注册小程序账号，拿到 AppID
       ↓
④ 配置域名（ICP 备案是关键）
       ↓
⑤ 小程序备案（2023 年起必须做）
       ↓
⑥ 上传代码 → 提交审核 → 发布上线

前两步和做网站完全一样，你已经有经验了。这节课的重点是后四步——注册、域名、备案、发布。

3. 第一步：跟 AI 说想法

新建一个空文件夹，在里面打开 OpenCode，直接用大白话说需求。

比如你想做一个审计法规查询小程序：

我想做一个微信小程序，功能是搜索审计法规。用户输入关键词，展示匹配的法规条文。要不要登录？你觉得怎么做合适，帮我推荐一下技术方案。

或者像我们这节课做的——把已有的网站改成小程序：

我有一个陈版主答疑的网站（bbs.auditdog.cn），想做成微信小程序，可以吗？

3.1 AI 会问你几个问题

不用紧张，都是选择题：

① 功能范围：要不要登录？

选择	说明
纯查询，不要登录（推荐入门）	打开就能用，简单快速
要登录系统	支持收藏、评论、个人中心，复杂得多

第一次做小程序，选「纯查询」就够了。

② 技术栈用什么？

不懂的话直接说「你推荐」。AI 会选最合适的框架和组件库。你不用记这些名字，AI 自己会处理。

③ 单独建项目文件夹吗？

选「是」。小程序是一个独立项目，单独放一个文件夹。

3.2 AI 会做什么

回答完问题，AI 会：

查阅微信小程序的最新开发文档
规划页面结构（首页、搜索结果页、详情页等）
写代码——包括页面布局、数据请求、交互逻辑
本地编译验证，修复报错

整个过程几分钟到十几分钟，你等着就行。

4. 第二步：安装微信开发者工具

微信开发者工具是小程序的「编辑器 + 浏览器」——你在里面编译代码、预览效果、查看报错。

4.1 下载

打开微信官方下载页：

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

选你的系统（Mac / Windows），下载稳定版，安装。

4.2 导入项目

打开开发者工具，点 「导入项目」
目录选 AI 创建的项目文件夹
AppID 先选 「测试号」（正式账号还没注册，下一节讲）
点确定

4.3 编译预览

导入后点顶部的 「编译」 按钮，就能在左边的模拟器里看到小程序的样子了。

4.4 开发阶段勾一个选项

开发时你的域名可能还没配好，编译会报域名错误。先绕过它：

右上角「详情」→「本地设置」→ 勾选「不校验合法域名、TLS 版本以及 HTTPS 证书」

这是开发阶段的临时措施，等域名配好后取消勾选（后面域名验证那节会讲）。

5. 编译报错了？正常，复制给 AI 就行

AI 第一次生成的代码，编译时经常会报错。这太正常了——小程序用微信专属语言写的，有些语法和网页不一样，AI 偶尔会写错。

怎么修

最简单有效的方法：把 Console 控制台里的报错信息复制下来，粘贴给 AI。

看开发者工具底部的 Console（控制台） 面板
找到红色的错误信息
复制 → 粘贴给 AI → AI 帮你修

编译报错了，错误信息是：
Component is not found: xxx
帮我看看怎么回事

AI 会分析原因，告诉你怎么改，或者直接帮你改好。改完重新编译，直到没有报错为止。

不用理解报错的意思

你不需要看懂报错信息在说什么。遇到报错 → 复制给 AI → AI 修 → 重新编译，这个循环就够了。代码是 AI 写的，它当然也负责修。

进阶：让 AI 直接操控开发者工具（MCP）

每次复制报错给 AI 也挺烦的。有个进阶玩法：装一个 MCP 工具，让 AI 直接控制微信开发者工具——自动编译、自动读取报错日志、自动截图预览，全程不用你手动复制粘贴。

什么是 MCP？

MCP（Model Context Protocol）是一个开放协议，让 AI 工具能直接调用外部服务。你可以理解为：给 AI 装一个「插件」，让它能直接操作微信开发者工具。

OpenCode、Claude Code、Cursor 等主流 AI 编程工具都支持 MCP。

第一步：开启开发者工具的服务端口

在开发者工具里：设置 → 安全设置 → 服务端口 → 开启

不开的话后面所有操作都会报 CLI_TIMEOUT 错误。

第二步：安装 MCP 工具

需要先装好 uv（Python 包管理器，第 7 课讲过怎么装），然后执行：

bash

uv tool install wechat-devtools-mcp

安装完成后，MCP 工具就在 ~/.local/bin/wechat-devtools-mcp 了。

第三步：在 OpenCode 中配置 MCP

打开 OpenCode 的配置文件（~/.config/opencode/opencode.json），在 mcp 里加一条：

json

{
  "mcp": {
    "wechat-devtools": {
      "type": "local",
      "command": ["~/.local/bin/wechat-devtools-mcp"],
      "enabled": true,
      "environment": {
        "WECHAT_DEVTOOLS_CLI": "/Applications/wechatwebdevtools.app/Contents/MacOS/cli",
        "WECHAT_PROJECT_PATH": "你的小程序项目路径"
      }
    }
  }
}

Windows 用户把 WECHAT_DEVTOOLS_CLI 改成开发者工具安装目录下的 cli.bat 路径，WECHAT_PROJECT_PATH 改成你的实际项目路径。

如果你用的是 Claude Code，在项目根目录创建 .mcp.json，格式类似。

配好后 AI 能做什么：

自动编译代码，直接拿到编译结果和报错信息
自动截图，看小程序运行效果
读取项目文件、获取页面数据
自动化点击操作和界面交互测试
采集控制台日志和运行时异常

相当于给 AI 配了一双手，它能自己操作开发者工具了。

项目地址

这个 MCP 工具是开源社区项目：wechat-devtools-mcp，基于微信官方的 CLI 接口封装，非官方维护。

6. 第三步：注册小程序账号

调试到满意了，下一步是注册正式的小程序账号。这就像给小程序上「户口」。

6.1 注册地址

打开微信公众平台首页，点右上角 「立即注册」，选择 「小程序」：

https://mp.weixin.qq.com

6.2 注册步骤

步骤	要做什么
① 选主体类型	个人开发选「个人」（企业选项需要营业执照）
② 填邮箱	用一个没注册过微信公众平台的邮箱
③ 邮箱验证	去邮箱点确认链接
④ 身份验证	填姓名、身份证号，用绑了银行卡的微信扫码
⑤ 小程序信息	填名称、简称，选类目

6.3 类目怎么选

个人主体的类目有限，不能选「金融」「医疗」「社交」等敏感类目。对于查询类工具，选：

工具 → 信息查询

这是最通用的个人小程序类目。

6.4 拿到 AppID

注册成功后，登录微信公众平台，在 「开发管理 → 开发设置」 里能看到你的 AppID：

wxf331ae891e28de01（示例，你的会不同）

AppID 是小程序的唯一标识。拿到后：

告诉 AI 你的 AppID，让它帮你设置到项目配置里
在开发者工具里，把原来的「测试号」换成正式 AppID

AppID 是什么？

AppID 就是小程序的「身份证号」。微信用它来识别你的小程序，管理你的开发权限、发布权限。每个小程序只有一个。

7. 第四步：域名与 ICP 备案

这是整个流程里最容易卡住的一步，也是知识点最多的一步。慢慢讲。

7.1 小程序对域名的两个硬性要求

你的小程序要访问服务器（比如查询数据），服务器域名必须满足：

要求	说明
HTTPS	必须 `https://`，不能 `http://`
ICP 备案	域名必须在国内完成备案

HTTPS 好办——部署到 Cloudflare 或有 SSL 证书就行。ICP 备案才是关键。

7.2 什么是 ICP 备案

ICP 备案是工信部的规定：服务器在中国大陆的域名，必须备案才能对外提供服务。备案就是向工信部报备「这个域名归谁管、做什么用」。

小程序后台配置域名时，微信会检查备案状态——没备案的域名加不进去。

7.3 哪些域名能备案、哪些不能

域名服务器位置	能备案吗	小程序能用吗
中国大陆（阿里云、腾讯云等）	✅ 能	✅ 备案后能用
香港 / 海外	❌ 不能	❌ 不能用

所以如果你的服务器在海外（比如 Cloudflare、香港 VPS），域名没法备案，小程序默认加不上。

7.4 怎么备案

备案本身免费，但需要一台国内服务器：

在腾讯云或阿里云买一个域名（几十块/年）
买一台国内云服务器（最便宜的几块/月）
通过云厂商的备案系统提交备案（提供身份证、域名信息等）
等审核（一般 1-2 周）
审核通过后，域名就能用了

已有备案域名可以「蹭」子域名

如果你之前做博客或课程站时已经备案过域名（比如 auditdog.cn），那你的子域名（如 bbs.auditdog.cn）即使指向海外服务器，在小程序后台通常也能配置成功。

这不是官方明文规定

「子域名蹭主域名备案」是实操中验证可行的经验做法，微信官方文档没有明确写这个规则。大部分情况下没问题，但如果你的项目比较正式，建议还是走正规备案流程。

:::

7.5 配置合法域名

域名备案好了（或已有备案的主域名），去微信公众平台配置：

开发管理 → 开发设置 → 服务器域名 → 修改 → request 合法域名

填入你的域名（带 https://）：

https://bbs.auditdog.cn

保存。已备案的域名会直接通过。

7.6 关闭测试选项，验证域名

域名配好后，在开发者工具里做最后一步验证：

详情 → 本地设置 → 取消勾选「不校验合法域名」

取消后重新编译——如果功能正常，说明域名配置生效了。如果报错，回上面检查域名是否已备案、是否填对。

8. 第五步：小程序备案（2023 年新规）

这一步容易漏！

从 2023 年 9 月起，工信部要求所有小程序必须完成小程序备案。没有备案的小程序无法上架发布。很多人卡在这里——代码写好了、域名配好了，结果发现还要备案，白等好几天。

8.1 小程序备案 ≠ 域名备案

别搞混了，这是两个东西：

	域名 ICP 备案	小程序备案
备什么	你的域名	你的小程序本身
在哪办	云厂商（腾讯云/阿里云）	微信公众平台后台
法律依据	《互联网信息服务管理办法》	《反电信网络诈骗法》第 23 条
必须吗	域名要用就得备	2023 年 9 月起必须

简单说：域名备案管的是「你的服务器地址」，小程序备案管的是「你这个小程序是干什么的、谁做的」。两个都要。

8.2 怎么备案

备案入口在微信公众平台后台：

设置 → 小程序备案 → 填写备案信息

流程分四步：

填备案信息：小程序名称、服务类目、备案负责人信息
平台初审：微信团队审核，一般 1-2 个工作日
工信部短信核验：初审通过后，工信部（12381 号码）发短信验证码，24 小时内必须填回验证
通管局审核：最终由你所在省的通信管理局审核，1-20 个工作日不等

个人主体备案需要：身份证正反面拍照 + 人脸核验（对着手机眨眨眼扭扭头就行）。

个人名义完全可以备案！

很多人以为小程序备案只能企业申请，其实个人一样能过。我（狗哥）就是用个人名义备案成功的。

有个小技巧：提交备案申请时，备注写清楚是「个人使用的工具」，说明用途是自用的查询工具，审核更容易通过。

下面是我自己备案成功的小程序二维码，个人主体、纯查询类，一次过 👇

个人名义备案成功的小程序

8.3 什么时候开始备案

尽早开始，别等代码写完。 备案和代码开发可以同步进行——注册账号拿到 AppID 后就能去备案，趁等审核的时间继续写代码调试。等域名配好、代码调好，备案也差不多下来了。

短信核验容易漏

工信部短信发送号是 12381，容易被手机当垃圾短信拦截。提交备案后注意留意短信，别漏了 24 小时的验证窗口。

9. 第六步：上传 → 审核 → 发布

域名和 AppID 都配好了，备案也在走了，代码也能正常运行了，最后就是发布上线。

9.1 上传代码

在开发者工具里：

点顶部工具栏的 「上传」 按钮
填写版本号（比如 1.0.0）和备注
等待上传完成

代码上传后，会出现在公众平台的 「管理 → 版本管理」 里，状态是「开发版本」。

9.2 提交审核

在微信公众平台：

管理 → 版本管理 → 找到刚上传的版本
点 「提交审核」
填版本描述（简单说明小程序是做什么的，不知道怎么写就让 AI 帮你生成）
提交，等微信团队审核

审核要多久？

这里有两道审核，别搞混了：

代码审核（提交发布时）：微信团队检查你的小程序代码和功能，一般几小时到 1-2 天
小程序备案审核（上线前必须完成）：平台初审 1-2 个工作日 + 通管局审核 1-20 个工作日

代码审核很快，备案审核是大头。建议在开发阶段就同步启动备案，别等代码写完了才开始。

9.3 隐私保护指引

提交审核时可能提示你配置隐私保护指引。因为小程序代码里用到的某些组件（比如搜索框），会被微信自动扫描标记。

对于纯查询类小程序，选：

设置 → 用户隐私保护指引 → 选「未采集用户隐私」→ 提交

不影响功能，只是声明这个小程序不收集用户信息。

9.4 发布

审核通过后：

回 版本管理
点 「发布」

你的小程序就正式上线了。

10. 微信认证：让别人也能用

小程序发布后默认只有你自己能搜到。想让别人也能搜到和使用，需要做微信认证。

10.1 认证前后对比

功能	未认证	认证后
自己使用	✅	✅
被别人搜索到	❌	✅
分享给好友	❌	✅

10.2 怎么认证

路径：微信公众平台 → 设置 → 基本设置 → 微信认证
费用：个人主体约 30 元/年
流程：提交身份信息，完成验证

认证后，别人在微信里搜索小程序名称就能找到并使用了。

11. 这套方法还能做什么

这节课教的不是做某一个特定小程序，而是「AI + 小程序」这套通用方法。掌握了，你能做的东西很多：

审计法规查询：把法规库做成小程序，随时随地查
公司内部工具：报销查询、项目看板，同事在微信里直接用
个人作品集：展示项目和能力
客户服务入口：给客户一个查询通道，专业又方便

套路都是同一个：说需求 → AI 写代码 → 注册 → 配域名 → 审核发布。

常见问题

编译报错看不懂怎么办

把 Console 控制台里的红色报错信息复制下来，粘贴给 AI，它帮你分析原因并修复。不用自己看懂报错。

域名必须是 HTTPS 吗

是的。小程序只允许通过 https:// 访问接口。如果服务器没有 HTTPS，可以免费申请证书（参考第 49 课的 Cloudflare 方案）。

域名没备案能用吗

不能。但如果你有一个已备案的主域名，子域名通常也能通过验证（即使子域名指向海外服务器，但这是实操经验，非官方明文规定）。完全没备案域名的话，需要走正规备案流程。

小程序备案和域名备案有什么区别

两个不同的东西，都要办：

域名备案：在云厂商（腾讯云/阿里云）办，备案你的服务器域名
小程序备案：在微信公众平台后台办，备案小程序本身。2023 年 9 月起强制要求，没有备案的小程序无法发布

建议注册完账号、拿到 AppID 后就立刻启动小程序备案，趁审核的时间继续写代码。

工信部备案短信没收到怎么办

工信部短信发送号是 12381，容易被手机拦截。去手机短信拦截记录里找找。如果超过 24 小时确实没收到，回到公众平台备案页面可以申请重新发送。

个人小程序能做支付吗

不能。支付需要企业主体 + 微信支付商户号。个人主体只能做纯查询、展示类的小程序。

审核被拒了怎么办

微信会告诉你拒绝原因（通常是类目不对、功能不完整、描述不清楚等）。把拒绝原因告诉 AI，它帮你调整后重新提交。

上传时提示「未配置隐私保护指引」

去 设置 → 用户隐私保护指引，选「未采集用户隐私」，提交即可。不影响功能。

小结

这节课你了解了做一个小程序的完整流程：

搞懂了小程序：本质和做网站一样，AI 完全能搞定
六步走流程：说想法 → AI 写代码 → 注册账号 → 配域名 → 小程序备案 → 审核发布
注册账号：个人主体，选「工具 → 信息查询」类目
域名备案：小程序对域名的硬性要求，主域名已备案则子域名通常可用
小程序备案：2023 年新规，和域名备案是两码事，尽早启动
审核发布：上传代码 → 提交审核 → 发布 → 微信认证让别人能用

整个过程你不需要是程序员。我（狗哥）也不是——微信开发者工具第一次用，注册备案第一次做。跟着 AI 一步一步操作，一个能用的小程序就做出来了。

不要恐惧。借助 AI，你的任何想法都可以一步步变成产品。

第50课 · 用 AI 制作微信小程序 ​

本节要点 ​

1. 小程序到底是什么？ ​

1.1 小程序 vs 网站 vs App ​

1.2 做小程序和做网站的流程对比 ​

2. 整体流程：六步走 ​

3. 第一步：跟 AI 说想法 ​

3.1 AI 会问你几个问题 ​

3.2 AI 会做什么 ​

4. 第二步：安装微信开发者工具 ​

4.1 下载 ​

4.2 导入项目 ​

4.3 编译预览 ​

4.4 开发阶段勾一个选项 ​

5. 编译报错了？正常，复制给 AI 就行 ​

怎么修 ​

进阶：让 AI 直接操控开发者工具（MCP） ​

6. 第三步：注册小程序账号 ​

6.1 注册地址 ​

6.2 注册步骤 ​

6.3 类目怎么选 ​

6.4 拿到 AppID ​

7. 第四步：域名与 ICP 备案 ​

7.1 小程序对域名的两个硬性要求 ​

7.2 什么是 ICP 备案 ​

7.3 哪些域名能备案、哪些不能 ​

7.4 怎么备案 ​

7.5 配置合法域名 ​

7.6 关闭测试选项，验证域名 ​

8. 第五步：小程序备案（2023 年新规） ​

8.1 小程序备案 ≠ 域名备案 ​

8.2 怎么备案 ​

8.3 什么时候开始备案 ​

9. 第六步：上传 → 审核 → 发布 ​

9.1 上传代码 ​

9.2 提交审核 ​

9.3 隐私保护指引 ​

9.4 发布 ​

10. 微信认证：让别人也能用 ​

10.1 认证前后对比 ​

10.2 怎么认证 ​

11. 这套方法还能做什么 ​

常见问题 ​

编译报错看不懂怎么办 ​

域名必须是 HTTPS 吗 ​

域名没备案能用吗 ​

小程序备案和域名备案有什么区别 ​

工信部备案短信没收到怎么办 ​

个人小程序能做支付吗 ​

审核被拒了怎么办 ​

上传时提示「未配置隐私保护指引」 ​

小结 ​