停止/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(); });