无法关闭网络摄像头

时间:2014-08-04 15:50:42

标签: javascript jquery getusermedia

我编写了一个成功激活用户网络摄像头的脚本,但在尝试停止或暂停流时会抛出错误。

我为多部分单页面webapp构建了一个原型,要求用户激活然后停用他们的网络摄像头。此版本的原型实际上并不捕获和存储网络摄像头图像,用户能够停用摄像头以使他们感觉不到他们受到监视是特别重要的。

以下是我的脚本,它使用名为compatibility的webRTC功能检测库。行$ video.pause()导致以下错误

“Chrome 36.x中未捕获的TypeError:undefined不是函数”

在devtools中键入“$ video”时,点击返回给我这个

[]但是做$ video [0] .pause()给了我同样的错误信息。

我在考虑做类似window.URL.revokeObjectURL(stream)的事情 - 在我的情况下是compatibility.URL.revokeObjectURL(stream) - 是要走的路,但想在深入研究之前得到一些建议

// get it
var smoother = new Smoother(0.85, [0, 0, 0, 0, 0]),
    $video = $("#v"),
    $local_media = null;

webcam_capture = function(x){
    try {
        compatibility.getUserMedia({video: true}, function(stream) {
            try {
                $video.attr('src', compatibility.URL.createObjectURL(stream));          
            } catch (error) {
                $video.attr(src, stream);                       
            }   
            $('.camera_prompt').removeClass('show')
        }, function (error) {
            alert("WebRTC not available");
        });
    } catch (error) {
        console.log(error);
    }
}


webcam_capture();

// warn - prompt permissions after 6 seconds
capture_error = setTimeout(function(){
    typeof $video.attr('src') == "undefined" ?  
    $('.camera_prompt').addClass('show') :
    clearTimeout(capture_error);
},3000) 

start_card_capture = function(x){
    // open capture sesh
    OAO.card_capture_status = true;
    // get id of input to focus and class
    var id = 'capture_' + x;
    $('input#' + id).addClass('focused');
    // UI fade in
    $('#v, .notification, button.capture').fadeIn();
}

end_card_capture = function(x){
    // close capture sesh
    OAO.card_capture_status = false;    
    // UI fade out 
    $('#v, .notification, button.capture').fadeOut('visible');
}


capture_notify = function(x){
    $('#card_capture_form').find('.notification').find('div').text(x)
}


$('.capture').on('click', function(e){
    // determine input
    var $f = $(this).parent('form')
        $i = $f.find('input.focused');
    // check input and update the associated label's icon
    $i.prop('checked', true).removeClass('focused');
    $i.next('label').addClass('captured');
    // close UI

    if($f.find('label.captured').length < 2){
        end_card_capture(e)
    }

    if($f.find('label.captured').length == 2){
        $video.pause();
        OAO.sectional_transition('#funding',{y: '0%'}, 1400,100, $(this).parents('section'), { y: '-250%' }, 1000, 100  );
        OAO.step = 2;
        OAO.progress_bar(OAO.step)
        $('#progress_bar_container').removeClass('hidden');
    }

});


$('.capture_front, .capture_back').on('click', function(){
    // determine which side
    $(this).hasClass('capture_front') ?
    OAO.card_capture_side = 'front' :
    $(this).hasClass('capture_back') ?
    OAO.card_capture_side = 'back' :
    C('whichsideofthecardamIshooting?');


    if(typeof $video.attr('src') !== "undefined"){
        // set prop and init capture
        capture_notify(OAO.card_capture_side);
        start_card_capture(OAO.card_capture_side)
    }
  });

提前感谢您的帮助

0 个答案:

没有答案