X
Tap here to go to the mobile version of the site.

Support Forum

MediaRecorder API starts recording an audio after few seconds delay

Posted

I am using MediaRecorder API (https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder) to record/capture an audio from the browser. It works fine on chrome. But audio starts recording after few seconds delay on firefox (not every time). Struggling to solve this issue last 2 days. I ended up here for the help. I'm sure that someone might have faced this issue earlier. Can somebody help me on this?

Same sample code has been used from the above link. I can provide my working code if needed.

I am using MediaRecorder API (https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder) to record/capture an audio from the browser. It works fine on chrome. But audio starts recording after few seconds delay on firefox (not every time). Struggling to solve this issue last 2 days. I ended up here for the help. I'm sure that someone might have faced this issue earlier. Can somebody help me on this? Same sample code has been used from the above link. I can provide my working code if needed.

Modified by iLaya

Additional System Details

Installed Plug-ins

  • ActiveTouch General Plugin Container Version 105
  • Adobe PDF Plug-In For Firefox and Netscape 15.17.20050
  • Citrix Receiver Plugin (Win32)
  • Citrix Online App Detector Plugin
  • Version 5.41.3.0
  • Google Update
  • Intel web components updater - Installs and updates the Intel web components
  • Intel web components for Intel® Identity Protection Technology
  • NPRuntime Script Plug-in Library for Java(TM) Deploy
  • Next Generation Java Plug-in 11.101.2 for Mozilla browsers
  • McAfee MSC FF plugin DLL
  • The plugin allows you to have a better experience with Microsoft SharePoint
  • NetScaler Gateway
  • Picasa plugin
  • Shockwave Flash 23.0 r0
  • 5.1.50709.0
  • Unity Player 5.0.1f1
  • VLC media player Web Plugin

Application

  • User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:50.0) Gecko/20100101 Firefox/50.0

More Information

navigator.getUserMedia = navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia;
var constraints = { audio: true };
var chunks = [];
function startRecording(stream) {
log('Start recording...');
mediaRecorder = new MediaRecorder(stream);
pauseResBtn.textContent = "Pause";
mediaRecorder.start(10);
mediaRecorder.ondataavailable = function(e) {
//log('Data available...');
console.log(e.data);
console.log(e.data.type);
//console.log(e);
chunks.push(e.data);
};
mediaRecorder.onerror = function(e){
log('Error: ' + e);
console.log('Error: ', e);
};
mediaRecorder.onstart = function(){
log('Started & state = ' + mediaRecorder.state);
};
mediaRecorder.onstop = function(){
log('Stopped & state = ' + mediaRecorder.state);
console.log('data----' + chunks);
var blob = new Blob(chunks, {'type' : 'audio/wav; codecs=opus'});
var audioURL = window.URL.createObjectURL(blob);
audioElement.src = audioURL;
chunks = [];
};
mediaRecorder.onpause = function(){
log('Paused & state = ' + mediaRecorder.state);
}
mediaRecorder.onresume = function(){
log('Resumed & state = ' + mediaRecorder.state);
}
mediaRecorder.onwarning = function(e){
log('Warning: ' + e);
};
}
function onBtnRecordClicked (){
if (typeof MediaRecorder === 'undefined' || !navigator.getUserMedia) {
alert('MediaRecorder not supported on your browser, use Firefox 30 or Chrome 49 instead.');
}else {
navigator.getUserMedia(constraints, startRecording, errorCallback);
recBtn.disabled = true;
pauseResBtn.disabled = false;
stopBtn.disabled = false;
}
}
function onBtnStopClicked(){
mediaRecorder.stop();
videoElement.controls = true;
recBtn.disabled = false;
pauseResBtn.disabled = true;
stopBtn.disabled = true;
}
function onPauseResumeClicked(){
if(pauseResBtn.textContent === "Pause"){
console.log("pause");
pauseResBtn.textContent = "Resume";
mediaRecorder.pause();
stopBtn.disabled = true;
}else{
console.log("resume");
pauseResBtn.textContent = "Pause";
mediaRecorder.resume();
stopBtn.disabled = false;
}
recBtn.disabled = true;
pauseResBtn.disabled = false;
}

the-edmeister
  • Top 25 Contributor
  • Moderator
5420 solutions 40432 answers

Please see this support article: https://support.mozilla.org/en-US/kb/where-go-developer-support

Specifically - Post a question to the Mozilla Developer Network's Stack Overflow page.

Please see this support article: https://support.mozilla.org/en-US/kb/where-go-developer-support Specifically - '''[http://stackoverflow.com/questions/tagged/firefox+or+firefox-os+or+html5-apps+or+firefox-developer-tools Post a question] to the Mozilla Developer Network's Stack Overflow page.'''

Question owner

Hi the-edmeister,

I posted the same question on stackoverflow before posting here.

http://stackoverflow.com/questions/39804427/mediarecorder-api-starts-recording-an-audio-after-few-seconds-delay-web

Thanks.

Hi the-edmeister, I posted the same question on stackoverflow before posting here. http://stackoverflow.com/questions/39804427/mediarecorder-api-starts-recording-an-audio-after-few-seconds-delay-web Thanks.