Get mic/webcam record stream using javascript/html5 only

Question

I making a web application that need to record stream from the pc/mobile mic/camera using java script and html5(no flash). how i can do it?

Answer 1

There are two methods, getusermedia and the legacy method using an input, which is what ios6 allows:

Old way:

<input type="file" accept="video/*;capture=camcorder">
<input type="file" accept="audio/*;capture=microphone">

Current way:

window.URL = window.URL || window.webkitURL;
navigator.getUserMedia  = navigator.getUserMedia || navigator.webkitGetUserMedia ||
                          navigator.mozGetUserMedia || navigator.msGetUserMedia;

var video = document.querySelector('video');

if (navigator.getUserMedia) {
  navigator.getUserMedia({audio: true, video: true}, function(stream) {
    video.src = window.URL.createObjectURL(stream);
  }, onFailSoHard);
} else {
  video.src = 'somevideo.webm'; // fallback.
}

These samples were copied from here . HTML5Rocks has many working samples as well.

Answer 2

navigator.getUserMedia ( constraints, successCallback, errorCallback );

• Short description with example
• API
• Supported browsers