web-dev-qa-db-fra.com

Éteignez la webcam / caméra après avoir utilisé getUserMedia

Je développe une extension Chrome qui utilise la page d'arrière-plan pour accéder à la webcam de l'utilisateur.

Les utilisateurs ont la possibilité d'éteindre l'appareil photo.

Le flux semble être désactivé. Les fonctions concernées ne reçoivent plus le flux. Cependant, la lumière de la webcam (en cours de développement et de test sur un Mac Book Pro) ne s'éteint pas.

Des idées?

Voici mon code pour configurer le flux:

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);
        }); 
}

Et voici ma méthode pour désactiver le flux:

function vidOff() {
    clearInterval(theDrawLoop);
    ExtensionData.vidStatus = 'off';
    vid.pause();
    vid.src = "";
    localstream.stop();
    DB_save();
    console.log("Vid off");
}

Une évidence que je manque?

javascriptgoogle-chrome-extensiongetusermedia
17
Niazipan

Le code ci-dessus fonctionne - comme indiqué par @jib ici en utilisant le code ci-dessus:

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

Le problème est qu'il s'agit d'une page d'arrière-plan persistante. J'échange vers pages d'événements pour l'extension Chrome extension comme solution de contournement).

6
Niazipan

localstream.stop () a été amorti et ne fonctionne plus. Voir cette question et réponse: Stop/Close webcam qui est ouvert par navigator.getUserMedia

Et ce lien:

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

Essentiellement, vous changez localstream.stop() en localstream.getTracks()[0].stop();

Voici la source de la question mise à jour:

<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" height="120" width="160" muted="muted" autoplay></video><br>
<button onclick="vidOff()">vidOff!</button><br>
<div id="div"></div>
</body>
</html>
20
CovertIII