Estoy tratando de crear una aplicación que pueda capturar una imagen de la cámara frontal y trasera simultáneamente (en un dispositivo móvil). Tengo experiencia con la biblioteca p5.js, que me permitirá tomar una foto desde la cámara delantera o trasera. ¿Alguien tiene una idea, ejemplo o sugerencia sobre cómo lograr la funcionalidad de capturar una imagen de ambas cámaras?
Parece que la API Media Capture and Streams solo permite una selección binaria de 'usuario' o 'entorno' para el modo de orientación. Este también parece ser el caso de la biblioteca p5.js. ¿Alguien tiene una idea o ejemplo de qué hacer cuando el objetivo es capturar una imagen de la cámara delantera y trasera simultáneamente?
Definitivamente puede capturar cualquier cámara especificando la restricción adecuada. También puede enumerar y capturar cualquiera de las cámaras disponibles si las restricciones no funcionan (aunque tenga en cuenta que la enumeración de dispositivos no funcionará hasta que el usuario haya dado su consentimiento para permitir que su página acceda a la cámara). Desafortunadamente, debido a una limitación en WebKit, en los iPhones no es posible capturar simultáneamente las cámaras delantera y trasera. Puede alternar entre ellos, pero el rendimiento no es el ideal.
function setup() { createCanvas(400, 400); } let environmentCam; let isDrawing = false; function draw() { if (!isDrawing) { isDrawing = true; // Mobile Safari can only capture one camera at a time // https://bugs.webkit.org/show_bug.cgi?id=179363 // capture user then environment, this may be slow let userCam = createCapture( { video: { facingMode: "user" } }, async () => { if (environmentCam) { environmentCam.remove(); } // give the camera time to focus await delay(100); image(userCam, 0, 0, width / 2, height); environmentCam = createCapture( { video: { facingMode: "environment" } }, async () => { userCam.remove(); // give the camera time to focus await delay(100); image(environmentCam, width / 2, 0, width / 2, height); isDrawing = false; } ) } ); } } function delay(ms) { return new Promise(resolve => { setTimeout(resolve, ms); }); }