直接上代码

服务端代码如下

private static readonly Baidu.Aip.ImageClassify.ImageClassify client = new Baidu.Aip.ImageClassify.ImageClassify(ApiConfig.APIKey, ApiConfig.SecretKey);
/// <summary>
/// 植物识别
/// </summary>
/// <param name="filesrc"></param>
public PlantModel PlantDetect(string filesrc)
{
var image = File.ReadAllBytes(filesrc);
var result = client.PlantDetect(image);
return GetPlant(result);
}
/// <summary>
/// 植物识别
/// </summary>
/// <param name="serverId"></param>
/// <returns></returns>
public JsonResult PlantDetect(string serverId = "")
{
string filename = System.Web.HttpContext.Current.Server.MapPath("/Static/img/demoplant.jpg");
if (!string.IsNullOrWhiteSpace(serverId))
{
filename = GetFileName(serverId);
}
var data = imageClassify.PlantDetect(filename);
return Json(data, JsonRequestBehavior.AllowGet);
}
/// <summary>
/// 下载微信图片
/// </summary>
/// <param name="serverId">微信返回的图片的服务器端ID</param>
/// <returns></returns>
private string GetFileName(string serverId)
{
string filename = System.Web.HttpContext.Current.Server.MapPath("/upload/img/");
if (!System.IO.Directory.Exists(filename))
System.IO.Directory.CreateDirectory(filename); string date = DateTime.Now.ToString("yyyy-MM-dd");
filename += date + "/"; if (!System.IO.Directory.Exists(filename))
System.IO.Directory.CreateDirectory(filename); string guid = Guid.NewGuid().ToString();
filename += $"/{guid}.jpg"; WeixinUtility.GetVoice(serverId, filename);
return filename;
}

前端代码如下


@{
if (ViewData["type"].ToString() == "1")
{
ViewBag.Title = "植物识别";
}else if (ViewData["type"].ToString() == "2")
{
ViewBag.Title = "动物识别";
}
else if (ViewData["type"].ToString() == "3")
{
ViewBag.Title = "车型识别";
}
Layout = "~/Views/Shared/_LayoutWeUI.cshtml";
} <div class="page js_show" id="app" v-cloak>
<div class="page__bd">
<div class="weui-cells weui-cells_form">
<div class="weui-cell">
<div class="weui-cell__bd">
<img v-if="localId.length>0" :src="localId" style="max-width:300px;max-height:300px;" />
<img v-else :src="imgsrc" style="max-width:300px;max-height:300px;" />
</div>
</div>
</div>
<div class="weui-cells__title">识别结果</div>
<div class="weui-cells">
<div class="weui-cell">
<div class="weui-cell__bd">
<p>名称</p>
</div>
<div class="weui-cell__ft">置信度</div>
</div>
<div class="weui-cell" v-for="(k,index) in result">
<div class="weui-cell__bd">
<p>{{k.name}}</p>
</div>
<div class="weui-cell__ft">{{getscore(k.score)}}</div>
</div>
</div>
<div style="margin-bottom:60px;"></div>
<div style="display: flex;position: fixed;z-index: 500;bottom: 0px;width: 100%;margin: 5px 0px;">
<a class="weui-btn weui-btn_primary" href="javascript:" @@click="uploader">上传{{title}}图片</a>
</div>
</div>
</div>
@section PageJS{
<script type="text/javascript">
var app = new Vue({
el: "#app",
data: {
imgsrc: "",
localId: "",
serverId: "",
flag: 1,
recorder: null,
title: "",
url: "",
result:[]
},
mounted: function () {
var that = this;
var type =@ViewData["type"];
if (type == 1) {
this.title = "植物";
this.imgsrc = "/Static/img/demoplant.jpg";
this.url = '@Url.Action("PlantDetect", "ImageRecognition")';
}
else if (type == 2) {
this.title = "动物";
this.imgsrc = "/Static/img/demoanimal.jpg";
this.url = '@Url.Action("AnimalDetect", "ImageRecognition")';
}
else if (type == 3) {
this.title = "车型";
this.imgsrc = "/Static/img/democar.jpg";
this.url = '@Url.Action("CarDetect", "ImageRecognition")';
}
this.detect();
},
methods: {
detect() {
var that = this;
$.sunloading.show("正在识别");
$.ajax({
url: this.url,
dataType: "json",
type: "post",
data: { serverId: this.serverId },
success: function (result) {
$.sunloading.close();
console.log("识别结果:" + result);
that.result = result.result;
},
error: function (e) {
console.log(e);
}
});
},
getscore(score) {
return (score * 100).toFixed(2) + "%";
},
uploader() {
var that = this;
wx.chooseImage({
count: 1, // 默认9
sizeType: ['compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
console.log(res.localIds);
that.localId = res.localIds[0]; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
that.uploadImage();
}
});
},
uploadImage() {
var that = this;
wx.uploadImage({
localId: that.localId, // 需要上传的图片的本地ID,由chooseImage接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
that.serverId = res.serverId; // 返回图片的服务器端ID
that.detect();
}
});
}
}
});
</script>
}

运行效果如下

Git源码查看请移步https://github.com/yliml/BaiduAI/wiki

微信开发+百度AI学习:植物识别的更多相关文章

  1. 微信开发+百度AI学习:环境搭建

    注册成为百度开发者,百度接入指南http://ai.baidu.com/docs#/Begin/top 选择分类进去创建应用,接口权限全部选择好了,这样就可以只创建一个应用就有全部接口权限. C#开发 ...

  2. 微信开发+百度AI学习:微信网页开发环境搭建

    参考微信官方文档:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 两步即可获取微信网页开发能力 STEP1: ...

  3. selenium自动化 | 借助百度AI开放平台识别验证码登录职教云

    #通过借助百度AI开放平台识别验证码登录职教云 from PIL import Image from aip import AipOcr import unittest # driver.get(zj ...

  4. 利用百度AI OCR图片识别,Java实现PDF中的图片转换成文字

    序言:我们在读一些PDF版书籍的时候,如果PDF中不是图片,做起读书笔记的还好:如果PDF中的是图片的话,根本无法编辑,做起笔记来,还是很痛苦的.我是遇到过了.我们搞技术的,当然得自己学着解决现在的痛 ...

  5. 单一功能学习——百度AI之身份证识别

    以下内容基本是从官方接口文档复制过来的,附带自己封装的代码 时间:2018年4月4日 一.导入工具包 使用maven依赖: <dependency> <groupId>com. ...

  6. 基于百度AI实现 车牌识别

    前言 目前百度的AI接口相对完善,对于文字识别类的操作还需要开发者一一去尝试,去评估这效果到底是怎么的. 文字识别的接口相对简单,官方提供的SDK也集成很好,笔者只是在这上面做了一些前期性的功能数据校 ...

  7. 百度AI接口---身份证识别Demo

    题记:自己是做java web的,但是本人以前接触并学习很多图像的知识,所以对图像很敏感.下面以百度的一个接口,实现身份证识别案例 1.需要百度开发者AppID.SecretKey .API Key. ...

  8. 20-调用百度AI的文字识别

    本来准备自己写识别的,貌似现在能力不足,直接偷懒用百度的api吧 from aip import AipOcr """ 你的 APPID AK SK "&quo ...

  9. c# 利用AForge和百度AI开发实时人脸识别

    baiduAIFaceIdentify项目是C#语言,集成百度AI的SDK利用AForge开发的实时人脸识别的小demo,里边包含了人脸检测识别,人脸注册,人脸登录等功能 人脸实时检测识别功能 思路是 ...

随机推荐

  1. 第12章 Reference-RIL运行框架

    Reference-RIL完成两部分处理逻辑: 与LibRIL交互完成RIL消息的处理. 与Modem通信模块交互完成AT命令的执行. Reference-RIL的运行机制 主要涉及以下几个方面: R ...

  2. 手工创建 efi,msr 分区 · Virgil Chan

    昨天在帮同学装 win10 的时候,不小心(不知道那是什么东西)把原系统的 efi 和 msr 盘删了,用 WinNTsetup 安装时 EFI PART 总显示红叉,安装后也进不去系统,想想应该是找 ...

  3. python常用魔术方法概览

    构造和初始化 __init__(self, args) 构造函数 __new__(cls) 传入的是类实例 __del__(self) 析构函数,调用 del cls 时会被调用 属性访问控制 __g ...

  4. 文件传送协议FTP

    文件传送协议FTP 1.1.概述 文件传送协议 FTP (File Transfer Protocol) 是因特网上使用得最广泛的文件传送协议. FTP 提供交互式的访问,允许客户指明文件的类型与格式 ...

  5. IT从业者疫情之下出路何在

    作为一个IT行业十年经历的从业人员,在北京大公司工作过,但因衡量着北京大都市的繁华下高消费和高房价,选择到二线城市发展和组建家庭,由此逃离北上广,结束了数年的北漂生涯.很荣幸到了二线城市顺利遇见属于自 ...

  6. win10环境下VS2019配置NTL库

    win10环境下VS2019配置NTL库 1.下载 WINNTL库文件     https://www.shoup.net/ntl/download.html 2.创建静态库 文件->新建-&g ...

  7. 操作系统-IO管理和磁盘调度

    I/O设备 IO设备的类型 分为三类:人机交互类外部设备:打印机.显示器.鼠标.键盘等等.这类设备数据交换速度相对较慢,通常是以字节为单位进行数据交换的 存储设备:用于存储程序和数据的设备,如磁盘.磁 ...

  8. Spring Boot从入门到精通(六)集成Redis实现缓存机制

    Redis(Remote Dictionary Server ),即远程字典服务,是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,并提供多种语言 ...

  9. 编写简单i18n库

    i18n是什么?i18n(其来源是英文单词internationalization的首末字符i和n,18为中间的字符数)是"国际化"的简称. 前言 第一次接触多语言是用野生java ...

  10. React拖拽组件Dragact V0.1.7:教你优化React组件性能与手感

    仓库地址:Dragact手感丝滑的拖拽布局组件 预览地址:支持手机端噢- 上回我们说到,Dragact组件已经进行了一系列的性能优化,然而面对大量数据的时候,依旧比较吃力,让我们来看看,优化之前的Dr ...