一、项目背景
在学习微信小程序开发的过程中,我想做一个实用且有挑战性的项目。考虑到美食烹饪是一个大众需求,且涉及数据展示、用户交互、云开发等多个技术点,最终决定开发一款美食烹饪小程序——「天才厨神」。
二、技术架构
2.1 整体架构
2.2 技术选型
| 层级 | 技术 | 理由 |
|---|---|---|
| 前端 | 微信小程序原生开发 | 原生开发能更好地利用微信平台特性,调试体验更流畅 |
| 后端 | 微信云开发(CloudBase) | 一站式解决方案,无需搭建服务器,降低开发成本 |
| 数据库 | 云数据库(NoSQL) | 自动扩展,适合小程序数据存储需求 |
| 复杂逻辑 | 云函数(Node.js) | 处理需要管理员权限的操作和调用微信开放接口 |
三、核心功能与关键代码
3.1 菜品权限控制
由于微信小程序对个人开发者的社交功能有限制,我们采用了"系统菜品+私有菜品"的模式:
// 获取用户可见的菜品asyncgetVisibleMenus(userId){returnawaitthis.db.collection('menus').where(this._.or([{isPublic:true},// 系统菜品:所有用户可见{userId:userId}// 私有菜品:仅创建者可见])).get();}用户创建的菜品默认设为私有,只有管理员通过后台操作才能将其设为系统菜品。
3.2 收藏功能
用户可以收藏任意菜品,方便快速访问:
asynctoggleFavorite(userId,menuId){constfavorite=awaitthis.db.collection('favorites').where({userId,menuId}).get();if(favorite.data.length>0){awaitthis.db.collection('favorites').doc(favorite.data[0]._id).remove();returnfalse;}else{awaitthis.db.collection('favorites').add({data:{userId,menuId,createdAt:newDate()}});returntrue;}}3.3 盲盒随机抽取
让用户随机发现新菜品,增加趣味性:
asyncdrawBlindBox(){letmenus=[...this.data.menus];if(this.data.favoritesOnly){menus=menus.filter(m=>this.data.favoritedMap[m.id]);}elseif(this.data.myMenusOnly){menus=menus.filter(m=>m.userId===this.data.userInfo.id);}constrandomMenu=menus[Math.floor(Math.random()*menus.length)];this.setData({randomMenu,showResult:true});}3.4 内容安全检测
调用微信安全 API 检测用户提交的内容:
// 云函数exports.main=async(event)=>{const{type,content}=event;if(type==='text'){constresult=awaitcloud.openapi.security.msgSecCheck({content});returnresult;}};四、开发过程中的坑(重点)
4.1 云函数依赖配置缺失
问题:创建的云函数在调用时总是报错,检查日志发现是缺少wx-server-sdk依赖。
原因:新建云函数时package.json没有自动包含必要的依赖。
解决方案:手动添加依赖配置:
{"name":"markMessageRead","dependencies":{"wx-server-sdk":"~2.6.3"}}4.2 小程序端数据权限不足
问题:用户点击消息后,已读状态无法更新到数据库,报错"权限不足"。
原因:消息是由系统创建的(其他用户评论时),当前用户没有权限直接更新其他用户创建的记录。
解决方案:使用云函数处理需要管理员权限的操作:
// 云函数:标记消息已读exports.main=async(event)=>{awaitdb.collection('messages').doc(event.messageId).update({data:{isRead:true}});return{success:true};};4.3 消息已读状态同步问题
问题:用户点击消息后,小红点会短暂消失,但返回消息中心后又出现。
原因:前端在调用云函数的同时就更新了本地状态,但云函数执行失败(因依赖缺失),导致数据库中的状态没有改变。返回页面重新加载时,从数据库读取的仍是未读状态。
解决方案:
- 修复云函数依赖问题
- 在云函数返回成功后再更新本地状态
4.4 审核被拒:个人开发者不能做社交功能
问题:第一次提交审核被拒,原因是个人开发者不能做用户生成内容(UGC)的社交功能。
原因:原来的设计允许用户创建公共菜品并点赞,这被判定为社交功能。
解决方案:
- 移除用户创建公共菜品的选项,默认创建私有菜品
- 移除点赞功能
- 公共菜品改名为"系统菜品",由管理员统一管理
五、成品展示
经过一系列开发和调试,「天才厨神」小程序已经完成开发并通过审核。主要功能包括:
- 菜品浏览与搜索
- 菜品创建(私有)
- 菜品收藏
- 盲盒随机抽取
- 评论与回复
- 消息通知
- 意见反馈(带内容安全检测)
如果你对这个项目感兴趣,可以扫码体验:
六、总结
通过这个项目,我对微信小程序开发和云开发有了更深入的理解。最大的收获是学会了如何处理云函数依赖、数据权限等实际开发中常见的问题,以及如何根据平台规则调整产品设计。
如果你也在学习小程序开发,希望这些经验能对你有所帮助。如果你有任何问题或建议,欢迎交流!