高拍仪.html
8.21 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>demo</title>
<script src="./jquery.js"></script>
<style>
#tishi{
position: absolute;
top: 500px;
left: 300px;
}
</style>
</head>
<body>
<!-- IE预览 -->
<div>
<OBJECT classid="clsid:A4B4E9B5-78E6-4CE3-B8A1-4B36237943F8" id="ocxstreamimage" name="showVideoOcx" width="360px" height="270px"></OBJECT>
<OBJECT classid="clsid:A4B4E9B5-78E6-4CE3-B8A1-4B36237943F8" id="ocxstreamimage1" name="showVideoOcx1" width="360px" height="270px"></OBJECT>
<img src="" id="show_img" width="360px" height="270px" alt="">
<b id="tishi" style="font-size: 20px; color: red;"></b>
</div>
<div>
<button onclick="scan1()">主头拍照</button>
<button onclick="scan2()">副头拍照</button>
<button onclick="scan1cutpage()">主头纠偏拍照</button>
<button onclick="CameraFaceComparsionIE()">人证比对IE</button>
<button onclick="ComposeImage()">图片合成</button>
<button onclick="ComposeImageIE()">图片合成IE</button>
<button style="margin-left: 50px;" onclick="isNum()">判断摄像头是否连接</button>
<button onclick="isState()">获取摄像头状态</button>
<button onclick="isfullshow()" id="z">开启主头纠偏显示</button>
</div>
<div style="border: 2px solid red;margin-top: 30px;">
<img id="res_img" src="" width="400px" height="300px" alt="">
</div>
<script>
// 打开视频
showVideoOcx.StartPreview(0);
showVideoOcx1.StartPreview(1);
// 存储base64
var img1 = '';
// 人证比对IE
function CameraFaceComparsionIE(){
var base64;
//参数0：要保持的图片路径，为空时不保存，不为空按路径保存图片，默认文jpeg格式。
//参数1：是否进行纠偏处理。0：不纠偏 1：纠偏
//返回值：返回拍摄图片base64数据。showVideoOcx0为主头拍照，showVideoOcx1为副头拍照。
base64 = showVideoOcx1.GrabImageIE("", 0);
//参数0:要进行比对的第一张图片base64数据。
var result = showVideoOcx1.CameraFaceComparsionIE(base64);
alert(result);
//返回进行比对的第二张图片base64数据
var base642 = showVideoOcx1.GetCameraFaceComparsionIEBase64();
$('#res_img').attr('src', "data:image/jpg;base64," + base642);
}
// 合成图片
function ComposeImage(){
if(img1 == ''){
$('#tishi').text('已拍摄第一张图片，请再次点击拍摄第二张图片并自动合成');
var data = {
"filepath": "base64",
"rotate": "0",
"cutpage": "1",
"camidx": "0"
};
$.post("http://127.0.0.1:38088/video=grabimage", JSON.stringify(data), function(res){
$('#res_img').attr('src', "data:image/jpg;base64," + res.photoBase64);
img1 = res.photoBase64;
})
return;
}
// 拍摄第二张图片
var data = {
"filepath": "base64",
"rotate": "0",
"cutpage": "1",
"camidx": "0"
};
$.post("http://127.0.0.1:38088/video=grabimage", JSON.stringify(data), function(res){
if(res.code == '0'){
// 合成
var data = {
"imageOne": img1,
"imageTwo": res.photoBase64
}
$.post("http://127.0.0.1:38088/iamge=compose", JSON.stringify(data), function(res){
$('#res_img').attr('src', "data:image/jpg;base64," + res.photoBase64);
$('#tishi').text('合成成功');
img1 = "";
})
}
})
}
//图片合成IE
function ComposeImageIE(){
//参数0：要保存图片的路径，为空时不保存，不为空按路径保存图片，默认文jpeg格式。
//参数1：是否进行纠偏处理。0：不纠偏 1：纠偏
//返回值：返回拍摄图片base64数据。showVideoOcx0为主头拍照，showVideoOcx1为副头拍照。
var filPath = "D:\\GrabImage_hImage_pBase641111.jpg"
var base640;
base640 = showVideoOcx.GrabImageIE("", 1);
var base641;
base641 = showVideoOcx.GrabImageIE("", 1);
//参数0：合成图片的第一张图片base64数据。
//参数1：合成图片的第二张图片base64数据。
//返回值：返回合成图片base64数据。
var base642;
base642 = showVideoOcx.ComposeImageIE(base640, base641);
$('#res_img').attr('src', "data:image/jpg;base64," + base642);
}
// 主头拍照
function scan1(){
var data = {
"filepath": "base64",
"rotate": "0",
"cutpage": "0",
"camidx": "0"
};
$.post("http://127.0.0.1:38088/video=grabimage", JSON.stringify(data), function(res){
$('#res_img').attr('src', "data:image/jpg;base64," + res.photoBase64);
img1 = res.photoBase64;
})
}
// 副头拍照
function scan2(){
var data = {
"filepath": "base64",
"rotate": "0",
"cutpage": "0",
"camidx": "1"
};
$.post("http://127.0.0.1:38088/video=grabimage", JSON.stringify(data), function(res){
$('#res_img').attr('src', "data:image/jpg;base64," + res.photoBase64);
img1 = res.photoBase64;
})
}
// 主头纠偏拍照
function scan1cutpage(){
var data = {
"filepath": "base64",
"rotate": "0",
"cutpage": "1",
"camidx": "0"
};
$.post("http://127.0.0.1:38088/video=grabimage", JSON.stringify(data), function(res){
$('#res_img').attr('src', "data:image/jpg;base64," + res.photoBase64);
})
}
// 判断摄像头是否连接
function isNum(){
$.post("http://127.0.0.1:38088/device=isconnect", function(res){
if (res.data > 0){
alert("已连接");
}else{
alert("未连接");
}
})
}
// 获取摄像头状态
function isState(){
$.post("http://127.0.0.1:38088/video=status", function(res){
// 判断主摄像状态
if(res.video0 == 'run'){alert("主摄像头正在运行")}
if(res.video0 == 'no'){alert("主摄像头未连接")}
if(res.video0 == 'ok'){alert("主摄像头已连接")}
// 判断副摄像头状态
if(res.video1 == 'run'){alert("副摄像头正在运行")}
if(res.video1 == 'no'){alert("副摄像头未连接")}
if(res.video1 == 'ok'){alert("副摄像头已连接")}
})
}
// 开启主头纠偏显示
function isfullshow(){
t = $('#z').text();
if(t == "开启主头纠偏显示"){
var data = {
"camidx": "0",
"open": "1" // 0：关；1：开
}
$.post("http://127.0.0.1:38088/dvideo=cameradeskew", JSON.stringify(data), function(){
$('#z').text('关闭主头纠偏显示');
})
}
if(t == "关闭主头纠偏显示"){
var data = {
"camidx": "0",
"open": "0" // 0：关；1：开
}
$.post("http://127.0.0.1:38088/dvideo=cameradeskew", JSON.stringify(data), function(){
$('#z').text('开启主头纠偏显示');
})
}
}
</script>
</body>
</html>