h5手机上调用摄像头人像比对 与FileReader文件上传

//显示拍照
function showVideo(){
    canvas.width = video.offsetWidth * ratio;
    canvas.height = 200;
    context = canvas.getContext("2d");
    if(navigator.getUserMedia){
        navigator.mediaDevices.getUserMedia(myConstraints).then((stream) => {
            video.srcObject = stream;
        buffer = stream;
        video.play()
    }, (error) => {
            //ios11 上传图片或者拍照 在低版本苹果上调用摄像头失败 就让用户点击选择拍照或者选择自拍照
            $(".unDerIos11").show();
            $(".others").hide();
            console.log(error.name || error)
        })
    }else{
        $(".unDerIos11").show();
        $(".others").hide();
    }
}

• 拍照完毕后要进行一个是显示提示显示照片 关闭了摄像头

//方法关闭摄像头
function closeCamera() {
    buffer && buffer.getTracks()[0].stop();
}

• 拍照后图片上传到后端进行人像的对比

//拍照按钮的单击事件
$('#capture').click(function () {
    //绘制画面
    context.drawImage(video,0,0,video.offsetWidth * 1 ,video.offsetHeight * 1 );
    switch ($(this).find('a').text()){
        case '识别':
            $('#canvas').show();
            $('#video').hide();
            $(this).addClass("reRec").find('a').html('重新识别');
            //上传图片的Base64
            uploadImg((canvas.toDataURL('image/png')),2);
            break;
        case '重新识别':
            $('#video').show();
            $('#canvas').hide();
            faceImg = 0;
            $('#video').show();
            $(".reRec-load").hide();
            $(this).removeClass("reRec").find('a').html('识别');
            break;
    }
});

以下是html5身份证上传的js部分 使用FileReader

 <input id="upload"  class="weui-uploader__input" type="file" accept="image/*" multiple="">

//身份证上传
var reader = new FileReader();
$('.card-face_wrap').on('change','#upload',function(){//图片上传
    var that =$(this).parents(".card-face_wrap");
    imgType = that.attr('val');
    //var AllowImgFileSize = 2100000; //上传图片最大值(单位字节)（ 2 M = 2097152 B ）超过2M上传失败
    var rd=new FileReader();  //创建文件读取对象
    var file=$(this)[0].files[0];
    //var imgSize = file.size;
    rd.readAsDataURL(file);  //读取类型为base64
    $(this).clone().replaceAll(file=this);
    rd.onload=function (ev) {
        //图片显示且上传
        var str = '<input id="upload"  class="weui-uploader__input" type="file" accept="image/*" multiple=""><img id="imgDetail" src='+this.result+' />';
        that.html(str);
        if(imgType==1){
            curImg = this.result;
        }else if(imgType==2){
            curImg = this.result;
        }
        uploadImg(curImg,imgType);
    }

});