'How can I access mobile front camera and record a video in Js?

I am making a app with: Html, Css and Javascript, and I want that app access mobile front camera and record a video off the user face, I am usin Adobe Phone Gap to convert my codes to .apk

Have similar questions in StackOverflow about this, but anyone couldn't help me, I've tried searching in Google, but I found nothing

I've tried made this:


navigator.getUserMedia = navigator.getUserMedia ||
                         navigator.webkitGetUserMedia ||
                         navigator.mozGetUserMedia;

if (navigator.getUserMedia) {
   navigator.getUserMedia({ audio: true, video: { width: 1280, height: 720 } },
      function(stream) {
         var video = document.querySelector('video');
         video.srcObject = stream;
         video.onloadedmetadata = function(e) {
           video.play();
         };
      },
      function(err) {
         console.log("The following error occurred: " + err.name);
      }
   );
} else {
   console.log("getUserMedia not supported");
}

but don't work

I expect, when the user click in a button, the app will open the front cam, and the user record a video of your face.



Solution 1:[1]

You can use<input type="file" accept="image/*;capture=camera"> to access the user camera from a Browser

Solution 2:[2]

The capture attribute on file inputs (input type="file") can be used to activate photo (accept="image/*") or video (accept="video/*") mode on the front (capture="user") or rear (capture="user") camera.

Note:

<input type="file" id="soundFile" capture="user" accept="audio/*"><br/>
<input type="file" id="videoFile" capture="environment" accept="video/*"><br/>
<input type="file" id="imageFile" capture="user" accept="image/*">

Source: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Brayan Garcia
Solution 2 OXiGEN