Question

我拍摄快照后关闭网络摄像头时遇到问题。下面的代码效果很好 - 但是一旦我在画布上有所有内容，我就无法弄清楚如何关闭网络摄像头。

我尝试了一些我通过一些研究找到的方法，但似乎都没有帮助。

我试过添加video.stop（）;在“snap”eventListener中，它说“undefined不是一个函数”，但是我读过的大部分内容都说它应该有用吗？

错误截图：https://www.dropbox.com/s/h7g4cidqhimc5ij/Screenshot%202014-08-04%2013.08.04.png

总而言之，当有人点击“拍照”时，我希望拍摄照片并关闭相机硬件。下面代码后半部分的事件列表是“拍照”按钮。

function startCam() {
$('#can').hide();
$('#video').show();
$('#tab1-retry').hide();
$('#save-tab1').hide();
var video = document.getElementById("video"),
    mask = document.getElementById("mask"),
    videoObj = {
        "video": true
    },
    errBack = function(error) {
        console.log("Video capture error: ", error.code);
    };

// Put video listeners into place
if (navigator.getUserMedia) { // Standard
    navigator.getUserMedia(videoObj, function(stream) {
        video.src = stream;
        video.play();
    }, errBack);
} else if (navigator.webkitGetUserMedia) { // WebKit-prefixed
    navigator.webkitGetUserMedia(videoObj, function(stream) {
        video.src = window.webkitURL.createObjectURL(stream);
        video.play();
    }, errBack);
} else if (navigator.mozGetUserMedia) { // WebKit-prefixed
    navigator.mozGetUserMedia(videoObj, function(stream) {
        video.src = window.URL.createObjectURL(stream);
        video.play();
    }, errBack);
}

document.getElementById("snap").addEventListener("click", function() {



window.canvas1 = new fabric.Canvas('canvas');
video.pause();
$('#video').hide();
$('#snap').hide();
$('#can').show();
$('#save-tab1').show();
$('#tab1-retry').show();

// VIDEO CAPTURE
var imgInstance = new fabric.Image(video, {
    left: 0,
    top: 0,
});
imgInstance.set('selectable', false);
canvas1.add(imgInstance);

// FIRST LAYER
mask = document.getElementById("mask");
var imgInstance1 = new fabric.Image(mask, {
    left: 100,
    top: 100,
    cornerSize: 20
});
imgInstance1.set('selectable', true);
canvas1.add(imgInstance1);

// CANVAS LAYER

canvas1.setActiveObject(canvas1.item(1));
canvas1.item(1)['evented'] = true;
canvas1.calcOffset();
canvas1.renderAll();
});

}

Answer 1

在成功回调函数中，您可以将流初始化为变量说：

var cameraStream = stream;
video.src = window.URL.createObjectURL(stream);

然后在你的＆＃39; snap＆＃39; eventListener你可以在截取屏幕截图并关闭/停止cameraStream之后暂停（）视频流：

video.pause();
cameraStream.stop();

.stop（）关闭网络摄像头输入。

“拍照”后关闭网络摄像头

1 个答案: