停止/closures由navigator.getUserMedia打开的摄像头

我使用下面的JavaScript代码打开了一个networking摄像机: navigator.getUserMedia

有没有JavaScript代码停止或closures摄像头? 感谢大家。

编辑

由于这个答案最初是张贴的浏览器API已经改变。 .stop()在传递给callback的stream上不再可用。 开发者将不得不访问构成stream(audio或video)的轨道,并单独停止它们中的每一个。

有关详情,请访问: https : //developers.google.com/web/updates/2015/07/mediastream-deprecations?hl = zh_CNstop-ended-and-active

例子(从上面的链接):

 var track = stream.getTracks()[0]; // if only one media track // ... track.stop(); 

您可以通过将要废弃的 MediaStream对象调用“ stop ” 新的提案是通过在每个媒体轨道上调用“ 停止 ”来释放媒体轨道:

 mediaStream.stop(); // or mediaStream.getAudioTracks()[0].stop(); mediaStream.getVideoTracks()[0].stop(); 

更新于2015年11月3日 – 上午10:34:24

这是一个跨浏览器的stream.stop破解:

 var MediaStream = window.MediaStream; if (typeof MediaStream === 'undefined' && typeof webkitMediaStream !== 'undefined') { MediaStream = webkitMediaStream; } /*global MediaStream:true */ if (typeof MediaStream !== 'undefined' && !('stop' in MediaStream.prototype)) { MediaStream.prototype.stop = function() { this.getAudioTracks().forEach(function(track) { track.stop(); }); this.getVideoTracks().forEach(function(track) { track.stop(); }); }; } 

用不同的浏览器启动摄像头video

对于Opera 12

 window.navigator.getUserMedia(param, function(stream) { video.src =window.URL.createObjectURL(stream); }, videoError ); 

对于Firefox每晚18.0

 window.navigator.mozGetUserMedia(param, function(stream) { video.mozSrcObject = stream; }, videoError ); 

对于Chrome 22

 window.navigator.webkitGetUserMedia(param, function(stream) { video.src =window.webkitURL.createObjectURL(stream); }, videoError ); 

用不同的浏览器停止摄像头video

对于Opera 12

 video.pause(); video.src=null; 

对于Firefox每晚18.0

 video.pause(); video.mozSrcObject=null; 

对于Chrome 22

 video.pause(); video.src=""; 

有了这个networking摄像头灯每次下来…

您可以直接使用成功处理程序中返回的stream对象getUserMedia结束stream。 例如

 localMediaStream.stop() 

video.src=""null将只是从video标签中删除来源。 它不会释放硬件。

如果.stop()被弃用,那么我不认为我们应该重新添加它像@Mazazhan剂量。 这是为什么事情被弃用,不应该再被使用的原因。 只需要创build一个辅助函数…这是一个更多的es6版本

 function stopStream (stream) { for (let track of stream.getTracks()) { track.stop() } } 

既然你需要轨道来closuresstream媒体,并且你需要stream来获取轨道,我在上面的Muaz Khan的回答帮助下使用的代码如下:

 if (navigator.getUserMedia) { navigator.getUserMedia(constraints, function (stream) { videoEl.src = stream; videoEl.play(); document.getElementById('close').addEventListener('click', function () { stopStream(stream); }); }, errBack); function stopStream(stream) { console.log('stop called'); stream.getVideoTracks().forEach(function (track) { track.stop(); }); 

当然,这将closures所有活动的video轨道。 如果你有多个,你应该相应地select。

尝试波纹pipe的方法

 var mediaStream = null; navigator.getUserMedia( { audio: true, video: true }, function (stream) { mediaStream = stream; mediaStream.stop = function () { this.getAudioTracks().forEach(function (track) { track.stop(); }); this.getVideoTracks().forEach(function (track) { //in case... :) track.stop(); }); }; /* * Rest of your code..... * */ }); /* * somewhere insdie your code you call * */ mediaStream.stop(); 

FF,Chrome和Opera已经开始通过navigator.mediaDevices作为标准曝光getUserMedia (可能会改变:)

在线演示

 navigator.mediaDevices.getUserMedia({audio:true,video:true}) .then(stream => { window.localStream = stream; }) .catch( (err) =>{ console.log(err); }); // later you can do below // stop both video and audio localStream.getTracks().forEach( (track) => { track.stop(); }); // stop only audio localStream.getAudioTracks()[0].stop(); //stop only audio localStream.getVideoTracks()[0].stop(); 

当通过http连接时,在stream上使用.stop()可以在chrome上工作。 使用ssl(https)时不起作用。

有一个streamformssuccessHandle的参考

 var streamRef; var handleVideo = function (stream) { streamRef = stream; } //this will stop video and audio both track streamRef.getTracks().map(function (val) { val.stop(); });