Actualmente estoy tratando de mejorar mis habilidades de JS revisando los 30 días de JavaScript de WesBos. (¡Es realmente divertido si!) Actualmente estoy en el día 19, que se trata de usar JS para acceder a la cámara web y luego agregar efectos usando CSS.

Pude configurar con éxito un servidor local, y aquí está mi código hasta ahora:

 function getVideo() { navigator.mediaDevices.getUserMedia({video: true, audio: false}) .then(localMediaStream => { console.log(localMediaStream); video.src = window.URL.createObjectURL(localMediaStream); video.play(); }) .catch(err => { console.error(`Web camera access is not enabled. To resolve, reload the page and allow access.`, err); }); } getVideo();

Sin embargo, estoy recibiendo este error:

 TypeError: URL.createObjectURL: Argument 1 is not valid for any of the 1-argument overloads. getVideo http://localhost/19-webcam-fun/scripts.js:12 promise callback*getVideo http://localhost/19-webcam-fun/scripts.js:10 <anonymous> http://localhost/19-webcam-fun/scripts.js:27

No sé si esto ayuda, pero console.log (localMediaStream) da como resultado lo siguiente:

 MediaStream { id: "{97c3d27e-404e-4d14-b1d2-2a9ebbf09137}", active: true, onaddtrack: null, onremovetrack: null }​ active: true​ id: "{97c3d27e-404e-4d14-b1d2-2a9ebbf09137}"​ onaddtrack: null​ onremovetrack: null​ <prototype>: MediaStreamPrototype { getAudioTracks: getAudioTracks(), getVideoTracks: getVideoTracks(), getTracks: getTracks(), … }

¡Agradecería mucho si alguien pudiera ayudarme a entender esto un poco mejor! ¡Gracias!