用过easydl一段时间,一直感慨于仅仅是通过上传图片的方式总觉得不带劲,于是想找一找有没有可以实现在整个视频中做到人脸识别而不需要自己一张照片一张照片的去试。
人脸检测的官方描述:
检测请求图片中的人脸,返回人脸位置、72个关键点坐标、及人脸相关属性信息。
检测响应速度,与图片中人脸数量相关,人脸数量较多时响应时间会有些许延长。
典型应用场景:如人脸属性分析,基于人脸关键点的加工分析,人脸营销活动等。
五官位置会标记具体坐标;72个关键点坐标也包含具体坐标,但不包含对应位置的详细位置描述。
总结一句话就是:检测人脸图片,返回各种人脸属性数据。
经过我搜集的过程,我大概找到了以下两种方式:一种是“盗用“”现成的---EasyMonitor,一种则是通过opencv的视频抽帧来实现。
首先讲讲EasyMonitor的使用方法,这个方法我看到以为高手分享的帖子,所以我就在他的基础上试验了一下
他是基于H5进行人脸识别的案例
首先就要判断你的浏览器是否支持开启摄像头,可以就开启并录视频
//判断浏览器是否支持HTML5 Canvas
window.onload = function () {
try {
//动态创建一个canvas元 ,并获取他2Dcontext。如果出现异常则表示不支持 document.createElement("canvas").getContext("2d");
// document.getElementById("support").innerHTML = "浏览器支持HTML5 CANVAS";
}
catch (e) {
// document.getElementByIdx("support").innerHTML = "浏览器不支持HTML5 CANVAS";
}
};
//这段代 主要是获取摄像头的视频流并显示在Video 签中
window.addEventListener("DOMContentLoaded", function () {
var canvas = document.getElementById("canvas"),
context = canvas.getContext("2d"),
video = document.getElementById("video"),
videoObj = { "video": true },
errBack = function (error) {
console.log("Video capture error: ", error.code);
};
// $("#snap").click(function () {
// context.drawImage(video, 0, 0, 330, 250);
// })
//拍照按钮
setInterval(function(){
context.drawImage(video, 0, 0, 330, 250)
CatchCode();
},1000);
//navigator.getUserMedia这个写法在Opera中好像是navigator.getUserMedianow
if (navigator.getUserMedia) {
navigator.getUserMedia(videoObj, function (stream) {
video.srcObject = stream;
video.play();
}, errBack);
} else if (navigator.webkitGetUserMedia) {
navigator.webkitGetUserMedia(videoObj, function (stream) {
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errBack);
}
}, false);
接下来是将获取的图片数据传到后台,直接用ajax传base64的图片数据的时候,
因为长度太长,导致后台无法获得正取的图片数据,从而调用API时返回的数据是空。
于是新的解决办法就是用的formData 作为对象传到后台进行解析
function dataURItoBlob(base64Data) {
var byteString;
if (base64Data.split(',')[0].indexOf('base64') >= 0)
byteString = atob(base64Data.split(',')[1]);
else
byteString = unescape(base64Data.split(',')[1]);
var mimeString = base64Data.split(',')[0].split(':')[1].split(';')[0];
var ia = new Uint8Array(byteString.length);
for (var i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
return new Blob([ia], {type:mimeString});
}
再接着要通过JAVA后台接受前台传来的图片数据,用的是SpringMVC框架,因为人脸检测API是需要这个图片字节数组,所以要进行类型转换
/**
* 请求人脸检测
* @return
* @throws Exception
*/
@RequestMapping(value = "/save.do")
@ResponseBody
public Map queryService(@RequestParam("the_file") MultipartFile file) {
Map modelMap = new HashMap();
try {
//将数据转为流
InputStream content = file.getInputStream();
ByteArrayOutputStream swapStream = new ByteArrayOutputStream();
byte[] buff = new byte[100];
int rc = 0;
while ((rc = content.read(buff, 0, 100)) > 0) {
swapStream.write(buff, 0, rc);
}
//获得二进制数组
byte[] in2b = swapStream.toByteArray();
//调用人脸检测的方法
Map strmap = FaceDetect.detectby(in2b);
//将map数据封装json传到前台
String strjson = JsonUtil.mapToJson(strmap);
modelMap.put("strjson", strjson);
modelMap.put("success", true);
} catch (Exception e) {
modelMap.put("success", false);
modelMap.put("data", e.getMessage());
}
return modelMap;
}
最后就是最核心的百度API
public static Map match2(byte[] arg0,byte[] arg1) {
Map map = new HashMap();
// 请求url
String url = "https://aip.baidubce.com/rest/2.0/face/v2/match";
try {
// 活体检测人脸
String imgStr = Base64Util.encode(arg0);//
String imgParam = URLEncoder.encode(imgStr, "UTF-8");
//身份证人脸
String imgStr2 = Base64Util.encode(arg1);
String imgParam2 = URLEncoder.encode(imgStr2, "UTF-8");
String param = "images=" + imgParam + "," + imgParam2;
// 注意这里仅为了简化编码每一次请求都去获取access_token,线上环境access_token有过期时间, 客户端可自行缓存,过期后重新获取。
String accessToken = "";
String str = HttpUtil.post(url, accessToken, param);
System.out.println(str);
JSONObject jsonobject = JSONObject.fromObject(str);
String result = jsonobject.getString("result");
JSONArray json = JSONArray.fromObject(result); // 首先把字符串转成 JSONArray 对象
for(int i=0;i
这样一个简单的视频监测就出来了,里面大多数思路还是很不错的,其实这个只是最初步的搭建H5人脸检测,大家可以拿来测试玩玩hhhh。