MediaRecorder alternatives

I played with MediaRecorder

to save MediaStream

that was created getUserMedia

. I am very happy with the results, but I need something similar that has better cross-browser support.

Here's some sample code for how I'm using MediaRecorder

(just to give you some context):

var mediaRec;
navigator.getUserMedia({
    audio:true
},function(stream){
    mediaRec=new MediaRecorder(stream);
    mediaRec.start(10000);
    mediaRec.ondataavailable=function(e){

    };
},function(err){});

      

Seems to only work in Firefox browser and Firefox OS. MediaRecorder

However, it MediaRecorder

is part of the W3C specification
and Google Chrome has stated that it intends to support it in a future version , but what options do I have at this time?

I know that plugins like Flash and Silverlight can achieve the same MediaRecorder

, but I need this javascript solution.

Can anyone please help?

+3


source to share


1 answer


All other available options will use the high level API and be implemented at the browser / JavaScript level. Thus, no one will really compare to the MediaRecorder API provided by Firefox, since it is integrated into the browser and has a "lower level" advantage in the browser implementation.

One option I know works exactly (although it uses the Web Audio API ) Matt Diamond Recorderjs .



And an example using Recorderjs taken from Matt's github.

  var audio_context;
  var recorder;

  function startUserMedia(stream) {
    var input = audio_context.createMediaStreamSource(stream);

    input.connect(audio_context.destination);

    recorder = new Recorder(input);
  }

  function startRecording() {
    recorder.record();
  }

  function stopRecording(button) {
    recorder.stop();
    createDownloadLink();

    recorder.clear();
  }

  function createDownloadLink() {
    recorder.exportWAV(function(blob) {
      var url = URL.createObjectURL(blob);
      var li = document.createElement('li');
      var au = document.createElement('audio');
      var hf = document.createElement('a');

      au.controls = true;
      au.src = url;
      hf.href = url;
      hf.download = new Date().toISOString() + '.wav';
      hf.innerHTML = hf.download;
      li.appendChild(au);
      li.appendChild(hf);
      recordingslist.appendChild(li);
    });
  }

  window.onload = function init() {
    try {
      // webkit shim
      window.AudioContext = window.AudioContext || window.webkitAudioContext;
      navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
      window.URL = window.URL || window.webkitURL;

      audio_context = new AudioContext;

    navigator.getUserMedia({audio: true}, startUserMedia, function(e) {
      console.log('No live audio input: ' + e);
    });

      

+1


source







All Articles