JSFiddle - React, Tailwind, and code Playground

by Dogbert

HTML

Got <span id="size"></span> bytes data of type <span id="type"></span>

JavaScript

var constraints = {
  audio: true,
};

navigator.mediaDevices.getUserMedia(constraints)
  .then(function(stream) {
    var mediaRecorder = new MediaRecorder(stream, {
      mimeType: 'audio/ogg'
    });
    mediaRecorder.start(1000);
    console.log(mediaRecorder.state);
    console.log("recorder started");
    mediaRecorder.ondataavailable = function(event) {
      // console.log(event);
      $('#size').text(event.data.size);
      $('#type').text(event.data.type);
    }
  })
  .catch(function(err) {
    console.log('The following error occured: ' + err);
  });