<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>百度AI-身份证识别</title>
</head>
<body>
<!--如果仅调取相机,使用: capture="camera"-->
<input type="file" id="image" accept="image/*" /> <script src="https://common.cnblogs.com/scripts/jquery-2.2.0.min.js"></script>
<script type="text/javascript">
var obj = {}; $(document).ready(function () {
getBaiduToken();
$("#image").change(function () {
console.log(obj.BAIDU_TOKEN);
var reader = new FileReader();
reader.readAsDataURL(this.files[0]);
reader.onload = function (e) {
var base64Image = e.target.result;//或者 reader.result
base64Image = base64Image.split(",")[1];
console.log(base64Image);
parse(base64Image);
};
});
}); //百度识别
function parse(base64Image) {
var url = "https://aip.baidubce.com/rest/2.0/ocr/v1/idcard?access_token=" + obj.BAIDU_TOKEN;
$.ajax({
url: url,
type: "post",
dataType: 'json',
headers: {
'Content-Type': 'application/x-www-form-urlencoded;'
},
data: {
image: base64Image,
id_card_side: 'front'
},
success: function (data) {
console.log(data);
document.write(JSON.stringify(data));
},
error: function (xhr, type, errorThrown) {
alert('识别失败');
}
});
} //获取百度识别token,这里需要后端处理,因为百度获取access-token的接口不支持跨域
function getBaiduToken() {
var url = "//www.xxx.com/getaccesstoken";
$.ajax({
url: url,
type: "get",
dataType: 'json',
success: function (json) {
obj.BAIDU_TOKEN = json.Data;
}
});
}
</script>
</body>
</html>

只需要修改文中标红的两处地方就可以了。

如果你的需求是在识别的时候,还需要保存下来身份证,那么我建议不要在前端去识别了。直接把图片上传到后端,再由后端调取百度接口去识别。

百度AI身份证识别demo,使用js提交图片数据的更多相关文章

  1. 基于百度AI人脸识别技术的Demo

    编写demo之前首先浏览官方API:http://ai.baidu.com/docs#/Face-API/top 下面是源码: package com.examsafety.test; import ...

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

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

  3. 百度AI人脸识别的学习总结

    本文主要分以下几个模块进行总结分析 项目要求:运用百度AI(人脸识别)通过本地与外网之间的信息交互(MQService),从而通过刷脸实现登陆.签字.会议签到等: 1.准备工作: 内网:单击事件按钮— ...

  4. Android Study 玩转百度ocr身份证识别不是梦~

    前言 Today,由于昨晚喝蒙了,今天晕乎乎的为大家带来如何快速集入ocr身份证识别. 关于ocr的前世今生这里不做过多的说明,百度一抓一大把. 前期准备 百度AI开放平台ocr地址: https:/ ...

  5. Python 百度ai身份证接口案例

    调用百度Ai 完成一个学生信息录入的网页小案例 添加图片,身份证信息对号入座 官方文档中心:https://ai.baidu.com/docs#/OCR-API/7e4792c7 utils.py # ...

  6. 百度AI车牌识别测试

    测试背景 百度已发布诸多AI应用,其中包含车牌识别,免费使用量是200次/日.付费的话,按月调用次数在20万次到50万次之间,每日10000次,月费用为0.0035*300000=1050元. 详见: ...

  7. 基于C# 调用百度AI 人脸识别

    一.设置 登录百度云控制台,添加应用-添加人脸识别,查找,对比等. 记住API Key和Secret Key 二.创建Demo程序 1.使用Nuget安装 Baidu.AI 和 Newtonsoft. ...

  8. 百度AI图片识别

    官方文档:http://ai.baidu.com/tech/ocr/general

  9. 技能节-AI人脸识别

    我们收到技能节项目的通知是在两周之前,项目要求做个人脸评分系统. 两周时间写一个"人脸评分系统",好像时间比较紧了,还好我们完成了~这个项目是将摄像头捕获到的包含人脸的图像传输到百 ...

随机推荐

  1. JSR303后端校验(一)

    JSR303后端校验(一) (1)在pom文件中添加依赖 <!-- JSR303后端校验 --> <dependency> <groupId>org.hiberna ...

  2. mysql导出PDM表结构并带有注释

    分享链接:https://www.cnblogs.com/dennyzhangdd/p/5550868.html

  3. 到底该不该用RTOS——rtos的优点

    我现在要不要学习RTOS? 学习RTOS有什么好处? 我的项目要不要跑RTOS? ······等等一些关于RTOS的问题,其实归根结底还是你对RTOS了解的不够,项目开发的经验还不足等. 针对这部分朋 ...

  4. UI系统的表示与维护

    UI系统的表示与维护: 渲染单元的组织.维护.交互.解释.渲染. UI系统在应用层连接着视图的表示,在系统层连接着视图的绘制. 一.UI的结构 树形结构 二.UI的描述: 1.UI系统或UIkit或U ...

  5. A Funny Game——打表&&找规律

    题目 n枚硬币排成一个圈.Alice和Bob轮流从中取一枚或两枚硬币.不过,取两枚时,所取的两枚硬币必须是连续的.硬币取走之后留下空格,相隔空格的硬币视为不连续.Alice开始先取,取走最后一枚硬币的 ...

  6. PHP获取一年有多少周和每周开始和结束日期

    /*PHP获取当前日期是第几周和本周开始日期和本周结束日期*/ //$now = '2018-11-13';周二 public function getNowTimeInfo($now) { $str ...

  7. 开源项目(5-2) yolo打包成库

    Windows系统下YOLO动态链接库的封装和调用 Windows10+VS2015+OpenCV3.4.1+CUDA8.0+cuDNN8.0 参考教程 https://blog.csdn.net/s ...

  8. 【转】FIddler+Proxifer工具对windows PC客户端进行抓包

    开篇:要想实现写爬虫,抓取到数据,首先我们应该分析客户端和服务器的请求/响应,前提就是我们能监控到客户端是如何与服务器交互的,下面来记录下常见的三种情况下的抓包方法 1.PC端浏览器网页抓包网页板抓包 ...

  9. javascript获取手机上媒体设备,摄像头和话筒

    主要运用H5的媒体接口API,MDN文档: navigator.mediaDevices(新版API),Navigator.getUserMedia(旧版API,不建议使用,但某些浏览器还支持),本文 ...

  10. ffmpeg结合SDL编写播放器(一)

    ffmpeg 工具是一个高效快速的命令行工具,进行视音频不同格式之间的转换. ffmpeg命令行 ffmpeg可以读取任意数量的输入“文件”(可以是常规文件,管道,网络流,抓取设备等)读取,由 -i ...