остановить потоковое воспроизведение веб-камеры getUserMedia без обновления страницы

Question

Я пытаюсь закрыть веб-камеру с помощью функции javascript (она должна быть закрыта после получения некоторого ответа Ajax), но это невозможно закрыть, не обновляя страницу. Все методы для его закрытия как video.src = null, video.pause ... и т. Д. Вообще не работают в любом браузере. Единственный способ - закрыть поток, переданный как параметр, в функции успеха, так что есть какой-либо способ использовать этот объект вне функции, чтобы закрыть веб-камеру?

Я знаю, что этот вопрос был задан до (Stop/Close webcam using getUserMedia and RTCPeerConnection Chrome 25), но мои потребности различны, поэтому я должен был бы некоторую помощь, чтобы решить эту проблему

спасибо!

EDIT: Мой рабочий код пытается закрыть веб-камера:

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..it действительно сложно размещать сюда код XD

Answer 1

Вы должны остановить 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 2

Это, по-видимому, багги в 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 для Linux, Ver 27 Dev)

Answer 3

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

Answer 4

Сохранение ссылки на LocalMediaStream как asgoth наводит на мысль правильна, но для меня в Chrome 47. localStream.stop(); дал мне ошибку:

Uncaught TypeError: localStream.stop is not a function 

Я получил его на работу по телефону:

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

Answer 5

Чтобы избавиться от красного символа на вкладке браузера и для отключения обоих, VIdeo и Audio потоки по получать один из этих ошибок

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 6

Дополнение к asgoth's answer

localStream.stop() is deprecated in Chrome 45, removed in Chrome 47

Если и называть .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 7

У меня была проблема, закрывая видеопотока дорожки (фронтальная камера) и открывая альтернативный трек (задний перед камерой) в Chrome 49. Я обнаружил, что MediaStream.stop() является устаревшим, начиная с версии 45, и был заменен на MediaStreamTrack.stop(). Вы можете прочитать больше от posting на сайте разработчика Google Сэмом Даттоном.