垃圾分类小程序实现

不想看下面废话的，可直接扫码体验：

image.png

对代码有兴趣的看这里：
小程序的源码地址：https://github.com/chenyuzuo/garbage_sort_mini
开发常见问题：
https://mp.weixin.qq.com/s/-Z5RotNye2zdSX3-W1Bfkw

1.核心功能

参考了目前很多垃圾分类小程序，其实大家的功能都大同小异，其中最关键的点无非就是帮助用户快速查找垃圾属于具体的分类，目前实现了如下几个功能：

1.文字搜索：根据文本搜索垃圾分类
2.拍照识别：根据图片识别出文本然后搜索垃圾分类
3.语音识别：根据语音识别出文本然后搜索垃圾分类
4.垃圾分类基础数据：分成四大类，每类数据根据字母表可以索引

2.具体实现

我自己本来是后端开发，第一次从零开发小程序，前端并不熟悉，这个小程序的实现很大部分借助了开源社区以及云平台的能力，具体如下：

1. 垃圾分类基础数据的收集和处理
   从前面几个核心功能也可以看的出，所有的功能前提是有一份垃圾分类数据，github上有多个项目提供了垃圾分类数据，我参考了这个项目，github地址：https://github.com/alexayan/garbage-classification-data，基于这个项目的基础数据做了一些处理，主要点是增加字母表的分类，如下图，我想展示的效果是希望数据可以按字母表排序，且可以点击字母索引，处理的思路是取每个文本的首个汉字拼音的首字母，比如白纸，取白字的拼音首字母就是B，基于这个思路github上面继续找到这个项目https://github.com/hotoo/pinyin，用NodeJs处理文本得到文本的拼音和首字母，最终得到一份基础数据JSON格式大概这样的

{
  "categroy": 1,
  "data": [{
    "letter":"A",
    "garbageItem": ["A4纸", "安全帽"]
  }, ...]
}, {
  "categroy": 2,
  "data": [{
    "letter": "A",
    "garbageItem": ["阿司匹林"]
  }, ..]
}
...

字母表排序

2. 搜索功能的实现
   搜索功能提供了文本搜索，图片识别搜索，语音识别搜索功能，垃圾分类基础数据放在了小程序本地，文本搜索其实就是用文字去遍历本地数据匹配到了则展示出来，图片和语音搜索最终其实也都是文本搜索，只不过一个是识别图片得到文本，一个是识别语音得到文本，这两项能力依赖的百度AI平台，百度ai地址：https://ai.baidu.com/，通过百度的接口可以识别图片中的内容以及语音中的内容，拿到文本内容后剩下的事就跟文本搜索一样了。

3. 微信小程序云开发
   近两年在不同的场合或者一些文章经常有看到提到serverless架构，微信小程序和支付宝小程序也有基于云开发这种模式，提供了云函数、云存储，云数据库等，简单来讲就是可以不用服务端开发，前端直接操作db，操作存储，跟传统模式开发有一定的差别，这次也是借开发这个小程序体验了下微信的云开发，比如我目前把搜索记录保存到数据库里面就是直接在前端操作db的，个人感觉适合全栈开发，对于轻量级应用，快速验证型应用其实还是很高效的，期待未来有更多场景可以尝试。

   
   
   微信小程序云开发

4. 最后还要提的几个开源项目，非常感谢从这几个项目获取到的帮助，如有版权或其他不妥之处，可以私信联系我。

• 垃圾分类小程序 ：
  我其实就是基于该项目开发，很大程度借鉴了该项目，尤其是UI界面，主要差异点是我增加了语音识别，基础数据是根据另外一个开源项目的数据加工处理的，比如前面提到的增加字母表分类，另外搜索逻辑该项目是基于云数据库的数据搜索，我直接基于的本地json数据搜索，具体的分类页面我增加了字母表索引等。
  https://github.com/qi19901212/Garbage
• 垃圾分类基础数据来源：
  https://github.com/alexayan/garbage-classification-data
• 首字母数据获取：
  https://github.com/hotoo/pinyin
• 按字母展示以及点击字母跳转参考：https://github.com/icindy/wxSortPickerView