更新记录
v1.0.0(2024-11-18) 下载此版本
小程序发布上线,已经上线到微信小程序,搜索“垃圾识别AI”可以体验
平台兼容性
Vue2 | Vue3 |
---|---|
√ | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.92 | × | √ | × | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
× | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
× | × | × | × | × | × | × | × | × |
基于大模型的-垃圾分类AI
这个项目使用AI大模型实现了垃圾分类识别。
体验小程序
基本原理
- 使用百度的AI大模型,识别出图片中的垃圾类型。
- 将识别结果传给大模型进行语义分析,判断是什么垃圾类型
修改配置
1、App.vue 程序启动,获取百度AI接口token
export default {
onLaunch: function() {
console.log('App Launch')
// 程序启动,立即获取token
this.$store.dispatch("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
然后将 store/index.js 中的49和50行代码替换为自己的 API Key 和 Secret Key:
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道题,每题四个选项,最后根据大题结果展示得分。
还可以将结果分析给其他人,点击分享成绩,会使用画布生成一张带本小程序的二维码的图片,你可以将图片发朋友圈,实现裂变传播。