我编写了一个成功激活用户网络摄像头的脚本,但在尝试停止或暂停流时会抛出错误。
我为多部分单页面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)
}
});
提前感谢您的帮助