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

似乎MediaRecorder only works in the Firefox browser and the Firefox OS .

但是MediaRecorder is part of the W3C Specification , 和 Google Chrome has stated it intends to support it in a future release ，但在此期间我有哪些选择？

我知道 Flash 和 Silverlight 等插件可以实现 MediaRecorder 执行的相同功能，但我需要的是 javascript 解决方案。

有人能帮忙吗？

Answer 1

所有可用的其他选项将利用高级 API 并在浏览器/JavaScript 级别实现。因此，没有一个能真正与 Firefox 提供的 MediaRecorder API 相提并论，因为它集成到浏览器中，并具有在浏览器实现中处于“较低级别”的优势。

我知道一个肯定有效的选项(虽然使用了 Web Audio API )是 Matt Diamond's Recorderjs .

以及使用从 Matt 的 github 中获取的 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);
    });