web-dev-qa-db-fra.com

Chrome: navigator.mediaDevices.getUserMedia n'est pas une fonction

Je suis sur localhost et j'essaie d'utiliser la méthode MediaDevices.getUserMedia dans Chrome. Je reçois l'erreur comme intitulé. Je comprends que dans Chrome il n'est possible d'utiliser cette fonction qu'avec une origine sécurisée et que localhost est considéré comme une origine sécurisée. De plus, cela fonctionne dans Firefox.

Voici comment je l'utilise comme indiqué sur le site Web des développeurs Google https://developers.google.com/web/updates/2015/10/media-devices?hl=en :

var constraints = window.constraints = {
            audio: false,
            video: true
};


navigator.mediaDevices.getUserMedia(constraints).then(function(stream) {
            callFactory.broadcastAssembly(stream);
            ...
});
11
muninn9

Essayez d'activer: chrome: // flags/# enable-experimental-web-platform-features

A travaillé pour moi en chrome

7
Simon Malone

Sur certains navigateurs récents navigator.getUserMedia ne fonctionne pas bien. Essayez donc d'utiliser navigator.mediaDevices.getUserMedia . Ou, mieux vaut vérifier si navigator.mediaDevices.getUserMedia est disponible pour l'utilisation du navigateur navigator.mediaDevices.getUserMedia ou bien utilisez navigator.getUserMedia.

navigator.getWebcam = (navigator.getUserMedia || navigator.webKitGetUserMedia || navigator.moxGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);
if (navigator.mediaDevices.getUserMedia) {
    navigator.mediaDevices.getUserMedia({  audio: true, video: true })
    .then(function (stream) {
                  //Display the video stream in the video object
     })
     .catch(function (e) { logError(e.name + ": " + e.message); });
}
else {
navigator.getWebcam({ audio: true, video: true }, 
     function (stream) {
             //Display the video stream in the video object
     }, 
     function () { logError("Web cam is not accessible."); });
}

J'espère que cela résoudra votre problème.

7
Amrendra

J'avais aussi ce problème et changer de drapeau ne semblait pas fonctionner. Je suis tombé sur cette chrome - Web Server for Chrome dans Google's WebRTC tutorial qui semblait faire l'affaire.

0
ellerynz

Utilisez plutôt navigator.getUserMedia () .

navigator.getUserMedia(constraints, successCallback, errorCallback);
0
Adrian Ber

Avez-vous essayé d'inclure adapter.js Polyfill? Consultez cette page: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia#Browser_compatibility

Il ressemble à ceci ou l'activation de chrome://flags/#enable-experimental-web-platform-features Conformément à la note de @Simon Malone Est nécessaire pour Chrome.

0
Philippe Sultan