《基于微信小程序的垃圾分类系统的实现》9600字

基于微信小程序的垃圾分类系统的实现目录TOC\o"1-3"\h\u摘要 摘要2020年5月1日北京市公布了《北京市公共机构生活垃圾分类标准》，各地也相继公布各地的垃圾分类条例。垃圾分类走入家家户户，一时间“垃圾分类”成为年度网络热词。如何分辨生活中的垃圾属于什么种类，成了人们关心的问题。随着移动应用的发展，人们更偏向于在移动设备上找到答案，垃圾分类系统与小程序开发的结合，能够帮助人们解决这一难题。本系统通过分析移动设备上一些垃圾分类系统的现状和发展，采用微信小程序作为系统框架。利用小程序·云开发对垃圾分类系统的垃圾条目进行设计整理。使用WXML、JS、WXSS等语言对小程序页面进行设计，系统开发采用无服务器架构，利用云开发管理数据库，采用云函数管理调用的api。关键词：微信小程序；垃圾分类；云开发；绪论本章主要对垃圾分类系统的背景和现状进行研究分析，分析现阶段不同系统的优劣，从多个方向论述系统的研究意义。1.1研究背景2019年9月，为了全面深入贯彻落实习近平总书记关于垃圾分类工作的重要指示精神。国家机关事务管理局印发通知，公布《公共机构生活垃圾分类工作评价参考标准》。2020年5月北京市发布相关垃圾分类标准，全国各地相继出台垃圾分类政策，虽然截至目前还有一些地区的垃圾分类政策未颁布，生活垃圾分类已成为势不可挡的全民趋势。其中苏州在2020年6月1日也推出了苏州市相关标准。2020年5月中国移动互联网用户达到11.64亿高位，越来越多互联网服务平台转向移动设备，移动设备上的垃圾分类系统也是如雨后春笋，层出不穷。传统的利用网站查询垃圾分类信息的方式，网页复杂，需要用户耗费时间辨别真伪，难以为“一时词穷”,找不到合适形容垃圾品类的词语时，无法提供更好的帮助。应用市场中垃圾分类应用程序，往往存在占用手机空间资源的问题。微信平台的小程序很好地解决了这一难题：微信小程序近水楼台先得月，获得了微信平台所配备的大量资源，凭借着人们对微信社交网络的深度依赖，微信小程序建立了紧密的用户连接。凭借微信小程序这一轻应用的特殊性，帮助用户无需下载就能完成。便捷的下拉获取小程序功能，使得越来越多用户选择微信小程序垃圾分类系统解决自己的分类问题。可以说未来的互联网世界必将有更加丰富的小程序出现。1.2研究现状目前大部分用户使用的垃圾分类系统分为app、支付宝小程序、微信小程序三种类型。app型垃圾分类系统在应用商店中数量不多，下载次数也不高，后两种类型系统的用户数量都是app难以比拟的。原因可能是对于系统开发者，app开发周期长，需要技术复杂，不同系统难以同步上线，对开发者技术水平有硬性要求。从用户的角度来看app型垃圾分类系统需要占用比后两者更多的网络资源下载，还需要占据移动设备的存储资源安装，不方便使用。小程序型垃圾分类系统可以提供近乎媲美app的服务。且小程序占用资源更少，可以完美达到“随用随开”“用完即走”的效果，更能得到用户的青睐。支付宝小程序型垃圾分类系统一般被嵌入在城市服务模块中，属于政府服务小程序，个人和企业开发支付宝型垃圾分类小程序比较少。可能是由于支付宝小程序提供的官方api接口主要关于支付宝相关的商家支付服务，不能很好的提供开发者所需要的支持。在微信app中，用户可以搜索到上千种垃圾分类系统小程序。微信作为日活上亿的社交网络app,方便了小程序的传播,更能达到增加系统用户的效果。开发人员只要熟悉网页前端开发就可以很快上手微信小程序的开发设计，微信小程序可以在不同系统的手机上同步上线，方便了系统上线和更新。用户对于微信下拉显示小程序的功能接受度高，也习惯了搜索相关服务小程序，让每个小程序都有机会被使用，增加新的用户。1.3本系统主要工作本系统采用微信小程序框架MINA作为开发框架，使用WXML、WXSS、JS作为开发语言，采用云开发实现系统的数据存储，图像识别等api调用等功能，使用微信开发者工具进行开发，实现“家中分好类”、“定时扔下楼”、“定点精确投”的基础需求。具体实现功能如下：垃圾分类条目的文字搜索、百度AI智能拍照识别、智能助理问询四种垃圾知识学习、缺失垃圾条目数据添加校园内垃圾桶信息查看1.4论文结构本文主要分六章。各章具体内容如下：第一章绪论，主要介绍本文研究背景和现状，简单概括系统主要工作和论文结构。第二章系统技术分析，叙述说明垃圾分类系统所用到的开发技术和工具，主要采用微信官方框架MINA，WeUI作为项目的UI框架，数据库采用小程序云开发·云数据库。第三章需求分析，对本系统的系统架构和数据库设计进行需求分析。第四章系统设计,介绍小程序创建过程，分别介绍系统分类、识别、垃圾桶模块的实现过程。对主要代码进行说明。第五章系统测试，真机和电脑分别对系统进行调试，测试各个模块是否能够正常使用第六章结论，得出结论，展望系统未来前景第二章系统技术分析本章对本垃圾分类系统用到的开发技术进行介绍，简单介绍系统选用的技术和选用相关技术的原因。2.1微信小程序框架 熟悉网页开发就可以迅速上手小程序开发，两者有着极大的相似性，开发者可以毫不费力地将网页移植到微信小程序中。为与网页开发类似，小程序主要使用的开发语言是JavaScript。在网页开发过程中，网页脚本线程有时会造成网页界面阻塞，或是进程阻塞的情况。为避免这种情况，在微信小程序中，渲染层和逻辑层被放在不同的线程中进行。这种方式也加快了小程序的渲染和运行速度。在微信小程序种WXML模板和WXSS样式工作在渲染层，JS脚本工作在逻辑层。图2.1微信小程序的目录架构图2.1微信小程序的目录架构主体文件如图2.1所示，app.js、app.json、app.wxss作为主体文件决定小程序的全局框架。app.js负责小程序的生命周期。在小程序开发过程中，需要制定小程序的生命周期函数，如onLaunch(监听小程序初始化)、onShow(监听小程序由后台进入前台)、onHide（监听小程序收起），这时就要采用app.js用来定义。app.js同样用来定义函数的使用和程序中的全局数据。app.wxss和网页设计中的css类似，app.wxss负责小程序的全局样式渲染，页面文件pages中的页面样式优于全局样式展示。app.json文件用来设置小程序中的5个功能：配置页面路径，配置窗口表现，配置标签导航，配置网络超时，配置debug模式。页面文件 页面文件由js文件、wxml文件、wxss文件、json文件构成， 和网页开发类似，js负责页面的逻辑层，wxml负责页面的视图层，wxss负责对页面进行渲染辅助wxml显示页面效果。微信小程序特有的json文件，负责小程序页面数据的配置。2.2微信小程序常见UI框架介绍2.2.1WeUIWeUI是当前小程序开发使用最普遍的一套样式库，由微信官方团队和小程序团队为微信小程序量身设计，与微信小程序适配最好，令用户使用感更加统一。包含button、cell、dialog、progress、toast、article、actionsheet、icon等各式元素。效果比较单一，可能会缺少一定亮点。2.2.2VantWappo VantWeapp由赞移动端组件库提供，两者基于相同的视觉规范，提供一致的API接口，帮助开发者快速搭建小程序应用。组件样式分类井井有条，样式简洁美观2.2.3TaroUITaroUI是一款基于Taro框架开发的多端UI组件库。它提供基于Taro开发UI组件一套组件，可以在微信小程序，支付宝小程序，百度小程序，H5多端适配运行。提供便捷优雅的API和可灵活的使用组件。2.2.4ColorUIColorUI是一个高度自定义的Css样式库，包含了开发常用的元素和组件，元素组件之间也能相互嵌套使用。提供鲜亮的高饱和色彩，功能齐全，组件库完备。本系统选用了微信小程序的原生UI框架，它开发更简单，也更适配小程序页面，减少了不必要的开发困难。2.2数据库数据库是一种电子化的文件柜，不同数据结构有组织的集合组成数据库。数据库通常由数据库管理系统(DBMS)储存。数据库与数据库管理系统和关联程序被简称为数据库。每个数据库都设计了一个或多个API负责数据的增、删、查、改。目前被较多开发者使用的数据库有SQLServer、MySQL、Oracle等。本系统使用小程序云数据库存储，整理和分类垃圾信息。下面对小程序云数据库进行介绍。图2.2关系型数据库和文档型数据库的参照关系小程序官方为云开发提供了一种J图2.2关系型数据库和文档型数据库的参照关系数据库API由小程序端和管理端两部分构成，小程序端有着更严格的调用权限，需要管理员在管理端进行读写权限选择。开发者可在小程序内直接调用API，方便用户进行非敏感数据的操作：例如数据读取。管理端包括云函数和控制台，对于有更高安全要求的数据，可在云函数内通过服务端API进行操作。云函数的环境与小程序端完全隔离，在云函数上可以私密且安全的操作数据库。数据库API包含增、删、改、查的能力，使用API操作数据库只需三步：获取数据库引用、构造查询/更新条件、发出请求。2.3小程序云函数小程序云函数功能是腾讯云提供的无服务器环境。当开发人员使用云函数功能时，腾讯云会计算基本程序资源，例如服务器处理器，存储，网络和其他资源配置/维护，代码部署和升级。弹性扩展，负载平衡，安全升级，资源运行状况监视。开发人员必须将服务器管理交给腾讯云进行处理，无法再自定义环境或连接到服务器。云函数会自动提供部署给同一区域内的多个可用区域，以提供较高的容错能力。在执行云函数时，它会根据需求负载进行扩缩。云函数的原生功能可以自动从每天几个请求迁移到每秒数千个请求。只需为已经运行的云功能付费，即可在各种情况下确保服务可用性和可靠性，而无需手动配置或干预。如果云功能未运行，则不收取任何费用。开发人员可以调整云函数的运行时间。例如，再COSBucket下载时执行云函数，删除文件时运行云函数，使用Ckafka处理消息时执行云函数，通过SDK调用应用程序时执行云函数，将云函数设置为定期执行。开发者可以使用云函数作为COS服务的数据处理触发程序轻松实现IFTTT逻辑您还可以创建灵活的同步自动化任务来代替手动任务，轻松创建灵活且可控的软件体系结构。Serverless（无服务器）并不意味着没有服务器。使用无服务器，开发者不必担心基础资源，也不必连接到服务器，即可进行优化。只关注代码的核心，跳过复杂繁琐的基本工作。用。核心事件完全由事件或请求触发，平台会根据需要自动并行调整服务资源。无服务器提供几乎无限的容量扩展。无事件时，资源将不会运行。代码是无状态运行的，可以轻易实现快速迭代、极速部署。第三章需求分析3.1系统架构本系统由四个模块构成：垃圾识别、垃圾分类、垃圾桶位置垃圾分类系统模块图3.1.1垃圾识别模块垃圾识别模块提供文字检索、拍照识别、智能问询三种服务。用户在系统开始页面过在文本框输入垃圾信息进行检索，显示垃圾信息或相近垃圾条目供用户参考，输入非法信息会弹出提示。点击相机按钮可以获取拍照识别功能，拍照后递交给百度智能AI得到垃圾信息或相近垃圾信息列表供用户选择，选择后得到相应结果。3.1.2分类模块垃圾桶模块分别显示了四种垃圾：厨余垃圾、有害垃圾、可回收垃圾、其他垃圾。按照首字母拼音顺序对垃圾进行排序。在分类模块用户可以对需要补充的垃圾数据进行添加，再由开发者在后台决定是否添加。3.1.3垃圾桶模块垃圾桶模块通过将静态垃圾桶数据添加到数组中，在地图中显示校园内的垃圾桶位置。用户可以点击标记点获得垃圾桶信息并进行导航。3.2数据库设计垃圾的数据条目应该由垃圾编号、垃圾类型、垃圾名称、添加时间构成。所以垃圾条目的数据库设计应该包括垃圾编号id、垃圾类型sortId（1指可回收物、2指有害垃圾、3指湿垃圾、4指干垃圾）、垃圾名称name、垃圾添加时间ctime构成。表3.1product表编号名称垃圾类型添加时间idnameSortIDCtime1艾草310/25/202017:42:132棒棒糖310/25/202017:50:123白茶310/25/202017:52:144扁豆310/25/202017:51:165布丁310/25/202017:42:17同时需要考虑到用户没有识别到或检索到的垃圾情况，需要对数据库内容进行添加。但为了保持数据库的准确和整洁，应该把用户添加数据和原有垃圾数据库区分开来。此外本系统使用云数据库的免费版本，每日操作次数是有限的，大量的恶意添加会影响小程序的正常运行，所以为用户另建一个表是十分必要的。表3.2commit表编号名称垃圾类型添加时间idnameSortIDCtime1青酱34/25/202117:42:132迪迦14/25/202117:50:123奇奇蒂蒂14/25/202117:52:14如上图表3.2，在小程序端添加相应文本框或许数据，可以在云数据库中得到上述结果。第四章系统设计4.1创建AppID图4.1申请appid本系统需要用到云开发对数据库进行设计，云函数对api进行调用，测试号无法使用云开发功能进行编码。所以需要创建APPID。如图4.1所示在微信小程序注册页填写开发者信息和小程序应用方向进行注册审批，就可以得到app图4.1申请appid4.2安装开发者工具创建程序如图4.2所示，在开发者工具下载页面根据操作系统选择相应安装包，为小程序开发作准备。考虑到后续数据库和拍照识别、地图导航等功能的调用，创建程序时需要点选小程序·云开发对项目进行相关支持。图4.图4.2创建小程序4.3页面初步设计在app.json中对页面进行全局配置，在tabBar中设计系统的模块list。模块划分分为三个：“识别”“分类”“垃圾桶”，在page中添加ai、sort、trash页面对模块进行编写（见图4.3），分别在pagepath中对相关页面进行链接。代码如下所示。图图4.3Pages目录//对底部模块框进行设计，在pagePath部分进行跳转//对底部模块框进行设计，在pagePath部分进行跳转"tabBar":{"list":[{"pagePath":"pages/ai/index","text":"识别",//导入识别图片"iconPath":"images/icon_ai_default.png","selectedIconPath":"images/icon_ai.png"},{"pagePath":"pages/sort/sort","text":"分类",//导入分类图片"iconPath":"images/icon_sort_default.png","selectedIconPath":"images/icon_sort.png""selectedIconPath":"images/icon_sort.png"},{"pagePath":"pages/trash/trash","text":"垃圾桶",//导入垃圾桶图片"iconPath":"images/trash.png","selectedIconPath":"images/trash_default.png"}]},4.4识别模块设计图4.4识别模块页面识别模块被添加在pages/ai/index文件夹中，识别模块需要完成3个功能：文字检索、拍照识别和智能问询功能（如图4图4.4识别模块页面4.4.1文字检索文字检索功能为用户提供了输入垃圾名称获得垃圾种类和详细信息的方法。文字检索功能实现通过input获取用户输入的垃圾名称，用bindtap绑定触摸事件跳转到search文件中，search文件用来链接小程序数据库对文字内容进行搜索。垃圾名称被储存在云数据库中的product中，所以在设计时需要连接数据库加载相关数据，以下代码实现了连接云数据库的product集合（垃圾信息表）、搜索并展示搜索结果、跳转垃圾详情页面的功能。//连接云数据库constdb=wx.cloud.database()//连接云数据库constdb=wx.cloud.database()//对product集合进行加载onLoad:function(options){this.data.dataCount=db.collection('product').count()},name:db.RegExp({regexp:that.data.searchTxt,name:db.RegExp({regexp:that.data.searchTxt,for(vari=0;i<res.data.length;i++)若成功，将符合用户结果的字符串遍历显示出来。for(vari=0;i<res.data.length;i++)wx.showToast({title:'数据加载失败',wx.showToast({title:'数据加载失败',icon:"none"})检索成功后，用户点击获得垃圾条目或相近垃圾条目，屏幕弹出不同类型垃圾信息供用户了解（如图4.5所示）switch(parseInt(index)){//可回收switch(parseInt(index)){//可回收case1:logoImg=""break;//有害case2:logoImg=""break;图4.5弹出垃圾信息页面//湿垃圾case3:logoImg=""break;//干垃圾case4:logoImg=""break;}//可回收物弹出页面的设计{color:"#014782",bgcolor:"#e9e8e6",//可回收物弹出页面的设计{color:"#014782",bgcolor:"#e9e8e6",logo:"/images/RecycleableWaste.jpg",name:"可回收物",content:"可回收物介绍",desc:"可回收物的常见类型",action:["投放标准"],}]4.4.2图片识别图片识别功能帮助用户拍照得到垃圾信息。图片识别功能的实现，首先需要获取用户照相机权限，在index页面中利用bindtap绑定照相机图标。用户点击照相机图标后，bindtap识别事件，跳转到camera页面。camera页面用来实现拍照、调用百度识图api、canvas绘图工具处理拍照图片、编码图片路径，获取accesstoken接口功能。上传后百度识图api得到结果列表并显示在拍照页面。用户对认同的结果进行点选后，如上述文字检索所介绍，在数据库搜索相应字段，得到结果后显示垃圾详细信息。实现代码如下所示。拍照首先需要用户对摄像头进行授权。wx.getSetting({wx.getSetting({success(res){//获取摄像头权限success(){console.log('授权成功')},fail()//获取摄像机权限失败title:'提示',content:'尚未进行授权，部分功能将无法使用',wx.navigateTo({url:'camera/camera',wx.navigateTo({url:'camera/camera',})},fail()//获取摄像机权限失败title:'提示',content:'尚未进行授权，部分功能将无法使用',//拍照方法//拍照方法takePhoto(){varthat=thisif(this.data.isCamera==false){this.setData({isCamera:true,btnTxt:"拍照"})return}//拍照成功src:res.tempImagePath,//拍照失败重拍filePath:

res.tempFilePath,

//把canvas处理后的图片路径编码

encoding:

"base64",

//若图片编码成功

得到垃圾照片后，限制照片长宽到4filePath:

res.tempFilePath,

//把canvas处理后的图片路径编码

encoding:

"base64",

//若图片编码成功

success:res=>{success:res=>{//传入百度识图that.req(that.data.accessToken,res.data)},百度AI开放平台提供了小程序所需要的图像识别功能，在百度开放平台进行注册，申请图像识别功能，获取APIKey和APISecret,在camera页面中将其传入识图网址，格式如下所示。exports.main=async(event,context)=>{exports.main=async(event,context)=>{let//写入apiKey和secrtKey完成连接apiKey='百度识图账号',grantType='client_credentials',secretKey='百度识图密码',url=`识图网址`图4.6垃圾拍照识别页面将编码后的图片上传，得到识别后的相近物体选项，在拍照页面显示列表供用户选择（如图4图4.6垃圾拍照识别页面选择后，在数据库进行检索得到结果，在页面显示垃圾类型（如图4.7所示）。图4.7图4.7识别后显示垃圾类型4.4.3智能助理如图4.8所示智能助理可以为用户提供垃圾分类讲解和闲聊娱乐功能。图图4.8智能助理功能智能助理调用了腾讯AI闲聊功能，开发者可以在腾讯开放平台中对智能助理的对话选项进行设计，以达到自己满意的效果。智能助理功能被插入在进入小程序的index页面中。用户点击按钮后，跳转到bindtap绑定的qa页面。在qa页面中完成对话的上传和接收，代码如下所示。//添加自己的IDrequestData:{//添加自己的IDrequestData:{app_id:'wx855b3f9dc5094a0d',appKey:"a7c6b56dae2189ba461a78d798f358d0",time_stamp:'',nonce_str:'',text:'',sign:''}，http.req('/fcgi-bin/nlp/nlp_textchat',{http.req('/fcgi-bin/nlp/nlp_textchat',{//输入账号app_id:this.requestData.app_id,time_stamp:this.requestData.time_stamp,nonce_str:this.requestData.nonce_str,//获取问题question:this.requestData.text,session:md5Str,sign:md5Param},4.5分类模块设计4.5.1四种垃圾模块如图图4.9分类页面SEQFigure\*ARABIC1图4.9分类页面SEQFigure\*ARABIC1用户点进不同模块可以看到按照拼音首字母排序的垃圾条目，如图4.10所示。图4.10可回收物图4.10可回收物页面用户没有发现自己需要的垃圾条目，可以点击页面下方的添加按钮，跳转至垃圾添加页面，按照指导话语添加垃圾信息，实现代码如下。varindexClick=0;//跳转到不同的垃圾类型页面switch(index){case0:indexClick=1break;case1:indexClick=2break;case2:varindexClick=0;//跳转到不同的垃圾类型页面switch(index){case0:indexClick=1break;case1:indexClick=2break;case2:indexClick=3}//在传入页面中加入sortedId wx.navigateTo({url:'/pages/ai/filter/filter?type='+indexClick,})}}//在传入页面中加入sortedId wx.navigateTo({url:'/pages/ai/filter/filter?type='+indexClick,})根据调用云数据库中的product表db.collection('product').where({//调用云数据库中的product表db.collection('product').where({//不同的垃圾类型编号sortId:parseInt(this.data.type)})4.5.1添加垃圾信息找不到自己想要的垃圾条目，可以点击分类页面的添加按钮利用bindtap跳转至添加垃圾页面commit，如图4.11所示。在识别模块中没有得到想要的结果时，同样可以跳转至这个页面。考虑到垃圾条目的准确和整洁，需要重新创建一个表commit供用户添加垃圾数据。data:{//垃圾名称"GarbageName":"",//通过sortID定义垃圾类型data:{//垃圾名称"GarbageName":"",//通过sortID定义垃圾类型"sortID":"",//垃圾条目创建时间"ctime":""},图4.11垃圾添加页面图4.11垃圾添加页面//垃圾条目创建时间"ctime":""},//向product集合添加数据addGarbage:function(res){console.log(res)varsubmitData=res.detail.valuesubmitData.sortID=Number(submitData.sortID)小程序端添加数据后，云数据库会添加相关条目。管理员可以查看后决定是否要添加到product数据库中，参与用户的垃圾检索，如图4.12所示图4图4.12云数据库信息添加成功4.6垃圾桶模块设计垃圾桶模块实现对校园内垃圾桶位置进行显示，点击标记点可以实现到垃圾位置的导航。垃圾桶模块首先要实现地图的显示，微信小程序官方提供的原生map组件实现了这一功能。在wxml页面对地图在页面中的长宽进行设计,确定地图开始的经纬度，通过include-points设置所有标记点在页面中显示，便于用户看到全部垃圾桶位置。点击垃圾桶标记，调用腾讯地图或自带地图实现导航功能。4.6.1获取当前位置并显示垃圾桶信息用户打开地图时可以看到地图上自己的位置显示和校园内垃圾桶的位置信息，实现代码如下所示。wx.openLocation({longitude:wx.openLocation({longitude:当前经度latitude:当前纬度})//集合中的垃圾桶信息{"id":1,"name":"//集合中的垃圾桶信息{"id":1,"name":"14号楼垃圾桶","longitude":"120.58342","latitude":"31.22009,"},将集合导入trash页面，利用creatMarker方法完成垃圾桶图标的添加。同时在方法中利用callout实现垃圾桶的垃圾桶名称和楼宇标注。用户可以在标注点上方观察到相应垃圾桶的信息，如“14号楼垃圾桶”。决定下一步导航要去的位置,如4.11所示。图4.11垃圾桶标点显示4.6.3图4.11垃圾桶标点显示//传入用户当前在//传入用户当前在文字校园内的位置from:{latitude:that.data.latitude,longitude:that.data.longitude},//to:传入点击的marker定位to:{latitude:weidu,latitude:weidu,longitude:jingdu},//坐标解压（返回的点串坐标，通过前向差分进行压缩）//坐标解压（返回的点串坐标，通过前向差分进行压缩）varkr=1000000;for(vari=2;i<coors.length;i++){coors[i]=Number(coors[i-2])+Number(coors[i])/kr;}//将解压后的坐标放入点串数组pl中for(vari=0;i<coors.length;i+=2){pl.push({latitude:coors[i],longitude:coors[i+1]})}//console.log(pl)console.log(that.data.address);//设置polyline属性，显示路线,解压坐标第一个数据作为起点that.setData({latitude:pl[0].latitude,//设置polyline属性，显示路线,解压坐标第一个数据作为起点that.setData({latitude:pl[0].latitude,longitude:pl[0].longitude,polyline:[{polyline:[{arrowLine:true,points:pl,color:'#3394F8',borderColor:'#3394F8',borderWidth:6,width:6}]})第五章系统测试5.1系统测试意义与目的系统测试是为了排除系统隐藏的漏洞，通过多种方式多次测试避免系统产生不符合预期的效果。系统测试需要开发者耗费打开大量时间并采用多种方式。但为了系统的准确性和稳定性系统测试是非常必要的。本次系统测试主要是考察各个模块是否能够运行成功，是否出现渲染层错误，各项信息能否正常显示数据库能否调用成功：垃圾检索是否能成功、垃圾信息的添加是否能在后台看见。图片识别，地图显示api能否成功调用。由于各个api的使用是互相穿插的，模块调试出现问题后还需要查看是哪部分api出现了问题。此外，在微信开发者工具中运行出的小程序效果和真机效果还是有一定差别的，不同品牌、不同机型都会出现显示差别。有可能会出现微信开发者工具运行成功，真机运行失败的问题。有时页面显示由于网络原因非常缓慢，会造成错过相关漏洞的情况，这也需要多次测试得到结果5.2测试过程测试分为微信开发者工具根据多种机型进行虚拟测试：iPhone12、iPhone7P、nexus6等。发现确实出现由于机型屏幕轮廓造成的页面缺失，但并不影响用户的使用。在测试分类模块的垃圾数据添加时，发现一开始的添加到原有product集合中的设计并不合理。由于小程序使用的是免费版的云数据库，一个集合一天只有500次的访问数据库机会。如果出现用户恶意添加的情况，系统的检索模块就会崩溃，无法再服务用户。所以需要新建一个集合供用户填写，开发者在后台选择性添加相关信息。5.3其他错误在开发过程中也会遇到其他一些细微完全出于粗心产生的漏洞。如api调用时需要填写正确的apiKey和apiSecret,调用api失败后一直找不到原因,反复检查代码后发现是输入错误。填写文件路径