悦期记 · 技术分享文档
一个从需求到上线，全程由 AI（Kiro）辅助完成的微信小程序实践记录
前言： PRD产出，我把我的想法给了不同的模型，来产出PRD，然后进行对比，
分别在 Kimi、Gemini、豆包、kiro 都给了相同的提示词，产出了， 最终我采用了 kimi 输出的原型。Gemini的文档能力还是偏弱，图片能力是我用的这几个里面最强的，一般我做图片处理都是用 Gemini。
一、项目背景与定位
1.1 产品简介
悦期记是一款面向备孕女性、孕期妈妈和 0-6 岁宝妈的综合性母婴服务微信小程序。产品定位轻量、纯净，聚焦核心工具需求，不做信息过载的内容平台。
核心功能模块：
| 模块 | 功能 |
|---|---|
| 首页（孕期） | 经期日历、排卵期预测、受孕概率计算 |
| 宝宝 | 成长记录、疫苗接种、生长曲线 |
| 社区 | 图文帖子、点赞评论、标签搜索 |
| AI 助手 | 多轮对话、个性化母婴建议、会话管理 |
| 我的 | 个人资料、会员管理、设置 |
1.2 这个项目的特别之处
整个项目从零到上线，全程使用 Kiro 完成，包括：
- 需求文档（PRD）撰写
- 技术架构设计
- 数据库 Schema 设计
- 所有页面和组件开发
- 云函数开发与调试
- AI 功能集成
- 支付功能接入
- Bug 修复与迭代
这是一次真实的"AI 辅助全栈开发"实践，验证了 AI IDE 在完整项目生命周期中的能力边界。
功能截图：
二、技术栈选型
2.1 整体架构
┌─────────────────────────────────────────────────────┐
│ 微信小程序前端 │
│ 原生框架（WXML + WXSS + JavaScript） │
├─────────────────────────────────────────────────────┤
│ 微信云开发平台 │
│ 云函数（Node.js） 云数据库 云存储 │
├─────────────────────────────────────────────────────┤
│ 第三方服务 │
│ DeepSeek API（AI对话） 微信支付（会员充值） │
└─────────────────────────────────────────────────────┘
2.2 选型理由
为什么选微信小程序原生框架而不是 Taro/uni-app？
- 目标平台单一（只做微信），无需跨端
- 原生框架对云开发支持最完整
- 减少框架层的不确定性，AI 生成代码更稳定
为什么选微信云开发而不是自建服务器？
- 零运维成本，无需购买服务器
- 与微信生态深度集成（openid、支付回调等）
- 云函数天然支持按量计费，适合初期产品
- 数据库权限规则与 openid 绑定，安全性有保障
为什么选 DeepSeek 而不是 GPT/Claude？
- 国内访问稳定，无需代理
- 价格更低，适合 C 端产品控制成本
deepseek-chat模型中文理解能力强
三、项目初始化与工程结构
3.1 目录结构
悦期记/
├── pages/ # 主包页面（TabBar 页面）
│ ├── index/ # 首页（经期日历）
│ ├── baby/ # 宝宝首页
│ ├── community/ # 社区首页
│ ├── ai/ # AI 助手页面
│ └── profile/ # 个人中心
├── packagePregnancy/ # 孕期功能分包
├── packageBaby/ # 宝宝功能分包
├── packageCommunity/ # 社区功能分包
├── packageProfile/ # 个人功能分包（独立分包）
│ ├── pages/
│ │ ├── membership/ # 会员管理页
│ │ ├── settings/ # 设置页
│ │ └── ...
│ └── components/
│ └── payment-modal/ # 支付弹窗组件
├── components/ # 公共组件
│ └── ai/
│ ├── chat-bubble/ # 消息气泡
│ ├── input-bar/ # 输入栏
│ ├── typing-indicator/ # 打字动画
│ └── quick-replies/ # 快捷回复
├── cloudfunctions/ # 云函数
│ ├── login/
│ ├── aiChat/ # AI 对话（核心）
│ ├── sessionManager/
│ ├── createOrder/ # 微信支付下单
│ ├── payNotify/ # 支付回调
│ ├── createPost/
│ ├── getPosts/
│ └── ...（共 20+ 个云函数）
├── services/ # 服务层封装
│ └── ai.js
├── utils/ # 工具函数
│ ├── aiCache.js
│ └── validator.js
└── assets/ # 静态资源
3.2 分包策略
小程序主包限制 2MB，总包限制 20MB。采用按功能模块分包：
| 分包 | 类型 | 说明 |
|---|---|---|
| 主包 | - | 仅含 5 个 TabBar 页面 + 公共组件 |
| packagePregnancy | 普通分包 | 经期详情、排卵期、统计图表 |
| packageBaby | 普通分包 | 宝宝详情页、生长曲线、疫苗 |
| packageCommunity | 普通分包 | 帖子详情、发布、搜索 |
| packageProfile | 独立分包 | 个人设置、会员管理（可独立运行） |
packageProfile 设为独立分包的原因：会员支付页面可能通过分享链接直接打开，独立分包无需依赖主包即可运行。
3.3 自定义 TabBar
由于需要 5 个 Tab（原生最多支持 5 个，但样式定制受限），使用自定义 TabBar：
// app.json
"tabBar": {
"custom": true,
"list": [...]
}
自定义 TabBar 组件在 custom-tab-bar/ 目录，每个页面的 onShow 生命周期中调用 this.getTabBar().setSelected(index) 同步选中状态。
四、云开发配置
4.1 初始化
在 app.js 中初始化云开发：
App({
onLaunch() {
if (!wx.cloud) {
console.error("请使用 2.2.3 或以上的基础库");
return;
}
wx.cloud.init({
env: "your-env-id", // 云环境 ID
traceUser: true, // 将用户访问记录到用户管理
});
},
});
4.2 数据库集合设计
项目共使用以下数据库集合：
基础功能：
| 集合名 | 用途 | 权限 |
|---|---|---|
| users | 用户信息 | 仅自己读写 |
| cycle_records | 经期记录 | 仅自己读写 |
| daily_records | 每日症状记录 | 仅自己读写 |
| pregnancy_records | 孕期信息 | 仅自己读写 |
| babies | 宝宝档案 | 仅自己读写 |
社区功能：
| 集合名 | 用途 | 权限 |
|---|---|---|
| posts | 帖子 | 所有人可读，自己可写 |
| post_likes | 点赞记录 | 仅自己读写 |
| post_comments | 评论 | 所有人可读，自己可写 |
AI 功能：
| 集合名 | 用途 | 权限 |
|---|---|---|
| ai_sessions | 会话记录 | 仅自己读写 |
| ai_messages | 消息记录 | 仅自己读写 |
| ai_user_quota | Token 用量统计 | 仅管理端写，自己读 |
支付功能：
| 集合名 | 用途 | 权限 |
|---|---|---|
| orders | 订单记录 | 仅管理端读写 |
4.3 数据库权限规则
微信云开发数据库支持基于 openid 的细粒度权限控制：
// 用户只能读写自己的数据
{
"read": "doc.openid == auth.openid",
"write": "doc.openid == auth.openid"
}
// 所有人可读，自己可写（社区帖子）
{
"read": true,
"write": "doc.openid == auth.openid"
}
// 仅管理端（云函数）可读写（订单、支付数据）
{
"read": false,
"write": false
}
4.4 云函数部署
所有云函数在微信开发者工具中右键 → 上传并部署：云端安装依赖。
需要配置环境变量的云函数：
| 云函数 | 环境变量 | 说明 |
|---|---|---|
| aiChat | DEEPSEEK_API_KEY | DeepSeek API 密钥 |
| createOrder | WX_APPID WX_PAY_MCH_ID WX_PAY_SERIAL_NO WX_PAY_PRIVATE_KEY WX_PAY_API_V3_KEY WX_PAY_NOTIFY_URL | 微信支付配置 |
| payNotify | 同上（除 NOTIFY_URL） | 支付回调处理 |
五、核心模块开发
5.1 首页：经期日历与排卵期预测
排卵日计算算法：
排卵日 = 下次月经预计日 - 14天
排卵期 = 排卵日前5天 ~ 排卵日后4天（共10天）
黄金受孕期 = 排卵日前2天 ~ 排卵日后1天
受孕概率按距排卵日天数分级（-5天到+4天，概率从10%到50%）。
云函数 getCyclePrediction 根据历史经期数据预测未来3个月经期，getOvulationData 计算当月排卵期数据，前端日历组件根据返回数据渲染不同颜色标记。
5.2 社区模块
社区采用小红书风格的图文帖子流，核心云函数：
createPost：发布帖子，支持分类、标签、图片getPosts：分页查询，支持按分类/标签筛选searchPosts：全文搜索（标题+内容）likePost：点赞/取消点赞（幂等操作）commentPost：评论，支持回复
所有云函数统一响应格式：
// 成功
{ success: true, data: { ... } }
// 失败
{ success: false, error: '错误信息' }
5.3 AI 助手模块
这是项目最复杂的模块，也是 Kiro 辅助开发投入最多的部分。
架构设计
小程序前端（AI页面）
↓ wx.cloud.callFunction
aiChat 云函数
↓ 内容过滤 → 提示词生成 → DeepSeek API
↓ 异步写入数据库（不阻塞返回）
返回 AI 回复给前端
关键设计决策：数据库操作全部异步后台执行，不阻塞主流程返回，将云函数响应时间从 3-5 秒降低到 API 本身的响应时间（1-2 秒）。
提示词系统
根据用户所处阶段（备孕/孕期/育儿）动态生成系统提示词：
// cloudfunctions/aiChat/prompts.js
function getScenePrompt(stage, context) {
switch (stage) {
case "preparing":
return PREPARING_PROMPT;
case "pregnant":
return PREGNANT_PROMPT + `\n当前孕周：${context.pregnancyWeek}周`;
case "parenting":
return PARENTING_PROMPT + `\n宝宝年龄：${context.babyAge}个月`;
default:
return PREPARING_PROMPT;
}
}
提示词明确要求模型：不提供医疗诊断、严重问题建议就医、可回答非母婴话题。
内容安全过滤
contentFilter.js 实现两层过滤：
- 输入过滤：30个禁止关键词（自伤/暴力/毒品/违法/色情/赌博），命中即拒绝
- 输出处理：检测 AI 回复中的医疗关键词（20类），自动附加免责声明
可靠性机制
// 重试配置
const RETRY_CONFIG = {
maxRetries: 2,
retryDelay: 1000,
retryableStatusCodes: [408, 429, 500, 502, 503, 504],
};
// 熔断器：失败5次后触发，60秒后自动恢复
const CIRCUIT_BREAKER_CONFIG = {
failureThreshold: 5,
timeout: 60000,
halfOpenRequests: 1,
};
Token 配额管理
每用户设置 100 万 tokens 免费额度，存储在 ai_user_quota 集合：
// 每次 API 调用后异步累加
await db
.collection("ai_user_quota")
.doc(id)
.update({
data: { totalTokens: db.command.inc(tokensUsed) },
});
超出配额时返回 quotaExceeded: true，前端弹窗提示。
多会话 Tab 管理
前端实现了类似浏览器标签页的多会话管理：
- 支持新建、切换、关闭、重命名会话
- 支持 ‹ › 按钮调整 Tab 顺序
- 会话数据持久化到本地存储（
wx.setStorageSync） customTitle标志位：手动命名的 Tab 不会被自动覆盖标题
5.4 会员支付模块
支付流程
前端点击购买
↓
调用 createOrder 云函数（统一下单）
↓ 调用微信支付 JSAPI 接口
↓ 写入 orders 集合（status: pending）
返回 prepay_id 和签名参数
↓
前端调用 wx.requestPayment
↓ 用户完成支付
微信服务器回调 payNotify 云函数
↓ AES-256-GCM 解密回调数据
↓ 验证 trade_state === 'SUCCESS'
↓ 更新 orders 状态（paid）
↓ 更新 ai_user_quota（写入会员信息，重置 usedCount）
关键实现细节
签名生成（createOrder 云函数）：
// 请求签名（调用微信支付 API 用）
function buildRequestSign(method, url, timestamp, nonce, body, privateKey) {
const message = `${method}\n${url}\n${timestamp}\n${nonce}\n${body}\n`;
const sign = crypto.createSign("RSA-SHA256");
sign.update(message);
return sign.sign(privateKey, "base64");
}
// 支付签名（返回给前端调起支付用）
function buildPaySign(appId, timestamp, nonceStr, prepayId, privateKey) {
const message = `${appId}\n${timestamp}\n${nonceStr}\nprepay_id=${prepayId}\n`;
const sign = crypto.createSign("RSA-SHA256");
sign.update(message);
return sign.sign(privateKey, "base64");
}
回调解密（payNotify 云函数）：
function decipherGcm(ciphertext, associatedData, nonce, apiV3Key) {
const key = Buffer.from(apiV3Key, "utf8");
const ciphertextBuf = Buffer.from(ciphertext, "base64");
const authTag = ciphertextBuf.slice(ciphertextBuf.length - 16);
const data = ciphertextBuf.slice(0, ciphertextBuf.length - 16);
const decipher = crypto.createDecipheriv(
"aes-256-gcm",
key,
Buffer.from(nonce, "utf8"),
);
decipher.setAuthTag(authTag);
decipher.setAAD(Buffer.from(associatedData, "utf8"));
return JSON.parse(
Buffer.concat([decipher.update(data), decipher.final()]).toString("utf8"),
);
}
payNotify 需要开启 HTTP 访问服务，在云开发控制台 → 云函数 → payNotify → HTTP访问服务 → 开启，获得公网 URL 填入 notify_url。
幂等处理：回调可能重复触发，通过检查 order.status === 'paid' 防止重复处理。
六、开发迭代记录
Git 提交历史
e6fb601 init: 初始化基本页面布局
704235c init: 基础框架搭建完成
5550e37 feat: 个人信息页面功能添加
52fe0ba feat: 首页基础功能
40d94db ui: 完善UI
f891b4a feat: 完善首页功能
55c198f feat: 增加分享功能
8ea8d10 feat: 增加宝宝功能
7b2f41a feat: 增加社区功能
c163c4a fix: 修改分享功能的title
c92f4c1 feat: 增加AI 会话功能
49fd45a feat: AI功能使用上限添加
747da56 feat: 增加支付代码
各阶段说明
阶段一：基础框架（init）
使用 Kiro 的 Spec 功能，先写需求文档（requirements.md），再写设计文档（design.md），最后生成任务列表（tasks.md）逐步实现。基础框架包括：app.json 配置、TabBar、分包结构、全局样式。
阶段二：首页与个人信息（feat）
首页经期日历是核心功能，涉及日历组件渲染、经期标记、排卵期计算。个人信息页包含微信授权登录（open-type="chooseAvatar"）、用户信息存储。
阶段三：社区与宝宝模块（feat）
社区模块云函数较多（5个），Kiro 统一设计了响应格式和错误处理规范。宝宝模块以静态知识内容为主，结合云数据库存储成长记录。
阶段四：AI 助手（feat）
AI 模块是迭代最多的部分，经历了：
- 基础对话 → 会话管理 → 多会话 Tab
- 简单提示词 → 分阶段提示词系统
- 无配额限制 → Token 配额管理
- 无登录检查 → 登录态守卫
阶段五：支付（feat）
微信支付接入涉及证书管理、签名算法、回调处理，全部通过云函数实现，无需自建服务器。
七、Kiro 辅助开发实践总结
7.1 Spec 驱动开发
Kiro 的 Spec 功能将开发流程结构化为三个阶段：
.kiro/specs/ai-assistant/
├── requirements.md # 需求文档（用户故事 + 验收标准）
├── design.md # 设计文档（架构 + 接口 + 数据模型）
└── tasks.md # 任务列表（可逐条执行）
这种方式的好处：
- 需求和设计有文档沉淀，不会"只在对话里"
- 任务粒度可控，每次只做一件事
- 设计文档可以作为后续迭代的上下文
7.2 上下文管理
长对话中 Kiro 会通过"上下文转移摘要"保持连续性，关键信息（已完成的任务、重要决策、文件路径）会被提炼保留，避免重复解释背景。
7.3 适合 AI 辅助的场景
效率提升最明显：
- 重复性代码（多个相似云函数）
- 样式编写（WXSS）
- 数据模型设计
- 错误处理和边界情况
需要人工把控：
- 业务逻辑的正确性（排卵期算法、支付签名）
- 微信平台特有的坑（独立分包限制、TabBar 选中状态）
- 第三方 API 的最新文档（微信支付 v3 接口）
7.4 踩过的坑
| 问题 | 原因 | 解决方案 |
|---|---|---|
| AI 云函数超时 | 默认超时 3 秒，DeepSeek 响应需要 5-10 秒 | 云开发控制台手动设置超时为 60 秒 |
| TabBar 选中状态不同步 | 自定义 TabBar 需要手动调用 setSelected | 每个页面 onShow 中调用 |
| 独立分包无法调用主包组件 | 独立分包的限制 | payment-modal 组件放在 packageProfile 内 |
| 支付回调无法接收 | payNotify 没有公网 URL | 开启云函数 HTTP 访问服务 |
| 多会话 Tab 标题被覆盖 | 自动更新标题逻辑没有判断是否手动命名 | 增加 customTitle 标志位 |
八、部署上线清单
8.1 云开发配置
- 创建云开发环境，记录环境 ID
- 在
app.js中填入环境 ID - 创建所有数据库集合并设置权限规则
- 部署所有云函数（右键 → 上传并部署：云端安装依赖）
- 配置 aiChat 环境变量：
DEEPSEEK_API_KEY - 配置 createOrder / payNotify 环境变量（微信支付相关）
- 开启 payNotify 的 HTTP 访问服务，获取回调 URL
8.2 微信支付配置
- 商户平台开通 JSAPI 支付
- 下载 API 证书（apiclient_cert.pem / apiclient_key.pem）
- 设置 API v3 密钥
- 将证书内容和密钥配置到云函数环境变量
- 将 payNotify 的 HTTP URL 填入 createOrder 的 notify_url
8.3 小程序发布
- 在微信开发者工具上传代码
- 填写版本号和更新说明
- 提交微信审核
- 审核通过后发布
九、后续规划
- 会员体系完善：支付成功后解锁更多 AI 对话次数，会员到期提醒
- AI 功能增强：支持图片识别（宝宝辅食、症状图片）、语音输入
- 社区运营：内容审核机制、热门帖子推荐、话题活动
- 数据分析：用户行为统计、AI 使用报告、经期数据可视化
- 消息推送：经期提醒、疫苗接种提醒、社区互动通知
文档编写时间：2026年4月 项目状态：持续迭代中 开发工具：Kiro（AI IDE）
