乐于分享
好东西不私藏

AI智能体 I 扣子编程03:我用coze3分钟开发了一个微信小程序

AI智能体 I 扣子编程03:我用coze3分钟开发了一个微信小程序
大家好,我是AI汉堡侠,一个水运工程行业的持证搬砖佬,也是AI浪潮下的赶潮人,热爱一切关于AI的事物,目前专注于AI智能体提效,只分享有用的,拒绝贩卖焦虑,一起拥抱AI时代

字数:约3300字  

阅读时间:约6分钟


前两篇分别测了网页应用和移动应用,今天继续《扣子编程六大功能拆解》系列的第3篇——小程序开发

小程序和移动应用有啥区别?不都是在手机上跑吗?

今天这篇给你答案。实测开发一个微信小程序,看看从需求到上线要走哪些步骤,和移动应用相比又有哪些坑。


先说结论:小程序和移动应用的核心区别

对比项
小程序
移动应用
运行环境
微信/抖音等超级App内
独立App,手机桌面打开
安装方式
无需安装,扫码即用
需下载APK安装
开发门槛
需注册小程序账号、配置AppID
直接开发,扫码预览
用户触达
依赖平台流量,分享方便
独立分发,需自己推广
功能权限
受平台限制(如录音需授权)
更自由,可调系统能力
审核上线
需平台审核
直接部署,无需审核

一句话总结:小程序适合快速验证想法、借助平台流量;移动应用适合独立品牌、需要深度系统能力的场景。


实测:开发一个「普通话情景对话」小程序

这次不测记账App了,换个有意思的——学普通话的小程序

功能设计:

  • 随机生成3个生活场景主题(买菜、问路、面试等)
  • 模型根据主题生成对话,汉字上方标注拼音
  • 点击气泡可朗读语句
  • 用户可以跟读录音,回放自己的发音

这个需求涉及AI生成、语音合成、录音功能,正好测试小程序的能力边界。


第一步:准备工作(小程序特有)

开发小程序之前,有个前置步骤是移动应用和网页应用都没有的——

注册小程序账号

1. 注册小程序

前往微信公众平台,按官方指引完成注册。详看这篇文档说明,这里重点不是讲怎么注册,大概说一下,具体的微信官方文档在这里:

http://developers.weixin.qq.com/miniprogram/introduction/#小程序注册

2. 获取AppID

注册完成后,在公众平台左侧导航栏找到:管理 > 开发管理 > 开发设置,复制AppID

这个AppID是小程序的唯一标识,后面绑定扣子编程时会用到。

坑点提醒

  • 个人主体和企业主体的权限不同,个人小程序不能上线支付、直播等功能
  • 如果之前注册过公众号,可以用同一邮箱注册小程序,但需要单独认证

第二步:需求澄清

打开扣子编程,选择"小程序"选项卡。

输入需求

提示词如下:

"帮我制作一个小程序,用于学习普通话情景对话

1. 模型随机生成并展示3个不同主题,例如买菜、问路、面试等,用户进入页面时,选择一个主题,模型根据主题生成一段对话数据,并展示给用户

2. 类似聊天气泡的布局展示对话,每个汉字上方标注拼音,点击气泡可以朗读语句,整体有个录音按钮,用户可以跟读并录音,跟读完听回放"

进阶配置

和前面的第1、2篇一样,可以配置上传附件、选择协作模式、调用技能、选择编程模型。不清楚的可以去考古前两篇。

AI智能体 | 扣子编程02:移动应用开发,真机体验比网页爽多了

敲回车,开始开发。


第三步:AI编程开发

扣子收到需求后开始干活:

左边对话区显示开发进度:需求分析→生成PRD→自动配置集成能力→代码生成与测试

大约3-5分钟,提示测试通过,可以预览了。

自动集成的能力

这个小程序自动集成了:

  • 数据库存储
    用户学习记录、主题数据
  • AI能力
    对话生成、语音合成(文字转语音)
  • 录音组件
    用户跟读录音功能

注意:录音功能在网页预览时不可用,必须真机调试才能测试。这是小程序和移动应用的一个区别。


第四步:预览与测试

网页端预览

代码生成后,右侧出现预览窗口。可以测试界面布局、主题选择、对话生成和展示。

但录音功能此时点不了,会提示"请在真机调试"。

真机调试(关键步骤,和移动应用不一样)

小程序和移动应用最大的不同——必须先绑定AppID才能真机预览

移动应用直接扫码就能在手机上跑,小程序多了这一步。

1. 绑定微信小程序

在扣子编程页面右下角,点击"AppID设置"

填入之前复制的AppID,点击绑定

系统会弹出授权页面,用小程序管理员微信扫描二维码,完成授权:

步骤
操作
1
管理员扫描二维码
2
选择要绑定的小程序账号
3
确认授权
4
授权成功

2. 扫码预览

绑定成功后,用管理员微信扫描页面右侧的二维码,小程序就在你手机上跑起来了。

手机端截图:

测试重点

真机测试要关注:

测试维度
检查要点
功能可用性
主题生成、对话展示、拼音标注是否正常
录音功能
点击录音按钮是否有权限申请、录音和回放是否正常
语音合成
点击气泡朗读是否有声音、语速是否合适
交互体验
页面滚动是否流畅、按钮点击是否灵敏

修复故障

测试时发现一个问题:录音按钮点击后没有反应。

排查发现是微信小程序的录音权限需要单独配置。直接在对话框反馈:

"录音按钮点击没反应,可能是权限问题,帮忙修复"

扣子自动检查并修复,重新扫码后问题解决。


第五步:迭代优化

基础功能跑通后,继续优化。

调整需求与自然语言编辑

在对话记录中找到之前的消息直接修改,或者说人话提需求让扣子改。这部分和前两篇一样,不清楚的可以去考古。

版本回滚

如果某次修改把小程序改崩了,点击对话区顶部的"版本历史"回滚。这个操作在前两篇也讲过,不重复了。


第六步:集成能力

扣子编程通过技能方式封装了一批常见的集成能力接口。

在和扣子AI对话添加集成能力之前,需要先在扣子AI对话区域单击"技能",确认已添加想要的技能。

存储与数据库、AI能力的集成,扣子AI会根据任务要求自动配置,也可以手动发指令。这部分和前两篇一样,不再展开。


第七步:部署上线(和移动应用差别很大)

测试没问题后,即可以点击右上角"部署"

部署的前置条件

微信小程序上线前需要完成:

  1. 小程序备案
    (国内服务器必须)
  2. 隐私协议配置
  3. 服务类目设置

这些在微信公众平台完成,具体步骤还是参考前面提到的微信官方文档。

部署流程

  1. 在扣子编程点击部署
  2. 选择部署版本
  3. 配置数据库同步(开发环境数据是否同步到生产环境)
  4. 配置生产环境变量(API Key等敏感信息)
  5. 点击开始部署

部署成功后,扣子会自动将代码提交到微信小程序平台。

微信审核(小程序特有)

小程序需要经过微信审核才能正式上线:

  • 审核时间:通常1-3个工作日
  • 审核标准:符合微信小程序运营规范
  • 审核结果:微信会发送通知

审核通过后,用户就可以在微信中搜索小程序名称使用了。

这是小程序和移动应用最大的区别——移动应用直接部署就能用,小程序还得等平台审核。

分享项目

部署完成,微信平台审核通过之后,你的用户可在微信中根据小程序名称搜索并使用这个小程序。

查看线上日志

查看已发布的小程序的前后端运行日志,以便在出现问题时进行故障排查和分析。

下架小程序(小程序特有)

如果要下架小程序,需要在微信开放平台解除扣子编程的绑定关系,然后暂停小程序服务。操作步骤如下:

管理员登录微信开放平台,解除绑定关系
  1.  在页面左下角单击头像,单击账号设置
  2.  单击第三方设置页签
  3.  找到扣子编程,并在操作列单击解除授权,根据页面提示完成后续操作。
暂停小程序服务
  1. 进入设置 > 基本设置页面
  2. 在账号信息区域单击暂停服务按钮
  3. 选择暂停原因和预计恢复时间

小程序 vs 移动应用:到底选哪个?

场景
推荐
原因
快速验证想法
小程序 ✅
无需下载,扫码即用,分享方便
借助微信流量
小程序 ✅
可分享到群聊、朋友圈
需要录音/摄像头
两者皆可
小程序也能调,但需用户授权
独立品牌建设
移动应用 ✅
有自己的App图标,用户感知更强
复杂功能/高性能
移动应用 ✅
不受平台限制,性能更好
企业内部应用
移动应用 ✅
发APK给员工安装,无需审核

写在最后

今天实测小程序开发的几个真实体会:

前置门槛更高
必须先注册小程序、获取AppID、完成授权,比移动应用麻烦
平台依赖性强
功能受微信限制,审核也有不确定性
流量优势
分享方便,适合需要传播的场景
录音等能力
真机才能测试,调试周期比移动应用长

小程序适合轻量级工具、快速验证、依赖社交传播的场景;移动应用适合独立产品、深度功能、长期运营的场景。

下一篇预告:《扣子编程04:智能体开发,和低代码智能体有什么区别?》


今日分享结束。

关于汉堡侠,一个5年国内+3年国外水运工程持证(一级港航)搬砖佬,专注AI工具提效(AI智能体+AI编程),只分享有用的,拒绝贩卖焦虑,一起拥抱AI时代
如需进AI智能体学习沟通群,点个关注并留言

👇🔙 往期学习精选回顾🔙:

点击标题即可阅读

1️⃣ AI智能体 | 扣子编程02:移动应用开发,真机体验比网页爽多了
2️⃣ AI智能体 I 扣子编程01:自然语言开发网页应用,从需求到上线要几步?