Question

我正在尝试使用javascript函数关闭网络摄像头（它必须在收到一些Ajax响应后关闭），但似乎无法关闭而不刷新页面。关闭它的所有方法，如video.src = null，video.pause ...等在任何浏览器中根本不起作用。唯一的方法是关闭在成功函数上作为参数传递的流，所以有什么方法可以在函数成功之外使用这个对象来关闭网络摄像头？

我知道之前已经问过这个问题（Stop/Close webcam using getUserMedia and RTCPeerConnection Chrome 25），但我的需求不同，所以我需要一些帮助来解决这个问题

谢谢！

编辑：我的工作代码试图关闭网络摄像头：

navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia ||  navigator.webkitGetUserMedia || navigator.msGetUserMedia;
if(navigator.getUserMedia){
  var video_constraints = {
    mandatory: {
       maxHeight: 480,
       maxWidth: 640 
    },
    optional: []
  };
  var self = this;
  self.navigator.getUserMedia({
      audio: false,
      video: video_constraints
  }, self.onSuccess, onError);
}
else{
  alert('An error has occurred starting the webcam stream, please revise the instructions to fix the problem');
}

function onSuccess(stream) {
  var video = document.getElementById('webcam');

  if(navigator.webkitGetUserMedia || navigator.mozGetUserMedia){
      video.src = window.URL.createObjectURL(stream);
  }
  else if(navigator.msGetUserMedia){
      //future implementation over internet explorer
  }
  else{
      video.src = stream;
  }
  self.localStream = stream;
  video.play();
}
function onError() {
  alert('There has been a problem retrieving the streams - did you allow access?');
}

function closeWebcamConnection(){
  this.localStream.stop();
}

uff ..在这里发布代码XD真的很复杂

Answer 1

保存对LocalMediaStream的引用，如asgoth建议是正确的，但对于我来说，Chrome 47. localStream.stop();给了我一个错误：

Uncaught TypeError: localStream.stop is not a function

我通过致电来了解它：

localStream.getVideoTracks()[0].stop();

Answer 2

您需要通过执行LocalMediaStream方法来停止stop()对象。我有类似的问题。你需要做的是：

在LocalMediaStream执行的onSuccess回调函数中保留对getUserMedia()的引用：

var localStream;

onUserMediaSuccess = function(stream) {
   // attach to a video element
   ...
   // keep a reference
   localStream = stream;
};

在需要的地方停止LocalMediaStream：

localStream.stop();

我自己question（和answer）中的更多信息。

Answer 3

加入asgoth's answer

localStream.stop（）在Chrome 45中已弃用，已在Chrome 47中删除

如果你从多个地方调用.stop（），你可以使用以下帮助程序来使用stop函数将逻辑保存在一个地方。

var localStream;

onUserMediaSuccess = function(stream) {

  // re-add the stop function
  if(!stream.stop && stream.getTracks) {
    stream.stop = function(){         
      this.getTracks().forEach(function (track) {
         track.stop();
      });
    };
  }

  // attach to a video element
  ...
  // keep a reference
  localStream = stream;
};

Answer 4

这似乎是Chrome中的一个错误区域，而且行为也在不断变化。这似乎有效，只有通过http（而不是https）连接：

var myStream;
function successCallback( stream ) {
    ...
    myStream = stream; // used to close the stream later
}

function closeStream(){
   myStream.stop(); 
   myStream = null;
}

由于一些奇怪的原因，这不适用于SSL（https）（在Chrome for Linux，Ver 27 Dev上检查）

Answer 5

我在关闭视频流轨道（前置摄像头）和打开Chrome 49中的备用轨道（后置摄像头）时遇到问题。我发现自{45}版以来MediaStream.stop()已弃用替换为MediaStreamTrack.stop()。您可以通过Sam Dutton在Google开发者网站上的posting了解更多信息。

Answer 6

要删除浏览器标签上的红色符号并禁用这两个符号，视频和音频会在收到其中一个错误后播放

Uncaught TypeError: localStream.stop is not a function
Uncaught TypeError: _webRTCStream.stop is not a function // TokBox, OpenTok

遍历找到的曲目并将其全部停止。

if (_webRTCStream.stop) {
  _webRTCStream.stop() // idk what this does, left here for legacy reasons..?
} else {
  _webRTCStream.getTracks().forEach(function(track) { track.stop() })
}

注意：_webRTCStream等于localStream，取决于您正在使用的库。

Answer 7

if (sourcevid.mozSrcObject) {
  sourcevid.mozSrcObject.stop();
  sourcevid.src = null;
} else {
  sourcevid.src = "";
  localStream.stop();
}

停止getUserMedia的网络摄像头流媒体，无需刷新页面

7 个答案: