2017-04-05 104 views
0

我想从网络摄像头捕获图像并将其存储到数据库和文件路径,但它不会存储在数据库中,也不会存储在文件路径中。从网络摄像头和商店捕获图像

我的观点:

<script type="text/javascript" src="<?php echo base_url() ?>assets/dist/js/webcam.min.js"></script> 


<div class="form-group"> 
             <div class="col-sm-3 col-md-offset-3 no-print"> 
              <!--<img src="<?php echo base_url(); ?>assets/images/blank.png" >--> 
              <div class="clearfix" id="my_camera"></div><br> 
              <button type="button" class="btn btn-info" onClick="take_snapshot()"><i class="fa fa-camera fa-fw"></i>Capture</button> 
             </div> 
             <div class="col-md-3 col-md-offset-1 imager" id="results"> 
              <!--<img src="<?php echo base_url(); ?>assets/images/user.png" class="thumbnail" >--> 
              <h3>Visitors Photo</h3> 
             </div> 
            </div> 
<script language="JavaScript"> 
     function take_snapshot() {     
      Webcam.snap(function (data_uri) {      
       document.getElementById('results').innerHTML = 
         '<h2>Here is your image:</h2>' + 
         '<img src="' + data_uri + '"/>'; 
      }); 
     } 
    </script> 
<script language="JavaScript"> 
     Webcam.set({ 
      width: 320, 
      height: 240, 
      image_format: 'jpeg', 
      jpeg_quality: 90 
     }); 
     Webcam.attach('#my_camera'); 
    </script> 

回答

0

如果你使用https://github.com/jhuckaby/webcamjs/blob/master/DOCS.md可以

Webcam.snap(function (data_uri) {      
       document.getElementById('results').innerHTML = 
         '<h2>Here is your image:</h2>' + 
         '<img src="' + data_uri + '"/>'; 
      }); 

必须像

Webcam.snap(function (data_uri) {      
        document.getElementById('results').innerHTML = 
          '<h2>Here is your image:</h2>' + 
          '<img src="' + data_uri + '"/>'; 
        Webcam.upload(data_uri, '<?php echo site_url('controlerfunctiontoupload'); ?>', function(code, text) { 
      if (code == '200') { 
       alert ('ok'); 
      } else { 
       alert('error'); 
      } 
     }); 
       }); 

看到文档

upload_name  "webcam" 
在CONTROLER

/功能上传

$filename='test.jpg'; 
$filepath=FCPATH.'folderWithRights0777/'.$filename; 
    $result=move_uploaded_file($_FILES['webcam']['tmp_name'], $filepath)); 

也插入数据库

$this->db->from('files'); 
$this->db->set('image', $filename); 
$this->db->insert(); 
+0

我使用按照你的转诊链接上面和简单的PHP使用它,它的工作,但是当我使用它的笨它显示localhost所说的错误:Webcam.js错误:无法找到要附加到的DOM元素。你可以现在检查我的代码仅在查看页面上方,而不是我在上面的查看页面更新的所有代码。 – dipti

+0

您应该在页面加载后启动网络摄像头!在document.ready事件上运行 ,或者在div id my_camera后运行javascript。这就是为什么“无法找到DOM元素” – ShadowElf

+0

感谢您的建议,启动网页浏览器后,页面加载它工作正常。 – dipti