使用 getUserMedia 后关闭 webcam/camera
Turn off webcam/camera after using getUserMedia
我正在开发一个 Chrome 扩展,它使用后台页面访问用户的网络摄像头。
用户可以选择关闭相机。
流似乎正在关闭。相关功能不再接收流。但是网络摄像头灯(目前正在 mac book pro 上开发和测试)不会关闭。
有什么想法吗?
这是我设置流的代码:
if (navigator.webkitGetUserMedia!=null) {
var options = {
video:true,
audio:false
};
navigator.webkitGetUserMedia(options,
function(stream) {
vid.src = window.webkitURL.createObjectURL(stream);
localstream = stream;
vid.play();
console.log("streaming");
},
function(e) {
console.log("background error : " + e);
});
}
这是我关闭流的方法:
function vidOff() {
clearInterval(theDrawLoop);
ExtensionData.vidStatus = 'off';
vid.pause();
vid.src = "";
localstream.stop();
DB_save();
console.log("Vid off");
}
我明显遗漏了什么?
上面的代码有效 - 正如@jib here 使用上面的代码所示:
function vidOff() {
vid.pause();
vid.src = "";
localstream.stop();
}
问题在于它是一个持久的后台页面。作为变通方法,我将换成 event pages 以获得 Chrome 扩展。
localstream.stop() 已贬值且不再有效。看到这个问题和答案:
Stop/Close webcam which is opened by navigator.getUserMedia
还有这个link:
基本上你将 localstream.stop()
更改为 localstream.getTracks()[0].stop();
这里更新了问题的来源:
<html>
<head>
<script>
var console = { log: function(msg) { div.innerHTML += "<p>" + msg + "</p>"; } };
var localstream;
if (navigator.mediaDevices.getUserMedia !== null) {
var options = {
video:true,
audio:false
};
navigator.webkitGetUserMedia(options, function(stream) {
vid.src = window.URL.createObjectURL(stream);
localstream = stream;
vid.play();
console.log("streaming");
}, function(e) {
console.log("background error : " + e.name);
});
}
function vidOff() {
//clearInterval(theDrawLoop);
//ExtensionData.vidStatus = 'off';
vid.pause();
vid.src = "";
localstream.getTracks()[0].stop();
console.log("Vid off");
}
</script>
</head>
<body>
<video id="vid" height="120" width="160" muted="muted" autoplay></video><br>
<button onclick="vidOff()">vidOff!</button><br>
<div id="div"></div>
</body>
</html>
我正在开发一个 Chrome 扩展,它使用后台页面访问用户的网络摄像头。
用户可以选择关闭相机。
流似乎正在关闭。相关功能不再接收流。但是网络摄像头灯(目前正在 mac book pro 上开发和测试)不会关闭。
有什么想法吗?
这是我设置流的代码:
if (navigator.webkitGetUserMedia!=null) {
var options = {
video:true,
audio:false
};
navigator.webkitGetUserMedia(options,
function(stream) {
vid.src = window.webkitURL.createObjectURL(stream);
localstream = stream;
vid.play();
console.log("streaming");
},
function(e) {
console.log("background error : " + e);
});
}
这是我关闭流的方法:
function vidOff() {
clearInterval(theDrawLoop);
ExtensionData.vidStatus = 'off';
vid.pause();
vid.src = "";
localstream.stop();
DB_save();
console.log("Vid off");
}
我明显遗漏了什么?
上面的代码有效 - 正如@jib here 使用上面的代码所示:
function vidOff() {
vid.pause();
vid.src = "";
localstream.stop();
}
问题在于它是一个持久的后台页面。作为变通方法,我将换成 event pages 以获得 Chrome 扩展。
localstream.stop() 已贬值且不再有效。看到这个问题和答案: Stop/Close webcam which is opened by navigator.getUserMedia
还有这个link:
基本上你将 localstream.stop()
更改为 localstream.getTracks()[0].stop();
这里更新了问题的来源:
<html>
<head>
<script>
var console = { log: function(msg) { div.innerHTML += "<p>" + msg + "</p>"; } };
var localstream;
if (navigator.mediaDevices.getUserMedia !== null) {
var options = {
video:true,
audio:false
};
navigator.webkitGetUserMedia(options, function(stream) {
vid.src = window.URL.createObjectURL(stream);
localstream = stream;
vid.play();
console.log("streaming");
}, function(e) {
console.log("background error : " + e.name);
});
}
function vidOff() {
//clearInterval(theDrawLoop);
//ExtensionData.vidStatus = 'off';
vid.pause();
vid.src = "";
localstream.getTracks()[0].stop();
console.log("Vid off");
}
</script>
</head>
<body>
<video id="vid" height="120" width="160" muted="muted" autoplay></video><br>
<button onclick="vidOff()">vidOff!</button><br>
<div id="div"></div>
</body>
</html>