Cuando ejecuto el html con el servidor en vivo de VScode, todo se ejecuta normalmente y el script insertado obtiene los medios normalmente, pero cuando empiezo a servir este html a través de un servidor express, navigator.mediaDevices.getUserMedia() no funciona como lo hace. devuelve nulo//indefinido, ¿cómo resolverlo?
Este es un código html, se ejecuta normalmente con la recarga en vivo y muestra la cámara web:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>View Webcam</title> </head> <body> <style type="text/css"> #container { margin: 0px auto; width: 500px; height: 375px; border: 10px #333 solid; } #videoElement { width: 500px; height: 375px; background-color: #777; } </style> <div id="container"> <video autoplay="true" id="videoElement"></video> </div> <script type="text/javascript"> var video = document.querySelector("#videoElement"); navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia || navigator.oGetUserMedia; console.log(navigator.mediaDevices.getUserMedia) if (navigator.getUserMedia) { navigator.getUserMedia({ video: true }, handleVideo, videoError); } function handleVideo(stream) { video.srcObject = stream; video.play(); } function videoError(e) {} </script> </body> </html>Pero, cuando envío este html con express, sucede esto (código express):
const express = require('express'); const path = require('path'); const app = express(); const port = process.env.PORT || 3000; app.set('view engine', 'ejs') app.use(express.static("public")); app.get('/', (req, res) => { res.sendFile(path.resolve() + "/public/index.html") }) app.listen(port, () => { console.log(`Running at port ${port}`) })Impresión de error en terminal
¿Alguna ayuda?