MediaRecorder替代方案

Question

我一直在使用MediaRecorder来保存由getUserMedia创建的MediaStream。我真的很满意结果，但是我需要类似的东西，有更好的跨浏览器支持。

下面是我如何使用MediaRecorder的一些示例代码(只是为了给您提供一些上下文)：

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

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

看来只适用于火狐浏览器和火狐操作系统。

不管是是W3C规范的一部分还是谷歌Chrome已经表示，它打算在未来的版本中支持它，但在此期间，我有什么选择呢？

我知道插件(如Flash )可以实现与MediaRecorder相同的功能，但我需要的是一个javascript解决方案。

有人能帮忙吗？

Answer 1

所有其他可用的选项都将使用高级API，并在Browser/JavaScript级别实现。因此，没有一个能与火狐提供的MediaRecorder API相媲美，因为它集成到浏览器中，并且在浏览器的实现中具有“较低级别”的好处。

我知道可以肯定的一个选项(虽然使用了Web音频API)是马特·戴蒙德录音机。

以及使用Matt中的Recorderjs的例子。

  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);
    });