独立开发30天,我用AI做了个发型推荐小程序(含全部踩坑记录)
每次去理发店,Tony 老师问"想剪什么样的",我都答不上来。
不是没想法,是不知道自己适合什么发型。圆脸、方脸、长脸……网上说了一万种,但对着镜子看了半天,还是分不清自己属于哪种。
于是我想:能不能做一个 AI 小程序,拍张照就能告诉你适合什么发型?
小程序实际效果截图
技术选型
需求很简单:
- 用户拍张照 → 识别脸型
- 根据脸型推荐发型 → 显示结果
- 最好还能试戴效果图
前端:微信小程序(生态封闭,没得选)
后端:Node.js + Express
人脸识别:百度人脸检测 API(免费 1000 次/月)
人脸融合:百度人脸融合(免费 500 次/月)
服务器:阿里云 2 核 2G 乞丐版
做独立开发的原则:能不自己造的轮子就别造,专业 API 比你写半天的代码靠谱得多。
第一个坑:脸型判断全靠"猜"
最初想用 Canvas 做面部关键点检测。写了三天,精度感人——我给猫拍了一张照片,它被归类为「鹅蛋脸」。
对,你没看错。一只猫,鹅蛋脸。
猫:我明明是圆脸
后来换了百度人脸检测 API,正经返回 72 个关键点坐标,通过长宽比判断脸型,准确率上了天。猫的照片也被正确判为「未检测到人脸」。
{"face_shape":"oval","face_shape_name":"鹅蛋脸","confidence":0.92,"gender":"male"}教训:别自己造轮子。专业的事交给专业 API。
第二个坑:微信审核地狱
小程序做完,提交审核——被拒。
“请接入微信内容安全 API。”
微信要求接入imgSecCheck(图片检测)和msgSecCheck(文本检测)两个 API。代码不到 100 行,踩坑一整天。
最坑的地方:要录屏!录 API 调用成功返回errcode: 0的屏,当证据提交。
第三个坑:Nginx 配置的魔鬼细节
小程序后端和另一个服务跑在同一台服务器上。有次打开审核页面,显示的是另一个网站首页——nginx 配置坏了。
sed命令的a\追加模式插入多行配置时,会在行首插入一个多余的n,导致 nginx 直接报unknown directive "n"。
反复修了四次才利索。
教训:直接完整文件替换,别用 sed 修 nginx。
第四个坑:iOS 相机打不开
Android 一切正常,iPhone 上拍照就黑屏。
根因:wx.authorize({ scope: 'scope.camera' })在 iOS 上不会弹权限提示。iOS 相机权限走的是系统原生弹窗。
解决方案:
- 改用
wx.getSetting检测 - 让
<camera>组件自己触发 iOS 权限 binderror兜底
另外,box-shadow: 0 0 0 9999px #000000这种用大阴影做遮罩的黑科技,iOS 上闪白崩溃。老老实实改background: rgba(0,0,0,0.45)。
技术架构
用户 → 微信小程序 → HTTPS → Nginx (443) ↓ ┌── 发型助手 API (3001) │ ├── /api/detect-face → 百度人脸检测 │ ├── /api/try-on → 人脸融合 │ └── 微信内容安全检测 │ └── AI 论坛 (3000)费用
| 服务 | 费用 |
|---|---|
| 阿里云服务器 (2C2G) | 约 100 元/月 |
| 百度人脸检测 | 免费 1000 次/月 |
| 百度人脸融合 | 免费 500 次/月 |
| 域名 | 几十块/年 |
| 总计 | 一杯奶茶/天的成本 |
百度人脸 API 返回的脸型识别结果
总结
30 天,从灵光一闪到上线一个小程序。
踩了无数坑,被 nginx 气笑过,被微信审核搞到头秃过。但看到第一个用户成功分析出脸型、推荐出发型——值了。
如果你也在做类似的独立开发项目,欢迎评论区交流经验,遇到了什么坑说出来大家一起避。
原创不易,点个收藏支持一下~
