從網絡攝像頭捕獲圖像並存儲在php中的數據庫中

Question

我有一個捕獲圖像的Flash代碼。 這是代碼：

<object id="main" width="300" height="400" align="middle" type="application/x-shockwave-flash" name="main" data="<?php echo JS_PATH;?>bin-debug/dev.swf">
    <param name="quality" value="high">
    <param name="bgcolor" value="#ffffff">
    <param name="allowscriptaccess" value="sameDomain">
    <param name="allowfullscreen" value="true">
    <param name="flashvars" value="<?php echo HTTP_PATH.DS?>user/changeprofilepic_byweb">
</object>

在上面的代碼中：

 <param name="flashvars" value="<?php echo HTTP_PATH.DS?>user/changeprofilepic_byweb">

value參數包含控制器的路徑，函數changeprofielpic_byweb包含用於更新配置文件圖像的代碼。 我無法更新圖像。 我要去哪里錯了？ 我的Flash代碼正確嗎？ 我的Flash代碼運行正常，可以捕獲圖像，但是沒有存儲到數據庫中。 這是控制器的代碼：

 function changeprofilepic_byweb() 
    {
         echo "<script> alert('In to the function'); </script>";
        $sess_data = $this->session->userdata('logged_in');
        $this->load->library('photoslibrary');
        $this->load->Model('usersocialprofile');
        $upload_path = COMM_USER_IMAGE_PATH.$sess_data['user_id']; 

        if(!is_dir($upload_path)) 
        {
            umask(0);
            @mkdir($upload_path,077);
        }

        $db_userprofile = $this->usersocialprofile->getThumb($sess_data['user_id']);


        if(is_file(COMM_USER_IMAGE_PATH.$sess_data['user_id'].DS.$db_userprofile[0]->imageTitle)) 
        {
            $this->usersocialprofile->unlinkImage($db_userprofile[0],PROFILE_IMAGE_THUMB);

        }

        $this->load->helper("Image");
        $fileImage="";
        $data['error']="";


        $fileext='jpeg';    
        $timestamp=md5(time());
        $filename="photo".$timestamp.".".$fileext;

        $filesize = floatval((filesize($filename)/1024)/1024); // bytes to MB  
        list($width, $height, $type, $attr) = getimagesize($filename);

        $req_size=explode(",",PROFILE_IMAGE_THUMB);
        $req_size=explode("x",$req_size[0]);

        if($width<$req_size[0] || $height<$req_size[1])
        {
            $data['error']="Image required minimum ".$req_size[0]."x".$req_size[1]." pixels";
        }else {

            $data['error']="";
            $newthumb_path = "thumb".DS;

        if(!is_dir($newthumb_path))  {
            umask(0);
            @mkdir($newthumb_path,0777);
        }                

        $fileImage=imageresize($filename,$filetempname,PROFILE_IMAGE_THUMB,$upload_path.DS,false,true,true,$newthumb_path);
        $result=$this->usersocialprofile->updateImage($sess_data['user_id'] , $fileImage);
        }
    }

我認為該功能未通過Flash代碼調用。我沒有收到任何錯誤。僅顯示捕獲的圖像但未在文件夾中更新。

Answer 1

要使用網絡攝像頭上傳圖像，您只需要創建圖像並獲取設置為Flash代碼的變量的值即可。在獲取圖像時，您只需創建使用任何get或發布method.something這樣的東西：

    $fileext='jpeg';    
    $timestamp=md5(time());
    $filename="photo".$timestamp.".".$fileext;

Answer 2

下面的答案是顯示如何啟用usermedia捕獲圖像並將其存儲到數據庫中。

注意 ：在畫布上繪制圖像時，在此代碼中，該圖像始終以base64擴展名運行。我將使用php將base 64轉換為圖像，並將其存儲在數據庫中，同時將其存儲在我的圖像目錄中。

JavaScript代碼

//define DOMelements
cameraBtn = document.getElementById('camera');
floatPage1 = document.getElementById('floatPage1');
innerPage = document.getElementById('innerPage');
canvas = document.getElementById('canvasVideo');
//closing webcam
closeBtn = document.getElementById('closeBtn');

captureBtn = document.querySelector('.captureBtn');

navigator.getUserMedia = navigator.getUserMedia || 
                         navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.oGetUserMedia || navigator.msGetUserMedia;

//code below
//adEvents to the buttonclicked....
cameraBtn.addEventListener("click",buttonclickTrigger,true);
closeBtn.addEventListener("click",closeStream,true);
////////////////////////////////////////////////////////////////////////////
function buttonclickTrigger(){
  floatPage1.style.display = "block";
  innerPage.style.display = "block";
  canvas.style.display = "block";
  navigator.getUserMedia({video:
        {height:canvas.height,width:canvas.width}},function(stream){
        videoStream = stream;
        video = document.createElement("video");
        video.src= window.URL.createObjectURL(videoStream);
        video.onloadedmetadata = function(){
        $this = this;
            function canvasPlay(){
                if(!this.paused && !this.ended){
                    cSrc = canvas.getContext("2d");
                    canvasVideo = cSrc.drawImage(video,0,0);
                   }
            }
            setInterval(canvasPlay,1000/30);
            //capture image from the canvas code.....
            captureBtn.onclick = function(){
                canvas.getContext("2d").drawImage(video,0,0);
                var image = new Image();
                image.src = canvas.toDataURL("image/png");
                image = image.src;
                console.log(stream.getTracks()[0]);
                mediaUsed = stream.getTracks()[0].label;
                imageUniqueId = stream.getTracks()[0].id;
                $.ajax({
                    url:"imagesave.php",
                    method:"POST",
                    data:{image:image,mediaUsed:mediaUsed},
                    dataType:"html",
                    success:function(data){
                        alert(data);
                    } 
                });
            }
        }
    },function(err){
        alert(err);
    });
 }

PHP代碼

<?php
define ("UPLOAD_DIR","../images/");
$imageName = $_POST["image"];
$mediaUsed = $_POST["mediaUsed"];
$imageCreate = explode(";base64,",$imageName);
$image_type_aux = explode("image/", $imageCreate[0]);
$valadid_extension = $image_type_aux[1];
$convertimage = base64_decode($imageCreate[1]);
#generate random id for the image and append them.
$time = time();
$random= "circlestudio_".md5($time);
$image = UPLOAD_DIR.$random."_".uniqid() . '.png';
$fullImage = file_put_contents($image,$convertimage);

move_uploaded_file($fullImage);
$imagesplit = explode(UPLOAD_DIR,$image);
$canvas_imageFullName = $imagesplit[1];
echo $image;
?>