Estoy tratando de capturar la entrada de la cámara y reproducirla en un elemento de video. Este código siempre funciona en Chrome y Safari de escritorio. En iOS siempre funciona en modo navegador usando Safari.
El problema al que me enfrento es que solo a veces no funciona en el modo PWA independiente (guardado en la pantalla de inicio) para iOS. No estoy recibiendo ningún error, y sucederá aparentemente al azar. Pensaré que lo arreglé solo para que vuelva a suceder horas después. A veces, cerrar la aplicación y volver a abrirla funciona, a veces se necesitan más de 10 intentos. He probado tantas versiones diferentes del código, asíncrono, basado en promesas, esperando onload, canplay, etc.
La transmisión se carga y está activa (cuando se otorgan los permisos), el srcObject se muestra como configurado correctamente, pero video.play() no funciona. Intenté esperar la promesa de jugar, pero a veces simplemente nunca se resolvía. El readyState del video permanece en 0. Sin embargo, a veces el código funcionará bien y el video reproducirá la transmisión de la cámara como de costumbre.
Cualquier ayuda sería muy apreciada.
navigator.mediaDevices .getUserMedia({ video: { width: { min: 640, ideal: 1280, max: 1920 }, height: { min: 480, ideal: 720, max: 1080 }, facingMode: 'environment' }, audio: true }) .then((stream) => { let video = document.createElement('video'); video.controls = true; video.muted = true; video.playsInline = true; video.onerror = function (e) { console.log(e); }; video.onabort = function (e) { console.log(e); }; console.log(stream); try { video.srcObject = stream; } catch (e) { console.log(e); window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL; video.src = window.URL && window.URL.createObjectURL(stream); } console.log('source: ', video.src); console.log('sourceObj: ', video.srcObject); console.log(video); //Dirty hack to try and debug, same result, tried waiting for play promise, play() onloaded, play() oncanplay, all same result //video state sometimes gets to 4, sometimes stays at 0 let interval = setInterval(() => { console.log(video.isConnected); console.log(video.readyState); console.log(video); console.log(stream); //will sometimes just stay at readyState 0 if (video.readyState === 4) { video.play(); window.clearInterval(interval); } }, 500); });