【《基于语音识别的垃圾分类微信小程序设计》10000字（论文）】

[10]。基于上述技术易开发的特性，可以实现一个用于垃圾分类的微信小程序。3.2系统需求通过分析程序的需求，确定程序中存在两类角色，分别为管理员和用户。该程序以微信小程序的方式呈现，后台则由Java语言为主要技术进行开发。不同的角色功能也有所不同，管理员主要是对后端数据进行管理，用户功能更多的是查询垃圾分类。后台分为管理员管理、垃圾分类管理、垃圾管理、试题管理和文章管理这几个模块。管理员进行的功能主要是对数据的添加、删除、编辑以及查询。可以进行增删改查的数据有管理员、垃圾分类、垃圾、试题和文章；用户可以进行的操作有：拍照识别、语音识别以及文字检索方式来搜索垃圾；试题测试，可以有效的测试出用户对于垃圾分类知识的掌握情况；专题模块，主要是对不同的专题内容进行针对性查询，大大便利了某一类垃圾的分类。涨知识模块，可以给用户多科普一些垃圾分类的知识，以及机器人自助回答相关知识的操作。3.3系统用例图由程序需求可知，本系统中存在两类角色分别为：管理员、用户，针对角色的功能进行不同的功能设计。系统用例图如图3-1所示。图3-1系统用例图3.4系统功能图基于的垃圾分类微信小程序，管理员登录后可以进行的操作有:对管理员、垃圾分类、垃圾、试题和文章分别进行管理。用户按功能大致分为指南、测试、专题、涨知识、机器人这五个功能模块。其中指南模块包括语音识别、拍照识别和文字搜索的功能。系统功能图如图3-2所示。图3-2系统功能图4系统设计4.1功能设计本系统按照调研好的系统需求分别做了小程序端和后台控制端，且有管理员和用户两个角色。后台：管理员填写正确的账号、密码和验证码经数据库校验成功后即可登录到垃圾分类系统的后端管理页面，管理员进行的功能主要是对数据的添加、删除、编辑以及查询。可以进行增删改查的数据有管理员、垃圾分类、垃圾、试题和文章；小程序端：小程序端有指南、测试、专题、涨知识、机器人这五个功能模块；在指南模块中可以采用拍照、上传本地相册、语音以及文字的形式来检索垃圾；试题模块，用户进行垃圾分类相关知识的答题，答题结束会显示用户分数、答题情况以及正确答案。4.2页面设计4.2.1登录页面设计系统的登录页面主要由css样式完成页面背景及布局，其中包含用于填写账号和密码的输入框、根据验证码验证的输入框以及登录按钮组成。管理员在登录页面输入正确的账号、密码和验证码，经数据库校验成功后即可进入系统，若账号、密码和验证码不对应，会弹出相应提示框提示登录失败。如图4-1所示为系统登录页面设计图。图4-1登录页面设计图4.2.2系统后台设计系统后台主要由三大板块组成：头部由系统名、已登录的管理员组成；左侧的菜单栏可以很直观的看到管理员的所有功能；点击左侧菜单栏的功能会在子页面中展开。如图4-2所示为系统后台设计图。图4-2系统后台设计图4.2.3小程序端设计小程序端主要由三大板块组成：头部由系统名、搜索栏组成；中间部分用来显示每个操作打开的对应页面；底部相当于菜单栏的功能，显示了用户所能体验的所有功能。如图4-3所示为小程序端设计图。图4-3小程序端设计图4.3数据库设计4.3.1数据库E-R图设计出一个优良的数据库有利于系统更好的实现，通过MySQL对数据的合理存储可以降低数据冗余，对系统开发有着很大益处。要想系统功能得到很好的实现，就需要对他的功能进行一个合理且有效的规划。首先确定系统的实体集、联系集及属性，然后通过一个整体的ER图来进行说明。如图4-4所示为系统数据库E-R图。图4-4数据库E-R图4.3.2数据库逻辑设计(1)管理员表(admin)，如表4-1所示。表4-1admin表字段名字段类型字段长度字段约束字段解释dbidint11PRIMARYKEY管理员账号loginIdvarchar32用户名passwordvarchar64密码statusint11管理员状态(2)文章表(article)，如表4-2所示。表4-2article表字段名字段类型字段长度字段约束字段解释dbidint11PRIMARYKEY管理员账号titlevarchar200题目contenttext0内容createTimevarchar32创建时间(3)垃圾种类表(category)，如表4-3所示。表4-3category表字段名字段类型字段长度字段约束字段解释dbidint11PRIMARYKEY管理员账号namevarchar20种类名称imgvarchar255种类图片desguideorder_varchartextint255011种类描述种类指导排序(4)垃圾表(rubbish)，如表4-4所示。表4-4rubbish表字段名字段类型字段长度字段约束字段解释dbidint11PRIMARYKEY管理员账号namevarchar20垃圾名称categortIdint11垃圾的分类hotvarchar50热门程度(5)试题表(question)，如表4-5所示。表4-5question表字段名字段类型字段长度字段约束字段解释dbidint11PRIMARYKEY管理员账号namevarchar150试题名称avarchar150A选项bvarchar150B选项cvarchar150C选项danswervarcharvarchar1505D选项试题答案5系统实现5.1管理员登录如图5-1所示为管理员登录界面，账号默认为admin，用户输入正确的账号、密码和验证码经数据库比对正确后将跳转到如图5-2所示界面。若比对失败则跳转到如下图5-3所示的页面，提示框会提示哪一项输入不正确。图5-1登录页面图5-2登录成功页面图5-3登录失败提示5.2管理员管理5.2.1增加管理员按照系统的需求分析设计了管理员注册页面，输入合理的账号名和密码后点击提交就会弹出如下图5-4所示的创建成功的提示。图5-4注册页面5.2.2查询管理员信息管理员登录成功后就会跳转到后台管理页面，在左侧菜单栏中点击管理员管理即可进入如图5-5所示的页面，页面顶部设有一个文本框，右侧有查询和添加管理员按钮。在搜索栏中输入管理员账号，可以通过对管理员名称进行模糊查询来查询相关信息，如图5-6所示我们输入“ad”查询到的管理员为“admin”。 图5-5管理员管理主页面图5-6查询某管理员5.2.3修改管理员信息管理员登录成功后就会跳转到后台管理页面，在管理员信息列表的菜单栏中找到操作下的编辑按钮，即可进入到修改管理员信息的界面，修改后点击提交，如图5-7所示为修改管理员信息成功后弹出的提示。图5-7修改管理员个人信息5.2.4删除管理员管理员登录成功后就会跳转到后台管理页面，在管理员信息列表的菜单栏中找到操作下的删除按钮，点击后会出现是否确认删除管理员的提醒框，点击确认则删除成功，取消则返回当前页面。删除管理员如图5-8所示。图5-8删除管理员5.3垃圾分类管理5.3.1查询垃圾分类管理员登录成功后就会跳转到后台管理页面，可以查看垃圾分类相关板块的信息。其中垃圾分类板块包括：图片、名称、概述、指导、排序和操作。如图5-9所示为垃圾分类主页面，可以直观的观察到垃圾分类的详细信息。在右侧子页面的文本框中输入想要查询的垃圾分类后点击查询按钮，即可显示出该分类的相关信息，并且支持模糊查询。如图5-10所示输入“其他”查询到的垃圾分类为“其他垃圾”。图5-9垃圾分类主页面图5-10查询垃圾分类的信息查询管理员垃圾的分类相关内容核心代码如下：publicList<HashMap<String,Object>>query(intpageNum,intpageSize,Map<String,Object>map){ if(pageSize>0){ map.put("pu",newPageUtil<>(pageNum,pageSize)); } returnthis.categoryMapper.query(map); }5.3.2添加垃圾分类管理员登录成功后就会跳转到后台管理页面，可以实现添加垃圾的分类的图片、名称、概述、指导和排序。例如：管理员在垃圾分类主页面的菜单栏中找到添加按钮，即可进入垃圾分类的新增页面，填入相应内容并保存，如图5-11所示为添加垃圾成功后弹出的提示。图5-11添加垃圾的分类添加垃圾的分类相关内容核心代码如下：publicintinsert(Categoryentity){ returnthis.categoryMapper.insert(entity); }5.3.3修改垃圾分类管理员登录成功后就会跳转到后台管理页面，可以修改垃圾的分类名称、对此垃圾分类的描述、指导信息、图片和当前分类排序。例如：管理员在垃圾分类主页面的菜单栏中找到操作下的编辑按钮，就会跳转到该垃圾分类的修改页面，如图5-12所示修改后点击提交就会弹出修改成功的提示。图5-12修改垃圾种类修改垃圾的分类相关内容核心代码如下： publicintupdate(Categoryentity){ returnthis.categoryMapper.update(entity); } publicCategoryfindByDbid(intdbid){ returncategoryMapper.findByDbid(dbid); }5.3.4删除垃圾分类管理员登录成功后就会跳转到后台管理页面，可以删除垃圾种类。其中垃圾种类相关板块包括：图片、名称、概述、指导、排序。例如：管理员在垃圾分类主页面的菜单栏中找到操作下的删除按钮，将会跳出提示框询问是否确认删除，点击确认后即可成功删除，取消则返回当前页面。所图5-13所示为删除垃圾分类的删除提示。图5-13删除垃圾种类修改垃圾的分类相关内容核心代码如下：publicintdelete(Map<String,Object>map){ returnthis.categoryMapper.delete(map); }5.4垃圾管理5.4.1查询垃圾管理员登录成功后就会跳转到后台管理页面，点击左侧菜单栏中的垃圾管理就会在右侧显示出垃圾的名称、分类和热门程度这些信息，如图5-14所示。查询垃圾信息如图5-15所示，在搜索栏中输入垃圾的名称如“鼠标”，即可查询出“鼠标”的相关信息。图5-14垃圾管理主页面图5-15查询垃圾信息查询垃圾功能的核心代码如下：publicList<HashMap<String,Object>>query(intpageNum,intpageSize,Map<String,Object>map){ if(pageSize>0){ map.put("pu",newPageUtil<>(pageNum,pageSize)); } returnthis.rubbishMapper.query(map);} 5.5.2添加垃圾管理员登录成功后就会跳转到后台管理页面，可以添加垃圾。其中垃圾的信息包括：垃圾名称、分类、热门程度。例如：管理员在垃圾主页面的菜单栏中找到添加按钮，即可进入垃圾的新增页面，填入相应内容并保存，如图5-16所示为添加垃圾成功跳出的提示。图5-16添加垃圾添加垃圾功能核心代码如下： publicintinsert(Rubbishentity){ returnthis.rubbishMapper.insert(entity); }5.5.3修改垃圾管理员登录成功后就会跳转到后台管理页面，可以修改垃圾的名称、分类和热门程度。例如：管理员在垃圾主页面的菜单栏中找到操作下的编辑按钮，即可进入垃圾的修改页面，所图5-17所示为管理员点击提交，正确修改后弹出的提示。图5-17修改垃圾修改垃圾核心代码如下：publicintupdate(Rubbishentity){ returnthis.rubbishMapper.update(entity); } publicRubbishfindByDbid(intdbid){ returnrubbishMapper.findByDbid(dbid); } publicRubbishfindByName(Stringname){ returnrubbishMapper.findByName(name); }5.5.4删除垃圾管理员登录成功后就会跳转到后台管理页面，可以删除垃圾。其中垃圾相关板块包括：垃圾名称、分类、热门程度和操作。例如：管理员在垃圾主页面的菜单栏中找到操作下的删除按钮，如图5-18所示为点击删除后跳出的提示，点击确认后即可成功删除，点击取消则返回当前页面。图5-18删除垃圾删除垃圾核心代码如下：publicintdelete(Map<String,Object>map){ returnthis.rubbishMapper.delete(map); }5.6试题管理5.6.1查询试题管理员登录成功后就会跳转到后台管理页面，可以查看试题的问题、ABCD四个选项以及试题答案。试题主页面如图5-19所示。在搜索栏中输入试题的名称即可查询，如图5-20所示我们搜索名称为“指甲”的试题。图5-19试题主页面图5-20查询试题查询试题核心代码如下：publicList<HashMap<String,Object>>query(intpageNum,intpageSize,Map<String,Object>map){ if(pageSize>0){ map.put("pu",newPageUtil<>(pageNum,pageSize)); } returnthis.questionMapper.query(map); }5.6.2添加试题管理员登录成功后就会跳转到后台管理页面，可以添加试题的问题、ABCD四个选项以及答案。例如：管理员在试题主页面的菜单栏中找到添加按钮，即可进入试题的新增页面，填入相应内容并保存，如图5-21所示为添加试题成功弹出的操作。图5-21添加试题添加试题核心代码如下：publicintinsert(Questionentity){ returnthis.questionMapper.insert(entity); }5.6.3修改试题管理员登录成功后就会跳转到后台管理页面，可以修改试题的问题、ABCD四个选项以及答案。例如：管理员在试题主页面的菜单栏中找到操作下的编辑按钮，即可进入试题的修改页面，修改完成后点击提交会跳出修改成功的操作，这时候我们已经成功修改了试题“测试2”，如图5-22所示。图5-22修改试题修改试题核心代码如下： publicintupdate(Questionentity){ returnthis.questionMapper.update(entity); } publicQuestionfindByDbid(intdbid){ returnquestionMapper.findByDbid(dbid); } publicQuestionfindByIndex(intindex){ returnquestionMapper.findByIndex(index); }5.6.4删除试题管理员登录成功后就会跳转到后台管理页面，可以删除试题。其中试题相关板块包括：问题、ABCD选项、答案以及操作。例如：管理员在试题主页面的菜单栏中找到操作下的删除按钮，将会跳出提示框询问是否确认删除，点击确认后即可成功删除，取消则返回当前页面。删除试题如图5-23所示。图5-23删除试题删除试题核心代码如下：publicintdelete(Map<String,Object>map){ returnthis.questionMapper.delete(map);}5.7文章管理5.7.1查询文章管理员登录成功后就会跳转到后台管理页面，可以查看文章的标题、内容以及创建时间。如图5-24所示，管理员点击左侧菜单栏文章管理就可以对文章进行操作。如图5-25所示，我们在搜索栏中输入“电池”即可根据文章名称模糊查询出两篇文章。图5-24文章主页面图5-25查询文章查询文章核心代码如下：publicList<HashMap<String,Object>>query(intpageNum,intpageSize,Map<String,Object>map){ if(pageSize>0){ map.put("pu",newPageUtil<>(pageNum,pageSize)); } returnthis.articleMapper.query(map); }5.7.2添加文章管理员登录成功后就会跳转到后台管理页面，可以添加文章。其中可以添加文章的信息有：标题和内容。例如：管理员在文章主页面的菜单栏中找到添加按钮，即可进入文章的新增页面，填入相应内容并保存，如图5-26所示为成功添加文章所跳出的提示。图5-26添加文章添加文章核心代码如下：publicintinsert(Articleentity){returnthis.articleMapper.insert(entity);}5.7.3修改文章管理员登录成功后就会跳转到后台管理页面，可以修改文章。其中可以修改文章的信息有:标题和内容。例如：管理员在文章主页面的菜单栏中找到操作下的编辑按钮，如图5-27所示为管理员点击提交后成功修改所跳出的提示。图5-27修改文章修改文章核心代码如下：publicintupdate(Articleentity){ returnthis.articleMapper.update(entity);}publicArticlefindByDbid(intdbid){ returnarticleMapper.findByDbid(dbid);}5.7.4删除文章管理员登录成功后就会跳转到后台管理页面，可以删除文章。其中文章相关板块包括文章标题、内容、创建时间以及操作。例如：管理员在文章主页面的菜单栏中找到操作下的删除按钮，将会跳出提示框询问是否确认删除，点击确认后即可成功删除，取消则返回当前页面。删除文章如图5-28所示。图5-28删除文章删除文章核心代码如下：publicintdelete(Map<String,Object>map){ returnthis.articleMapper.delete(map); }5.8指南功能用户进入小程序端，点击指南功能模块，其中指南模块包括：语音识别、拍照识别、文字搜索、分享等功能。小程序的指南模块主页面如图5-29所示。图5-29小程序的指南模块主页面5.8.1语音识别用户说出想要搜索的垃圾，小程序会检测语音内容转换成文字进行垃圾搜索。如图5-30所示用户录入语音“鼠标”搜索到它属于可回收物。图5-30语音识别的功能演示语音识别核心代码如下：//语音识别varbaiduBccessToken=wx.getStorageSync("baidu_yuyin_access_token");vartempFilePath=res.tempFilePath;constfs=wx.getFileSystemManager();fs.readFile({filePath:tempFilePath,success(res){constbase64=wx.arrayBufferToBase64(res.data);varfileSize=res.data.byteLength;wx.request({url:'/server_api',data:{format:'pcm',rate:16000,channel:1,cuid:'sdfdfdfsfs',token:baiduBccessToken,speech:base64,len:fileSize},method:'POST',header:{'content-type':'application/json'//默认值},success(res){wx.hideLoading();console.log(res.data);if(res.data.err_no!=0){that.showToast("识别错误!");return;}5.8.2拍照识别用户拍照或上选择本地图片，小程序会检测图片中的内容来判断都是什么物品从而判断该垃圾属于什么分类，如图5-31所示为拍照识别该物品为“鼠标”，搜索到它属于可回收物。图5-31拍照识别的功能演示拍照识别核心代码如下：//转到拍照页面

toCameraPage:

function

(e)

{

wx.chooseImage({

count:

1,

sizeType:

['original',

'compressed'],

sourceType:

['album',

'camera'],

success(res)

{

var

tempFilePaths

=

res.tempFilePaths;

wx.navigateTo({

url:

'/pages/camera_result/camera_result',

success:

function

(res)

{

//

通过eventChannel向被打开页面传送数据

res.eventChannel.emit('acceptDataFromOpenerPage',

{

data:

tempFilePaths

})

}

})

}

})

},5.8.3文字搜索用户打字输入想要搜索的垃圾，从数据库中读取，显示出该垃圾的具体信息。文字搜索功能演示如图5-32所示。图5-32文字搜索的功能演示文字搜索核心代码如下：//转到搜索页面toSearchPage:function(e){wx.navigateTo({url:'/pages/search/search'})},5.9测试功能用户进行对垃圾分类知识的答题，答题结束后显示得分和答题情况，若分数不理想用户可选择再考一次。测试题目如图5-33所示。测试结果如图5-34所示。图5-33测试答题的功能演示图5-34测试结果的演示测试功能核心代码如下：

onLoad:

function()

{

var

that

=

this;

that.createSelects();

},

radioChange:

function(e){

var

that

=

this;

var

currentQuestion

=

that.data.currentQuestion;

currentQuestion.myanswer

=

e.currentTarget.dataset.value;

that.setData({questions:

that.data.questions});

that.nextQuestion();

},5.10专题功能用户可针对不同专题进行不同垃圾的分类进行查询，专题主页面的演示如图5-35所示。单个专题的演示如图5-36所示。图5-35专题主页面的演示图5-36单个专题的演示专题功能核心代码如下：onLoad:function(){varthat=this;that.createSelects();},radioChange:function(e){varthat=this;varcurrentQuestion=that.data.currentQuestion;currentQuestion.myanswer=e.currentTarget.dataset.value;that.setData({questions:that.data.questions});that.nextQuestion();},5.11涨知识功能涨知识模块相当于科普功能，可以让用户在闲暇之余点开浏览，具有很强的趣味性。涨知识主页面的演示如图5-37所示。单个涨知识的演示如图5-38所示。图5-37涨知识主页面的演示图5-38单个涨知识的演示涨知识功能核心代码如下：onLoad:function(){varthat=this;that.loadMore();},5.12机器人功能用户可以和机器人进行对话，向其询问一些有关于垃圾分类的知识，该模块是一个自助问答的模块。机器人模块功能演示如表5-39所示。图5-39机器人模块的演示机器人功能核心代码如下：submit:function(e){varthat=this;varobj={};obj.speaker='right';obj.content=that.data.content;varlist=that.data.list;list.push(obj);that.setData({list:list});6系统测试对于开发人员，系统测试毫无疑问是一个至关重要也必不可少的环节。编写程序中不可避免会出现一些细节上的小问题，通过系统测试我们就能很方便的找到系统的缺陷在哪儿并具有针对性的加以改正。系统测试可以很好的保证系统质量和可靠性。系统并不是在程序完成后才进行的，而应该边编写程序边测试，尽早的发现错误并改正。6.1登录功能测试管理员进入系统前需要先登录，输入的账号密码与数据库校验一致且验证码输入正确则登录成功。登录功能测试如表6-1所示。表6-1登录测试结果测试功能用户输入正确结果测试结果能否正常登录账号密码验证码均正确登录成功正确登录表单校验账号或密码或验证码未填写提示输入账号或密码或验证码正确错误账户登录账号或密码或验证码填写错误提示账号或密码或验证码不正确正确6.2管理员管理功能测试管理员登录成功后可对管理员用户进行操作。管理员管理功能测试如表6-2所示。表6-2管理员管理测试结果测试功能用户输入正确结果测试结果显示基本信息点击管理员信息成功显示管理员信息正确修改基本信息点击修改按钮提示修改成功正确添加管理员用户删除管理员用户点击添加按钮点击删除按钮提示添加成功提示删除成功正确正确6.3垃圾分类管理功能测试管理员登录成功后可对垃圾的分类进行操作。垃圾分类管理功能测试如表6-3所示。表6-3垃圾分类管理测试结果测试功能用户输入正确结果 测试结果显示基本信息点击垃圾分类信息成功显示垃圾分类信息正确修改基本信息点击修改按钮提示修改成功正确添加基本信息删除基本信息点击添加按钮点击删除按钮提示添加成功提示删除成功正确正确6.4垃圾管理功能测试管理员登录