getUserMedia api is not able to capture audio along with video from chrome extension

699 views
Skip to first unread message

Anil Vanaparthi

unread,
Dec 26, 2016, 7:19:23 AM12/26/16
to Chromium-Extensions-Announce
Hi,

I am using getUserMedia api to capture screen and record audio (both together) from chrome extension. The api captures the screen, records the video but doesn't capture the audio.

Any reason why the audio is not being captured. Is there any limitation with the api or do we need to use any other api to capture video+audio?
Please find the code snippet below. (below code is present in background.js)

(tried passing the constraints as audio: true, video: true, but this didnt work. it was  throwing an error.)

chrome.desktopCapture.chooseDesktopMedia(['screen','audio'],
function onAccessApproved(id) {

const constraints = { "video": {
 mandatory: {
chromeMediaSource: 'desktop',
chromeMediaSourceId: id,
minWidth: 1280,
minHeight: 720,
maxWidth:1280,
maxHeight:720
}
}, "audio" : {
 mandatory: {
chromeMediaSource: 'desktop',
chromeMediaSourceId: id}} };
 navigator.mediaDevices.getUserMedia(constraints).then(gotMedia).catch(e => { console.error('getUserMedia() failed: ' + e); 
});

function gotMedia(stream) {

  theStream = stream;
  var video = document.createElement('video');
  video.src = URL.createObjectURL(stream);
  video.srcObject = stream;

  try {
    recorder = new MediaRecorder(stream, {mimeType : "video/webm"});
  } catch (e) {
    console.error('Exception while creating MediaRecorder: ' + e);
    return;
  }
  
  theRecorder = recorder;
  recorder.ondataavailable = 
      (event) => { recordedChunks.push(event.data); };
  recorder.start(100);
  
  
  stream.getVideoTracks()[0].onended = function () {
download();
};
}
    

function download() {

  theRecorder.stop();
  theStream.getTracks().forEach(track => { track.stop(); });

  var blob = new Blob(recordedChunks, {type: "video/webm"});
  var url =  URL.createObjectURL(blob);
  var a = document.createElement("a");
  document.body.appendChild(a);
  a.style = "display: none";
  a.href = url;
  a.download = 'test.webm';
  a.click();
  // setTimeout() here is needed for Firefox.
  setTimeout(function() { URL.revokeObjectURL(url); }, 100); 
}


Roey Cohen

unread,
Jun 15, 2017, 1:50:12 PM6/15/17
to Chromium-Extensions-Announce, anilvan...@gmail.com
were you able to find a solution? 

i actually have a similar problem when the user chooses a tab and not the screen.

replacing "desktop" to "system" in the audio constrain fixes the problem (while muting the tab).

now i'm just need to know whether the user chose screen or tab to know how to toggle the constraint.

10x
Reply all
Reply to author
Forward
0 new messages