掌财社:使用HTML5+tracking.js实现刷脸支付功能方法！实例分析！

在支付宝推出的刷脸系统开始变得流行火爆起来，这就带动不少的人来学习这个效果，那么今天小编和大家分享有关于“使用HTML5+tracking.js实现刷脸支付功能方法！实例分析！”这个方面的相关内容吧！ 

1.摄像头1.1input获取摄像头

html5中获取用户摄像头，有两种方式，使用input，如下：

<input type="file" capture="camera" accept="image/*"/>

另外如果想打开相册，可以这样：

<input type="file" accept="img/*">

但是这两种方式都会有兼容性问题，用过的同学可能都知道。

1.2getUserMedia获取摄像图

getUserMedia是html5一个新的api，官方一点的定义是：

MediaDevices.getUserMedia()会提示用户给予使用媒体输入的许可，媒体输入会产生一个MediaStream，里面包含了请求的媒体类型的轨道。此流可以包含一个视频轨道（来自硬件或者虚拟视频源，比如相机、视频采集设备和屏幕共享服务等等）、一个音频轨道（同样来自硬件或虚拟音频源，比如麦克风、A/D转换器等等），也可能是其它轨道类型。

简单一点说就是可以获取到用户摄像头。

同上面input一样，这种方式也有兼容性问题，不过可以使用其他方式解决，这里可以参考MediaDevices.getUserMedia()，文档中有介绍"在旧的浏览器中使用新的API"。我这里在网上也找了一些参考，总结出一个相对全面的getUserMedia版本，代码如下：