HTML5 capture audio from default microphone

Question

Can somebody help me on how to capture audio from default microphone using HTML5? There are many samples available, but none of them seem to working. I have tried Audio capturing with HTML5 As it only works with chrome with flags enabled. but it's getting NavigatorUserMediaError. The video icon on the address bar has a red cross sign and its tooltip says 'this page has been blocked from accessing your camera and microphone'

Answer 1

There's some great articles on HTML5 Rocks. This is just one that I pulled. http://updates.html5rocks.com/2012/09/Live-Web-Audio-Input-Enabled

// success callback when requesting audio input stream
function successCallback(stream) {
    var audioContext = new (window.webkitAudioContext)();

    // Create an AudioNode from the stream.
    var mediaStreamSource = audioContext.createMediaStreamSource( stream );

    // Connect it to the destination to hear yourself (or any other node for processing!)
    mediaStreamSource.connect( audioContext.destination );
}

function errorCallback() {
    console.log("The following error occurred: " + err);
}

navigator.webkitGetUserMedia( {audio:true}, successCallback, errorCallback );

Answer 2

make sure you start the demo from a webserver - simply copy/paste & start from file system won't work - in chrome you never get access to the mic this way.

Answer 3

Recently (not sure when) Chrome added the requirement that the page be accessed over SSL to enable getUserMedia.