使用 getUserMedia 后关闭网络摄像头/摄像头 [重复]

Posted

技术标签:

【中文标题】使用 getUserMedia 后关闭网络摄像头/摄像头 [重复]【英文标题】：Turn off webcam/camera after using getUserMedia [duplicate] 【发布时间】：2015-03-24 06:39:18 【问题描述】：

我正在开发一个使用后台页面访问用户网络摄像头的 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");

我有什么明显的遗漏吗？

【问题讨论】：

我不知道扩展或背景页面，但your code 在我的 macbook pro fwiw 上的常规内容处理中工作正常（灯熄灭）。你有任何错误吗？ 遗憾的是没有。我认为这一定是因为它是一个不可见的过程，它没有更新。 【参考方案1】：

localstream.stop() 已被贬值，不再有效。看到这个问题和答案： Stop/Close webcam which is opened by navigator.getUserMedia

还有这个链接：

https://developers.google.com/web/updates/2015/07/mediastream-deprecations?hl=en#stop-ended-and-active

基本上你将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"   muted="muted" autoplay></video><br>
<button onclick="vidOff()">vidOff!</button><br>
<div id="div"></div>
</body>
</html>

【讨论】：

【参考方案2】：

上面的代码有效 - 如@jib here 使用上面的代码所示：

function vidOff() 
    vid.pause();
    vid.src = "";
    localstream.stop();

问题在于它是一个持久的背景页面。我正在换用 event pages 作为 Chrome 扩展程序。

【讨论】：

当我使用小提琴并单击“视频关闭”时，视频确实停止，但网络摄像头仍然打开。

以上是关于使用 getUserMedia 后关闭网络摄像头/摄像头 [重复]的主要内容，如果未能解决你的问题，请参考以下文章

使用 getUserMedia 和 RTCPeerConnection Chrome 25 停止/关闭网络摄像头

在html5中使用navigator.getUserMedia打开相机，要怎样进行关闭？

哪个相机会在移动设备中打开 getUserMedia API？前还是后？

如何使用 getusermedia 让网络摄像头在 Firefox 上可靠地工作？

网络摄像头 getUserMedia API - AngularJS 错误？

无法在第一页加载时在 Google Chrome 中使用 HTML5 和 getUserMedia() 从网络摄像头拍照