captureLivestream.js

// 1. paste this section to start recording
let mediaRecorder;
let recordedBlobs = [];
function handleDataAvailable(event) {
  console.log('handleDataAvailable', event);
  if (event.data && event.data.size > 0) {
    recordedBlobs.push(event.data);
  }
}
let options = {mimeType: 'video/webm;codecs=vp9,opus'};
if (!MediaRecorder.isTypeSupported(options.mimeType)) {
  console.error(`${options.mimeType} is not supported`);
  options = {mimeType: 'video/webm;codecs=vp8,opus'};
  if (!MediaRecorder.isTypeSupported(options.mimeType)) {
    console.error(`${options.mimeType} is not supported`);
    options = {mimeType: 'video/webm'};
    if (!MediaRecorder.isTypeSupported(options.mimeType)) {
      console.error(`${options.mimeType} is not supported`);
      options = {mimeType: ''};
    }
  }
}
let vidWin = document.getElementsByTagName('video')[0];
mediaRecorder = new MediaRecorder(vidWin.srcObject, options);
mediaRecorder.ondataavailable = handleDataAvailable;
mediaRecorder.start();
// end section 1
// 2. paste this line to start recording
mediaRecorder.stop();
// end section 2
// 3. paste this section to download the recording
const blob = new Blob(recordedBlobs, {type: 'video/webm'});
const url = window.URL.createObjectURL(blob);
const a = document.createElement('a');
a.style.display = 'none';
a.href = url;
a.download = 'test.webm';
document.body.appendChild(a);
a.click();
setTimeout(() => {
  document.body.removeChild(a);
  window.URL.revokeObjectURL(url);
}, 100);
// end section 3