更新记录

v1.1（2024-11-22）

代码更新

v1.0（2024-11-22）

更新界面

平台兼容性

云函数类插件通用教程

使用云函数类插件的前提是：使用HBuilderX 2.9+

基于大模型的-垃圾分类AI

很久没有在掘金上写东西了。今天把去年写的一个大模型的小项目拿出来凉一凉，写几句话记录一下。 基本内容就是了一个被做烂的垃圾分类小程序。其实之垃圾分类刚开始时候就想着做一个，但是很快看到有人做了，就作罢了。而且怎么根据文字判断它是什么垃圾，说实话还是比较麻烦的。不过最近两年大模型这么火，让它来做这件事儿太合适不过了。 先来看一下效果吧。

体验小程序

看完了感觉怎么样，还行是吧。 说一下基本实现原理：

使用百度的AI大模型，识别出图片中内容，是纸盒子还是水果皮，是手机，电池，还是医疗废弃物等等。但是这一步仅仅是识别物体是个什么东西，还没办法分类，不知道他是什么垃圾！ 所以第二步，就是将识别结果传给大模型进行语义分析，判断是什么垃圾类型。 关键点就在于提示词怎么写，只有好的提示词，才能得到理想的结果。我是这么写的：

const res = await llmManager.chatCompletion({
        messages: [{
                role: "system",
                content: `请根据输入的[物体],判断是什么垃圾类别。
                类别包括：可回收物、有害垃圾、湿垃圾、干垃圾。
                1、有害垃圾有：废镍镉电池和废氧化汞电池、废荧光灯管、废药品及其包装物、废油漆和溶剂及其包装物等；
                2、湿垃圾有：食材废料、剩菜剩饭、过期食品、瓜皮果核等；
                3、可回收物有：废纸张、废塑料、废玻璃制品、废金属等；
                4、干垃圾有：除三种类别外的垃圾，类别分辨不清的垃圾等。
                结果只需要回复“垃圾类别”即可，不要擅自回复额外的内容。
                `
            },
            {
                role: "user",
                content: `餐巾纸`
            },
            {
                role: "assistant",
                content: `干垃圾`
            },

            {
                role: "user",
                content: `玻璃瓶`
            },
            {
                role: "assistant",
                content: `可回收物`
            },

            {
                role: "user",
                content: `火锅汤底`
            },
            {
                role: "assistant",
                content: `湿垃圾`
            },
            {
                role: "user",
                content: thing
            },

        ],
        tokensToGenerate: 1024,
    })

告诉她做什么，垃圾分类，垃圾有哪些分类，举例说明。然后再通过几轮对话训练一下。最后一轮对话，传入百度识别的物体，它就会判断出这是个什么类型的垃圾了。 由于大模型经常会擅自返回一些额外的内容，所以我加了这么一句：结果只需要回复“垃圾类别”即可，不要擅自回复额外的内容。 解雇正面还是比较有用的。经过多次测试，都能直接得到垃圾类型，而不会随意发挥。

修改配置

1、App.vue 程序启动，获取百度AI接口token

    import getToken from './utils/gettoken.js'
    export default {
        onLaunch: function() {
            console.log('App Launch')

            // 程序启动，立即获取token
            getToken()
        },
        onShow: function() {
            console.log('App Show')
        },
        onHide: function() {
            console.log('App Hide')
        }
    }

2、修改store/index.js 在 store/index.js中，请求百度AI的图像识别接口。 不过首先需要去注册一个账号，注册地址：https://ai.baidu.com/

然后到应用列表找到 API Key 和 Secret Key

然后将.env中的VITE_API_KEY 和 VITE_API_SECRET替换为自己的:

VITE_API_KEY = 
VITE_API_SECRET =

3、修改大模型配置

语义识别判断使用了uni-ai,详细使用方法查看这两个文档：

uni-ai 开发文档：https://en.uniapp.dcloud.io/uniCloud/uni-ai.html uni-ai计费网关开通流程 ：https://en.uniapp.dcloud.io/uniCloud/uni-ai-buy.html#enable-uni-ai-service

我使用的是minimax，打开云函数 uniCloud/cloudfuncitons/garbage/index.js

将上面的apiKey 和groupId替换成你自己的值。

如果没有的话，可以去注册一个。地址：https://platform.minimaxi.com/

注册好了之后，在账户管理页获得groupId:

然后在接口密钥中创建一个密钥：

有了密钥，就可以替换上面的apiKey 和groupId了。

4、配置微信AppId

如果要在微信小程序运行，一定要配置AppId。这个你需要自己去注册一个微信小程序账号，然后登陆微信小程序后台，在开发管理->开发设置 下找到AppID。

复制这个AppID,回到Hbuilder，项目根目录找到manifest.json，打开这个文件，找到微信小程序配置：

5、配置微信开发者工具

在Hbuilder中点击运行到微信开发者工具

如果你运行不起来，可能是微信开发者工具没有安装，如果安装了可能是没有配置启动地址，点击 运行->运行到小程序模拟器->运行设置：

然后配置你的小程序开发工具地址：

之后再运行就会启动了。

如果依然启动不了，则需求在微信开发中工具中配置服务端口，启动微信开发者工具，设置，安全，服务端口，打开。

6、服务器域名

启动成功之后，就可以看到如下页面了

如果只是要在本地测试一下，建议先把不校验合法域名这一项打上勾。位置在右上角，详情->本地设置->不校验合法域名

如果要发布到小程序上，那么需要在小程序后台配置服务器域名：

具体域名列表如下：

https://aip.baidubce.com
https://api-cn.faceplusplus.com
https://api.next.bspapp.com
https://fc-mp-902d8637-0213-49b1-886c-f8c67ae1f3fa.next.bspapp.com
https://file-uniwkerxgq-mp-902d8637-0213-49b1-886c-f8c67ae1f3fa.oss-cn-zhangjiakou.aliyuncs.com

7、测试一下

点击 拍照识别按钮，会弹框让你选择一张图片，如果是在手机上测试，你可以使用手机摄像头拍照获取图片。

图片选择完了，会将图片发送给百度识别，识别结果会传给大模型，判断是什么垃圾，最后将结果展示出来：

也可以使用搜索功能，点击放大镜图标，在输入框中输入关键字，

大模型会根据输入的内容判断垃圾类型：

最下方是垃圾分类的知识测试题：

一共10道题，每题四个选项，最后根据大题结果展示得分。

还可以将结果分析给其他人，点击分享成绩，会使用画布生成一张带本小程序的二维码的图片，你可以将图片发朋友圈，实现裂变传播。