基于HTML5 的人脸识别活体认证的实现方法

2020-04-24 19:24:07易采站长站整理

近几年,人脸识别技术在身份认证领域的应用已经有了较多应用,例如:支付宝、招行的取款、养老金领取等方面,但在杜绝假冒、认证安全性等方面,目前还是一个比较需要进一步解决的课题,特别是在移动端的活体认证技术方面。

本文介绍了在HTML5 环境下可以采用clmtrackr.js 检测工具,结合人脸模型,实现人脸的跟踪检测。同时采用动作识别实现活体认证。

但本方案只能够在Firefox 或者Chrome中使用。并且只适合研究学习,实际场景中不太理想,需要进一步优化才能够应用。

如果有人有相关的技术,可以推荐介绍给我。

JavaScript Code复制内容到剪贴板

<!DOCTYPE html>  
<!–  
Ideally these elements aren’t created until it’s confirmed that the   
client supports video/camera, but for the sake of illustrating the   
elements involved, they are created with markup (not JavaScript)  
–>  
<html>  
<meta charset="GBK">  
<style>  
#container {  
position : relative;  
}  
 
#canvas {  
position : absolute;  
left : 0;  
top : 0;  
}  
</style>  
<script src="utils.js"></script>  
<script src="clmtrackr.js"></script>  
<script src="./models/model_pca_20_svm.js"></script>  
<script src="numeric.js"></script>  
<script src="ccv.js"></script>  
  
<audio id="media">   
你的浏览器不支持audio标签。  
</audio>  
<div id="container">  
<video id="video" width="600" height="400" autoplay >   
您的浏览器不支持video标签  
</video>  
<canvas id="canvas" width="600" height="400"></canvas>  
</div>      
  
<button id="snap">Snap Photo</button>  
  
<button id="start">Start</button>  
  
<button id="showposition">显示</button>