EST-100身份证社保卡签批屏按捺终端PC版web版本http协议接口文档，支持web网页开发对接使用

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>演示DEMO</title>
<script type="text/javascript" src="jquery-1.12.4.js"></script>
<style type="text/css">
.mdiv div {
text-align: center;
}
.mdiv>div {
display: inline-block;
box-sizing: border-box;
/*height: 8rem;*/
vertical-align: top;
}
.mdiv>div>div:first-child,
.dtitle {
background-color: #DDDDDD;
padding: 5px 0px;
margin: 0px 0px 15px 0px;
text-align: center;
}
mdiv img {
border: 1px solid gray;
}
button,
select,
input {
box-sizing: border-box;
width: 145px;
font-size: 16px;
padding: 5px;
margin-left: 15px;
margin-bottom: 25px;
}
</style>
</head>
<body>
<div class="dtitle" style="margin-bottom: 0px;border-bottom: 1px solid gray;">展示区</div>
<div class='mdiv'>
<div>
<div>设备屏幕监控</div>
<div>
<img style="width: 320px;height:200px;" id="imgDeviceScreen" οnerrοr="monitorDeviceFail(this)">
</div>
</div>
<div>
<div>摄像头画面</div>
<div>
<img style="width: 320px;height:180px;" id="imgCameraVideo" οnerrοr="openCameraFail(this)">
</div>
</div>
<div>
<div>拍照内容</div>
<div>
<img style="width: 320px;height:180px;" id="imgCameraPhoto">
</div>
</div>
<div>
<div>签名图片</div>
<div>
<img style="width: 320px;height:180px;" id="imgSignPic">
</div>
</div>
<div style="width: 120px;">
<div style="padding-right: 20px;">身份证照片</div>
<div>
<img style="width: 100px;height:126px;margin-right: 20px;" id="imgIDCard">
</div>
</div>
<div style="width: 150px;">
<div>指纹图片</div>
<div>
<img style="width: 128px;height:180px;" id="imgFingerPic">
</div>
</div>
</div>
<div id="dmsg" style="margin-top: 10px; margin-bottom: 30px;font-weight: bold;">返回消息：</div>
<div class="dtitle">操作区</div>
<div>
<button οnclick="monitorDevice()">打开设备屏幕监控</button>
<button οnclick="stopMonitor()">关闭设备屏幕监控</button>
<br>
<button οnclick="getCamera()">获取摄像头</button>
<select id="cameraSelect"></select>
<button οnclick="openCamera()">打开摄像头</button>
<button οnclick="takePhoto()">拍照</button>
<button οnclick="closeCamera()">关闭摄像头</button>
<button οnclick="openFaceVerify()">开始人证比对</button>
<button οnclick="stopFaceVerify()">取消人证比对</button>
<br>
<button οnclick="openSign()">打开签字窗口</button>
<button οnclick="stopSign()">关闭签字窗口</button>
<button οnclick="openFinger()">开始指纹采集</button>
<button οnclick="stopFinger()">取消指纹采集</button>
<button οnclick="openWeb()">打开网页</button>
<button οnclick="closeWeb()">关闭网页</button>
<button οnclick="evaluation()">服务评价</button>
<br>
<button οnclick="openReadChinaIdCard()">开始读取身份证</button>
<button οnclick="stopReadChinaIdCard()">取消读取身份证</button>
<button οnclick="openReadBankCard()">读取银行卡</button>
<br>
<button οnclick="readDeviceData()">读取数据</button>
<input type="text" name="DeviceNo" id="DeviceNo" placeholder="写入内容" disabled>
<button οnclick="initDeviceData(DeviceNo.value)" disabled>写入数据</button>
<br>
</div>
<script type="text/javascript">
jQuery.support.cors = true
var selectElement = document.getElementById('cameraSelect')
/**
To 秋博君：
1、使用http服务，注意看每个函数里面的地址和参数，要做的和这个网页一样
2、他们返回时用的 {code: int, message: string} 的形式，有时code=0表示成功，有时候code=1表示成功，你注意看ajax的success回调里面的判断
**/
function showMsg(msg) {
$("#dmsg").text("返回消息：" + msg)
}
function openCameraFail(obj) {
if (obj.src == null || obj.src.length == 0) return
alert("打开摄像头失败0308")
}
function monitorDeviceFail(obj) {
if (obj.src == null || obj.src.length == 0) return
alert("获取屏幕监控失败,可能是服务器未启动")
}
//开启设备屏幕监控
function monitorDevice() {
$("#imgDeviceScreen").attr("src", "http://127.0.0.1:38089/sign=stream&time=" + new Date().getTime())
}
//关闭设备屏幕监控
function stopMonitor() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38089/closewebontablet",
dataType: "json",
success: function (data) {
/** {code:int , message:string} **/
showMsg(data.code == 1 ? "成功关闭设备屏幕监控" : "当前并没有展示设备屏幕监控")
$("#imgDeviceScreen").attr('src', "")
$("#imgDeviceScreen").removeAttr('src')
}
})
}
//打开签字窗口 设备有：取消、重签、确定 按个按钮
function openSign() {
$("#imgSignPic").attr("src", "")
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/sign=start",
dataType: "json",
data: "{\"pos\": {\"top\":\"400\",\"left\":\"420\",\"width\":\"640\",\"height\":\"400\"}}",
// header: { //这一段是上一个版本有，我感觉是没必要了
// 'Access-Control-Allow-Private-Network': 'true',
// 'Access-Control-Request-Method': 'GET, POST',
// 'Access-Control-Request-Headers': 'Content-Type'
// },
success: function (data) {
/** {code:int , message:string, status:int[1-取消了签名 2-完成签名 ], image:string[图片base64] } **/
if (data.code != 0)
return showMsg("打开签字窗口失败, 返回代码 = " + data.code + ", 返回信息 = " + data.message)
if (data.status != 2)
return showMsg("签名被取消了")
showMsg("签名成功")
$("#imgSignPic").attr("src", "data:image/png;base64," + data.image)
}
})
}
//关闭签字窗口
function stopSign() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/sign=stop",
dataType: "json",
success: function (data) {
/** 这里原来的DEMO就没有判断 **/
}
})
}
//开始指纹采集
function openFinger() {
$("#imgFingerPic").attr("src", "")
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/finger=record",
dataType: "json",
//data: params,
success: function (data) {
/** {code:int, message:string, status:int[1-取消了采集 2-完成了采集], FigPic:string[图片base64] } **/
if (data.code != 0)
return showMsg("采集指纹失败, 返回代码 = " + data.code + ", 返回信息 = " + data.message)
if (data.status != 2)
return showMsg("指纹采集被取消了")
showMsg("采集指纹成功")
$("#imgFingerPic").attr("src", "data:image/jpeg;base64," + data.FigPic)
}
})
}
//取消指纹采集
function stopFinger() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/finger=stop",
dataType: "json",
success: function (data) {
/** 这个是仿照关闭签字窗口添加的 **/
}
})
}
//在设备上打开网页 -这里是打开的测试页，要求在设备上从测试页打开签名要能用调用到签名、指纹也要能正常使用
// [前面的SDK有这个破问题，我感觉新版不会有这个问题，还是测试一下放心些]
function openWeb() {
var url = location.href
myWindow = window.open(url, '_blank', 'height=800px, width=1280px, top=0, left=0, toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no')
myWindow.focus()
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/openwebontablet",
dataType: "json",
data: "{\"url\": \"" + url + "\"}",
success: function (data) {
/** {code:int , message:string} **/
showMsg(data.message)
}
})
}
//关闭网页
function closeWeb() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/sign=closebrowser",
dataType: "json",
//data: params,
success: function (data) {
/** {code:int , message:string} **/
showMsg(data.code == 1 ? "成功关闭网页" : "当前并没有展示网页")
}
})
}
var cameraInfo = []
//获取摄像头
function getCamera() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/camera=get",
dataType: "json",
// contentType: "application/json",
success: function (data) {
/** {code:int , message:string, camera:[{index:int, name:string, resolution:[{width:int, height:int},{width:int, height:int,....}]}, ...]} **/
//返回的resolution中摄像头支持的分辨率
console.log(JSON.stringify(data))
if (data.code != 0)
return showMsg(data.message)
showMsg(JSON.stringify(data))
cameraInfo = data.camera
selectElement.innerHTML = '<span></span>'
for (var i = 0; i < cameraInfo.length; i++) {
var option = document.createElement('option')
option.value = cameraInfo[i].index
option.label = cameraInfo[i].name
selectElement.appendChild(option)
}
}
})
}
//打开摄像头
function openCamera() {
if (cameraInfo == null || cameraInfo.length == 0)
return showMsg("未调用获取摄像头或未查找到摄像头信息")
//直接以最小的分辨率打开摄像头
var index = selectElement.value
var camera
for (var i = 0; i < cameraInfo.length; i++) {
if (i == index) {
camera = cameraInfo[i]
var width = camera.resolution[camera.resolution.length - 1].width
var height = camera.resolution[camera.resolution.length - 1].height
break
}
}
//这里应该的img标签，可以用onerror事件来得到打开摄像头失败的事件
$("#imgCameraVideo").attr("src", "http://127.0.0.1:38088/camera=stream&index=" + index + "&width=" + width + "&height=" + height + "?" + new Date().getTime())
}
//拍照
function takePhoto() {
if (cameraInfo == null || cameraInfo.length == 0) {
return showMsg("未调用获取摄像头或未查找到摄像头信息")
}
var index = selectElement.value
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/camera=photo&index=" + index,
dataType: "json",
success: function (data) {
/** {code:int , message:string, picture:string[图像base64,jpg格式]} **/
//返回的resolution中摄像头支持的分辨率
// console.log(JSON.stringify(data))
if (data.code != 0) {
return showMsg(data.message)
}
$("#imgCameraPhoto").attr("src", "")
$("#imgCameraPhoto").attr("src", "data:image/jpeg;base64," + data.picture)
}
})
}
//关闭摄像头
function closeCamera() {
if (cameraInfo == null || cameraInfo.length == 0) {
return showMsg("未调用获取摄像头或未查找到摄像头信息")
}
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/camera=close&index=" + selectElement.value,
dataType: "json",
success: function (data) {
/** {code:int , message:string} **/
if (data.code != 0) {
return showMsg(data.message)
} else {
$("#imgCameraVideo").attr('src', "")
$("#imgCameraVideo").removeAttr('src')
return showMsg('摄像头已关闭')
}
}
})
}
//开始人证比对
function openFaceVerify() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/method=startPersonVerify",
dataType: "json",
success: function (data) {
/** {code:int , message:string, retData:{score:int[相似度], photo:string[base64拍照图], pic:string[base64身份证照片], ...其他身份证内容}} **/
showMsg(data.message)
if (data.code != 0) return
$("#imgCameraPhoto").attr("src", "data:image/jpeg;base64," + data.retData.photo)
$("#imgIDCard").attr("src", "data:image/jpeg;base64," + data.retData.pic)
}
})
}
//取消人证比对
function stopFaceVerify() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/method=cancelPersonVerify",
dataType: "json",
success: function (data) {
/** {code:int , message:string} **/
console.log(JSON.stringify(data))
//showMsg(JSON.stringify(data));
return showMsg(data.message)
}
})
}
//开始读取身份证 提供一个界面提示，然后循环读取，读取到，或者网页上取消了，就返回
function openReadChinaIdCard() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/method=startReadChinaIdCard",
dataType: "json",
success: function (data) {
console.log(JSON.stringify(data))
/** {code:int , message:string, retData:{pic:string[base64身份证照片], ...其他身份证内容}} **/
if (data.code != 0) return showMsg(data.message)
$("#imgIDCard").attr("src", "data:image/jpeg;base64," + data.retData.pic)
retdata = data.retData
delete retdata.pic
showMsg(JSON.stringify(retdata))
}
})
}
//取消读取身份证
function stopReadChinaIdCard() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/method=cancelReadChinaIdCard",
dataType: "json",
success: function (data) {
console.log(JSON.stringify(data))
/** {code:int , message:string} **/
showMsg(JSON.stringify(data))
}
})
}
// 开始读取银行卡
function openReadBankCard() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/method=startReadBankCard",
dataType: "json",
success: function (data) {
console.log(JSON.stringify(data))
/** {code:int , message:string, data:string} **/
if (data.code != 0) return showMsg(data.message)
showMsg(JSON.stringify(data))
}
})
}
//写数据
function initDeviceData(data) {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/deviceDataInit" + data,
dataType: "json",
success: function (data) {
/** {code:int , message:string]} **/
//返回的resolution中摄像头支持的分辨率
console.log(JSON.stringify(data))
if (data.code != 0)
return showMsg(data.message)
showMsg(JSON.stringify(data))
}
})
}
//读数据
function readDeviceData() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/readDeviceData",
dataType: "json",
success: function (data) {
/** {code:int , message:string, data:string ]} **/
//返回的resolution中摄像头支持的分辨率
console.log(JSON.stringify(data))
if (data.code != 0)
return showMsg(data.message)
showMsg(JSON.stringify(data))
}
})
}
function evaluation() {
$.ajax({
type: "post",
url: "http://127.0.0.1:38088/evaluation",
dataType: "json",
success: function (data) {
/** {code:int , message:string, data:string ]} **/
//评价信息
console.log(JSON.stringify(data))
if (data.code != 0)
return showMsg(data.message)
showMsg(JSON.stringify(data))
}
})
}
</script>
</body>
</html>

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

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

相关文章

YOLOv5改进 | 2023注意力篇 | BiFormer双层路由注意力机制(Bi-level Routing Attention)

YOLOv5改进 | 2023注意力篇 | BiFormer双层路由注意力机制(Bi-level Routing Attention)

一、本文介绍 BiFormer是一种结合了Bi-level Routing Attention的视觉Transformer模型&#xff0c;BiFormer模型的核心思想是引入了双层路由注意力机制。在BiFormer中&#xff0c;每个图像块都与一个位置路由器相关联。这些位置路由器根据特定的规则将图像块分配给上层和下层路…
阅读更多...
基于Wenet长音频分割降噪识别

基于Wenet长音频分割降噪识别

Wenet是一个流行的语音处理工具&#xff0c;它专注于长音频的处理&#xff0c;具备分割、降噪和识别功能。它的长音频分割降噪识别功能允许对长时间录制的音频进行分段处理&#xff0c;首先对音频进行分割&#xff0c;将其分解成更小的段落或语音片段。接着进行降噪处理&#x…
阅读更多...
磁盘相关知识

磁盘相关知识

一、硬盘数据结构 1.扇区&#xff1a; 盘片被分为多个扇形区域&#xff0c;每个扇区存放512字节的数据&#xff08;扇区越多容量越大&#xff09; 存放数据的最小单位 512字节 &#xff08;硬盘最小的存储单位是扇区&#xff0c;512 个字节&#xff0c;八个扇区组成一块&…
阅读更多...
算法学习系列（十五）：最小堆、堆排序

算法学习系列（十五）：最小堆、堆排序

目录 引言一、最小堆概念二、堆排序模板&#xff08;最小堆&#xff09;三、模拟堆 引言 这个堆排序的话&#xff0c;考的还挺多的&#xff0c;主要是构建最小堆&#xff0c;并且在很多情况下某些东西还用得着它来优化&#xff0c;比如说迪杰斯特拉算法可以用最小堆优化&#…
阅读更多...
Xamarin开发:商场促销（策略设计模式）

Xamarin开发:商场促销（策略设计模式）

Xamarin开发:商场促销&#xff08;策略设计模式&#xff09; 一、介绍二、需求分析三、实现四、需求分析问题1解决方案问题2解决方案 五、增加新需求六、代码优化与分析总结 一、介绍 本文引用《大话设计模式》第二章节的内容进行学习分析&#xff0c;仅供学习使用 这里接着我…
阅读更多...
Java设计模式-装饰者模式

Java设计模式-装饰者模式

目录 一、星巴克咖啡订单项目 二、装饰者模式 &#xff08;一&#xff09;定义 &#xff08;二&#xff09;原理 &#xff08;三&#xff09;装饰者模式解决星巴克咖啡订单 一、星巴克咖啡订单项目 星巴克咖啡订单项目&#xff08;咖啡馆&#xff09;&#xff1a; 1) 咖…
阅读更多...
菜鸟学习vue3笔记-vue hooks初体验

菜鸟学习vue3笔记-vue hooks初体验

import { ref } from "vue"; export default function () {let a1 ref(1);let a2 ref(5);let c ref(0);function add() {a1.value;a2.value;}return {add,a1,a2,c,}; }<template><div><p>第一个数字{{ a1 }}</p><p>第二个数字{{ a2…
阅读更多...
java勤工助学信息管理系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

java勤工助学信息管理系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

一、源码特点 java Web勤工助学信息管理系统是一套完善的java web信息管理系统&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环境 为TOMCAT7.0,Myeclipse8.5开发&#xff0c;数据库为M…
阅读更多...
Java线上问题排查思路

Java线上问题排查思路

1、Java 服务常见问题 Java 服务的线上问题从系统表象来看大致可分成两大类: 系统环境异常、业务服务异常。 系统环境异常&#xff1a;主要从CPU、内存、磁盘、网络四个方面考虑。比如&#xff1a;CPU 占用率过高、CPU 上下文切换频率次数较高、系统可用内存长期处于较低值、…
阅读更多...
K8s实战-基于LivenessProbe健康检查

K8s实战-基于LivenessProbe健康检查

LivenessProbe探针用于判断容器是否存活&#xff0c;如果探测到容器不健康&#xff0c;则kubelet将杀掉该容器&#xff0c;然后根据重启策略处理。 LivenessProbe的实现方式&#xff1a; ExecAction&#xff1a;在容器内部执行一个命令&#xff0c;如果该命令的返回码为0&…
阅读更多...
计算机毕业设计 基于SpringBoot的高校危化试剂仓储管理系统的设计与实现 Java实战项目 附源码+文档+视频讲解

计算机毕业设计 基于SpringBoot的高校危化试剂仓储管理系统的设计与实现 Java实战项目 附源码+文档+视频讲解

博主介绍&#xff1a;✌从事软件开发10年之余&#xff0c;专注于Java技术领域、Python人工智能及数据挖掘、小程序项目开发和Android项目开发等。CSDN、掘金、华为云、InfoQ、阿里云等平台优质作者✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精…
阅读更多...
最短路径(数据结构实训)(难度系数100)

最短路径(数据结构实训)(难度系数100)

最短路径 描述&#xff1a; 已知一个城市的交通路线&#xff0c;经常要求从某一点出发到各地方的最短路径。例如有如下交通图&#xff1a; 则从A出发到各点的最短路径分别为&#xff1a; B&#xff1a;0 C&#xff1a;10 D&#xff1a;50 E&#xff1a;30 F&#xff1a;60 输…
阅读更多...
白话机器学习的数学-1-回归

白话机器学习的数学-1-回归

1、设置问题 投入的广告费越多&#xff0c;广告的点击量就越高&#xff0c;进而带来访问数的增加。 2、定义模型 定义一个函数&#xff1a;一次函数 y ax b &#xff08;a 是斜率、b 是截距&#xff09; 定义函数&#xff1a; 3、最小二乘法 例子&#xff1a; 用随便确定的参…
阅读更多...
BDTC2023：CloudberryDB开源创新与实践

BDTC2023：CloudberryDB开源创新与实践

中国大数据技术大会&#xff08;BDTC&#xff09;由中国计算机学会&#xff08;CCF&#xff09;创立于2008年&#xff0c;已经成为国内外极具行业实践的专业大数据交流平台。12月22日-24日&#xff0c;第十七届中国大数据技术大会&#xff08;BDTC 2023&#xff09;在广州举行。…
阅读更多...
文字识别技术在未来会有怎样的发展？

文字识别技术在未来会有怎样的发展？

随着科技的不断发展&#xff0c;文字识别技术也在不断地改进和完善。未来&#xff0c;文字识别技术将会在更多的领域得到应用&#xff0c;并且将会更加智能化、高效化和个性化。 首先&#xff0c;随着深度学习技术的不断发展&#xff0c;文字识别技术将会更加智能化。目前&…
阅读更多...
ubuntu22下安装minconda

ubuntu22下安装minconda

bing 搜索 canda install 找到官方网站 https://docs.conda.io/projects/miniconda/en/latest/ 这里我们安装minconda。 官网有安装方法。 mkdir -p ~/miniconda3 wget https://repo.anaconda.com/miniconda/Miniconda3-latest-Linux-x86_64.sh -O ~/miniconda3/miniconda.sh…
阅读更多...
docker的基本管理和相关概念

docker的基本管理和相关概念

docker的基本管理和概念 docker&#xff1a;开源的应用容器引擎。基于go语言开发的。运行在linux系统当中的开源的&#xff0c;轻量级的“虚拟机” docker的容器技术可以在一台主机上轻松的为任何应用创建一个轻量级的&#xff0c;可移植的&#xff0c;自给自足的容器 docke…
阅读更多...
Java 读取超大excel文件

Java 读取超大excel文件

注意&#xff1a;此参考解决方案只是针对xlsx格式的excel文件&#xff01; Maven <dependency><groupId>com.monitorjbl</groupId><artifactId>xlsx-streamer</artifactId><version>2.2.0</version> </dependency>读取方式1…
阅读更多...
Android画布Canvas矩阵Matrix放大裁剪Rect区域的Bitmap，Kotlin

Android画布Canvas矩阵Matrix放大裁剪Rect区域的Bitmap，Kotlin

Android画布Canvas矩阵Matrix放大裁剪Rect区域的Bitmap&#xff0c;Kotlin private fun mydraw() {val originBmp BitmapFactory.decodeResource(resources, R.mipmap.pic).copy(Bitmap.Config.ARGB_8888, true)val newBmp Bitmap.createBitmap(originBmp.width, originBmp.h…
阅读更多...
爬虫基础一（持续更新）

爬虫基础一（持续更新）

爬虫概念&#xff1a; 通过编写程序&#xff0c;模拟浏览器上网&#xff0c;然后让其去互联网上抓取数据的过程 分类&#xff1a; 1&#xff0c;通用爬虫&#xff1a;抓取一整张页面数据 2&#xff0c;聚焦爬虫&#xff1a;抓取页面中的局部内容 3&#xff0c;增量式爬虫&…
阅读更多...
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站