作者：简瞳之殇 | 来源：互联网 | 2023-09-02 10:21
注意
浏览器获取摄像头权限时候比较严格,我百度时必须有ssl证书才可以(应该还有别的方法),我自己使用的https协议调用的
前端JS
<!DOCTYPE html>
<html>
<head><title>人脸注册 - Powered by {:config(&＃39;hisiphp.name&＃39;)}</title><meta http-equiv&＃61;"Access-Control-Allow-Origin" content&＃61;"*">
<body><video id&＃61;"video"></video>
<canvas id&＃61;"canvas" width&＃61;"400" height&＃61;"230" style&＃61;"display: none"></canvas>
<p style&＃61;"margin-top: 10px;text-align: center;" id&＃61;"returnMsg"><input type&＃61;"button" class&＃61;"layui-btn layui-btn-normal" value&＃61;"返回信息返回信息" >
</p><script src&＃61;"https://s3.pstatp.com/cdn/expire-1-M/jquery/3.3.1/jquery.min.js"></script>
<script src&＃61;"__PUBLIC_JS__/layer/layer.js"></script>
<script>let video &＃61; document.getElementById("video");let canvas &＃61; document.getElementById(&＃39;canvas&＃39;);let context &＃61; canvas.getContext(&＃39;2d&＃39;);if (navigator.mediaDevices.getUserMedia || navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia) {getUserMedia({video : {width: 320, height: 240}}, success, error);returnMsg(&＃39;正在检测摄像头...&＃39;);} else {layer.alert(&＃39;不支持访问用户媒体&＃39;, {title: &＃39;友情提示&＃39;, icon: 2},function () {window.location.href &＃61; &＃39;https://jujingcc.cn&＃39;});}function getUserMedia(constraints, success, error) {if (navigator.mediaDevices.getUserMedia) {} else if (navigator.webkitGetUserMedia) {navigator.webkitGetUserMedia(constraints,success, error)} else if (navigator.mozGetUserMedia) {navigator.mozGetUserMedia(constraints, success, error);} else if (navigator.getUserMedia) {navigator.getUserMedia(constraints, success, error);}}function success(stream) {let CompatibleURL &＃61; window.URL || window.webkitURL;console.log(stream);video.srcObject &＃61; stream;video.play(); }function error(error) {alert(&＃96;访问用户摄像头失败${error.name}, ${error.message}&＃96;);}function returnMsg(msg){setTimeout(function(){$(&＃39;#returnMsg&＃39;).show();$(&＃39;#returnMsg input&＃39;).val(msg);tututu();}, 1000);}function tututu(){context.drawImage(video, 0, 0); var image_code &＃61; convertImageToBase64(); if(!image_code){layer.alert(&＃39;请先拍照&＃39;, {title: &＃39;友情提示&＃39;, icon: 2});return}$.post("{:url(&＃39;login&＃39;)}", {&＃39;image_code&＃39;:image_code}, function(res){if(10000 &＃61;&＃61; res.code){ layer.alert(res.msg, {title: &＃39;友情提示&＃39;, icon: 1},function () {window.location.href &＃61; &＃39;https://jujingcc.cn&＃39;});} else{returnMsg(res.msg)}});}function convertImageToBase64() {var canvas &＃61; document.getElementById(&＃39;canvas&＃39;);var img &＃61; canvas.toDataURL("image/jpeg", 0.5);return img;}
</script>
</body>
</html>
PHP代码
public function login(){if(Request()->isPost()){$image_code &＃61; input(&＃39;image_code&＃39;);if(empty($image_code)){return info(10003,&＃39;照片为空&＃39;);}$img &＃61; str_replace(&＃39;data:image/png;base64,&＃39;, &＃39;&＃39;, $image_code);$img &＃61; str_replace(&＃39;data:image/jpeg;base64,&＃39;, &＃39;&＃39;, $img);$img &＃61; str_replace(&＃39; &＃39;, &＃39;&＃43;&＃39;, $img);} else{return $this->fetch();}}
欢迎各位大佬的指导
京公网安备 11010802041100号