基于springboot+vue调用百度ai实现车牌号识别功能

百度车牌号识别官方文档

结果视频演示

后端代码

private String getCarNumber(String imagePath, int count) {
        // 请求url
        String url = "https://aip.baidubce.com/rest/2.0/ocr/v1/license_plate";
        try {
            byte[] imgData = FileUtil.readFileByBytes(imagePath);
            String imgStr = Base64Util.encode(imgData);
            String imgParam = URLEncoder.encode(imgStr, "UTF-8");

            String param = "image=" + imgParam;

            String result = HttpUtil.post(url, accessToken, param);
            log.info("车牌号识别结果,result:{}", result);
            JSONObject resultObj = JSONObject.parseObject(result);
            JSONObject wordsResult = resultObj.getJSONObject("words_result");
            return wordsResult.getString("number");
        } catch (Exception e) {
            log.error("车牌号识别异常,图片地址:{}", imagePath);
            log.error(e.getMessage(), e);
            if (count >= 3) {
                log.error("车牌号识别异常,已重试{}次,强制退出", count);
                return "";
            }
            try {
                Thread.sleep(200);
            } catch (InterruptedException ex) {
                throw new RuntimeException(ex);
            }
            count ++;
            return getCarNumber(imagePath, count);
        }
    }

前端代码

<el-row :gutter="10">
		<el-col :span="24">
			<el-upload
			    class="upload-demo"
			    drag
			    :action="carNumberAction"
				accept="image/*"
				list-type="picture"
				:on-success="uploadSuccess"
			  >
			    <el-icon class="el-icon--upload"><upload-filled /></el-icon>
			    <div class="el-upload__text">
			      Drop file here or <em>click to upload</em>
			    </div>
			    <template #tip>
			      <div class="el-upload__tip">
			        jpg/png files with a size less than 500kb
			      </div>
			    </template>
			  </el-upload>
		</el-col>
		<el-col :span="24">
			<p style="text-align: center; font-size: 30px; font-weight: bold;">车牌号码为:{{carNumber}}</p>
		</el-col>
	</el-row>
let carNumber = ref('xxxx')

const uploadSuccess = async (response, uploadFile, uploadFiles) => {
	if (response.code !== 0) {
		proxy.msg.error(response.msg)
		return
	}
	carNumber.value = response.data
}

运行结果

视频演示

基于springboot+vue调用百度api的车牌号识别功能

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/490819.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【如何安装odl: 1.0.0.dev0】

【如何安装odl: 1.0.0.dev0】 ODL官网 pip install odl可能容易报错&#xff0c;建议使用下述命令安装 pip install https://github.com/odlgroup/odl/archive/master.zip检查是否安装成功 conda list

练习二 霍格沃兹登录页面

1.html <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>教务系统管理页面</title><link rel"stylesheet" href"./教务管路系统页面.css"> </head> <body&g…

Spring Data Elasticsearch 与ES版本对应关系记录

参考&#xff1a; Versions :: Spring Data Elasticsearch

cpp第二次作业

现象&#xff1a; 源码&#xff1a; #include <iostream>using namespace std;class Rectangle{ private:int length;int width; public:void set_l(int l);void set_w(int w);int get_l();int get_w();void show(); };void Rectangle::set_l(int l) {lengthl; }void Re…

javaWeb健康管理系统

一、引言 1.1 设计背景 紧张的工作节奏、教学和科研的压力、个人不良的工作生活习惯、以及伴随工作压力而来的家庭关系、人际关系紧张等因素使得高校群体成为慢性病的高发群体[1]。学生入学的定期体检&#xff0c;教职工人入职体检&#xff0c;以及所有学生和教职工的定期体检…

使用小皮【phpstudy】运行Vue+MySql项目

现在的情况是我扒到了一个开源的项目&#xff0c;现在想要实现一下前端对应的功能&#xff0c;后端是完备的&#xff0c;但是需要调用数据库将数据跑起来&#xff0c;这里可以使用到MySql数据库&#xff0c;这里我还发现了一个比较好用的软件小皮【phpStudy】 官网 一 安装软件…

前端面试拼图-数据结构与算法(二)

摘要&#xff1a;最近&#xff0c;看了下慕课2周刷完n道面试题&#xff0c;记录下... 1. 求一个二叉搜索树的第k小值 二叉树(Binary Tree) 是一棵树 每个节点最多两个子节点 树节点的数据结构{value, left?, right?} 二叉树的遍历 前序遍历&#xff1a;root→left→right 中…

ArcGIS:焦点统计权重weight的设置方法

ArcGIS中的焦点统计可以用于计算指定邻域大小内的统计值&#xff0c;并重新赋给中心像元。其中可以通过未邻域内每个元素赋权重新计算&#xff0c;下面介绍下如何设置核文件。 1、新建一个txt文件 2、在txt里面写好权重&#xff0c;按照ArcGIS里面的帮助&#xff0c;3*3窗口如…

树和森林解析

01.下列关于树的说法中&#xff0c;正确的是&#xff08;D). Ⅰ.对于有n个结点的二叉树&#xff0c;其高度为log2n Ⅱ.完全二叉树中&#xff0c;若一个结点没有左孩子&#xff0c;则它必是叶结点 Ⅲ.高度为h (h>0)的完全二叉树对应的森林所含的树的个数一定是h IV.一棵树中的…

Python中的数据类型有四类八种如何理解?

在Python中&#xff0c;数据类型大致可以分为四大类&#xff0c;包含了八种基本的数据类型&#xff0c;这些分类有助于理解和使用Python进行编程。这四大类分别是&#xff1a; 数字类型 (Numeric Types): 整型 (int): 表示没有小数部分的整数&#xff0c;可以是正数、负数或零。…

2024年【熔化焊接与热切割】考试报名及熔化焊接与热切割找解析

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 熔化焊接与热切割考试报名考前必练&#xff01;安全生产模拟考试一点通每个月更新熔化焊接与热切割找解析题目及答案&#xff01;多做几遍&#xff0c;其实通过熔化焊接与热切割实操考试视频很简单。 1、【单选题】 下…

nandgame中的控制单元(Control Unit)

关卡说明的翻译&#xff1a; 控制单元除了ALU指令之外&#xff0c;计算机还应支持数据指令。在数据指令中&#xff0c;指令值直接写入A寄存器。创建一个控制单元&#xff0c;根据指令I的高位执行数据指令或ALU指令&#xff1a;位 15 0 数据指令 1 ALU指令ALU指令 对于ALU指令&…

一阶低通滤波

一阶低通滤波是一种信号处理技术&#xff0c;用于去除信号中高频部分&#xff0c;保留低频部分。在滤波过程中&#xff0c;一阶低通滤波器会使得高于某个截止频率的信号被衰减&#xff0c;而低于截止频率的信号则会被保留。这有助于减少噪音或者不需要的信号成分&#xff0c;从…

前端小白的学习之路(webpack)

提示&#xff1a;webpack简介&#xff0c;nvm,npm配置环境,常用命令&#xff0c;基本web项目构建 目录 webpack 1.配置环境 1)node.js node常用命令 2)nvm nvm常用命令&#xff1a; 3)npm npm常用命令 2.构建简易web项目 1)创建目录 2)安装webpack依赖 3)配置 webpac…

nandgame中的复合存储器

output部分的三个寄存器是用于校验结果的&#xff0c; 实际还得摆放寄存器A、D和RAM 然后st都是触发导通&#xff0c;cl都是触发传值&#xff0c; ad是address的缩写 *a是c语言的写法&#xff0c;a为地址&#xff0c;*a就是地址a指向位置存储的数值。

C语言之strchr用法实例(八十八)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

代码随想录算法训练营第二十天|654.最大二叉树、617.合并二叉树、700.二叉搜索树中的搜索、98.验证二叉搜索树

代码随想录算法训练营第二十天|654.最大二叉树、617.合并二叉树、700.二叉搜索树中的搜索、98.验证二叉搜索树 654.最大二叉树 给定一个不重复的整数数组 nums 。 最大二叉树 可以用下面的算法从 nums 递归地构建: 创建一个根节点&#xff0c;其值为 nums 中的最大值。递归地…

vue项目使用eletron将打包成桌面应用(.exe)

vue项目使用eletron将打包成桌面应用(.exe) 1.前期准备 两个项目&#xff1a; 1、自己用vue cli创建的项目 2、第二个是去gitee将案例clone下来 案例地址 https://gitee.com/qingplus/electron-quick-start.git 2、测试案例是否可以正常运行 # 进入项目 cd electron-quick-…

k8s入门到实战(六)—— ConfigMap介绍

ConfigMap configmap 是 k8s 中的资源对象&#xff0c;用于保存非机密性的配置的&#xff0c;数据可以用 kv 键值对的形式保存&#xff0c;也可通过文件的形式保存。 什么是 configmap 在 k8s 中&#xff0c;ConfigMap 是一种用于存储应用程序配置数据的对象。它允许将配置信…

JVM(三)——字节码技术

三、字节码技术 1、类文件结构 一个简单的 HelloWorld.java package com.mysite.jvm.t5; // HelloWorld 示例 public class HelloWorld {public static void main(String[] args) {System.out.println("hello world");} }执行 javac -parameters -d . HellowWorld.…