美文网首页
js调起摄像头拍照,php存入的数据库

js调起摄像头拍照,php存入的数据库

作者: 风度翩翩的程序猿 | 来源:发表于2020-12-07 21:36 被阅读0次

    简单来说就是,人脸采集的时候,相比大部分人来说高考,中考,成人高考,学校采集信息的时候,你要在电脑面前拍照。
    html+js代码

    <td valign="middle" class="text-center">
        <video id="video"style="width:150px;height:200px; border:solid thin #EEE;" autoplay="autoplay"></video>
      </td>
      <td valign="middle" class="text-center">
         <canvas id="canvas" width="640" height="480" hidden style="width:150px;height:200px; border:solid thin #EEE;"></canvas>
        <img id="imgview" scr="" width="640" height="480" style="width:150px;height:200px; border:solid thin #EEE;">
        </td>
    
    <td rowspan="2" class="text-center" style="vertical-align:middle !important;">
              <div id="qd" onclick="camera()" class="btn btn-primary btn-sm">
                  <i class="fa fa-camera"  id="camera" aria-hidden="true"></i> 拍摄照片
              </div>
             <div id="cjzp" onclick="queren()" class="btn btn-success btn-sm">
                 <i class="fa fa-upload" aria-hidden="true"></i> 确认采集
                 </div> 
    </td>
    
    <script>
        let constraints = {
            video: {
                width: 480,
                height: 640
            },
            // audio: true
        };
        //获得video摄像头区域
        let video = document.getElementById("video");
    
        // 这里介绍新的方法,返回一个 Promise对象
        // 这个Promise对象返回成功后的回调函数带一个 MediaStream 对象作为其参数
        // then()是Promise对象里的方法
        // then()方法是异步执行,当then()前的方法执行完后再执行then()内部的程序
    
        // 避免数据没有获取到
        let promise = navigator.mediaDevices.getUserMedia(constraints);
        // 成功调用
        promise.then(function (MediaStream) {
            /* 使用这个MediaStream */
            video.srcObject = MediaStream;
            video.play();
            // console.log(MediaStream); // 对象
        });
        // 失败调用
        promise.catch(function (err) {
            /* 处理error */
            console.log(err); // 拒签
        });
    
        function camera(){
            var number = $('#number').text();
            if(number == ''){
                alert('该人员不存在');
                return ;
            }
            //获得Canvas对象
            let video = document.getElementById("video");
            let canvas = document.getElementById("canvas");
            canvas.getContext('2d').drawImage(video, 0, 0, 640, 480);
            let photo = canvas.toDataURL("image/jpeg");
            $('#imgview').attr('src',photo)
        }
    
        function queren() {
            var photo = $('#imgview').attr('src')
            var number = $('#number').text();
            if(number == ''){
                alert('该人员不存在');
                return ;
            }
            $.post('<?= site_url($folder . '/photograph/caiji')?>',{photo:photo,number:number},function (re) {
                if(re == 1){
                    alert('采集成功');
                }
            });
        }
    </script>
    

    上面的这些代码就是调起摄像头,并且拍照,拍照形成的类型是base64,需要后端处理
    php代码

      public function caiji(){
            $post = $this->input->post();
            // base64转url
            if (preg_match('/^(data:\s*image\/(\w+);base64,)/', $post['photo'], $result)){
                $type = $result[2];
                $session_id = session_id();
                $file_name = $session_id . '-' . time();
                $targetFolder = $this->create_dir('img');
                $targetFile = $file_name . '.' . $type;//文件全名
                $targetThumbFile = $file_name . '_thumb' . '.' . $type;
                $targetPath = $targetFolder . $targetFile;//文件路径
                if (file_put_contents($targetPath, base64_decode(str_replace($result[1], '', $post['photo'])))){
                    // $targetPath 路径
                    // 修改照片
                    $this->db->update('faceos_user',array('face_info'=>$targetPath),array('number'=>$post['number']));
                    echo 1;
                }else{
                    echo false;
                }
            }else{
                return false;
            }
        }
    
    
        //创建上传目录
        public function create_dir($module = 'img')
        {
            $root_dir = ('./upload');
            $module_dir = $root_dir . '/' . $module;
            $year_dir = $module_dir . '/' . date('Y', time());
    
            $month_dir = $year_dir . '/' . date('m', time());
            $day_dir = $month_dir . '/' . date('d', time());
            if (!is_dir($root_dir)) {
                mkdir($root_dir);
            }
            if (!is_dir($module_dir)) {
                mkdir($module_dir);
            }
            if (!is_dir($year_dir)) {
                mkdir($year_dir);
            }
            if (!is_dir($month_dir)) {
                mkdir($month_dir);
            }
            if (!is_dir($day_dir)) {
                mkdir($day_dir);
            }
            return $day_dir . '/';
        }
    
    

    这些代码仅供参考,因为每个框架的代码都不一样,这个是CI3

    相关文章

      网友评论

          本文标题:js调起摄像头拍照,php存入的数据库

          本文链接:https://www.haomeiwen.com/subject/bnqxgktx.html