Javascript MediaRecorder API简单示例；“你好，世界”；

下面是MediaRecorder API的一个简单示例：

(async function() {
  let chunks = [];
  let stream = await navigator.mediaDevices.getUserMedia({ audio:true, video:false });
  let mediaRecorder = new MediaRecorder(stream);

  // record for 3 seconds:
  mediaRecorder.start();
  setTimeout(() => { mediaRecorder.stop(); }, 3000)

  mediaRecorder.ondataavailable = function(e) { chunks.push(e.data); };
  mediaRecorder.onstop = async function() {
    let blob = new Blob(chunks, { type: mediaRecorder.mimeType });
    let audioURL = window.URL.createObjectURL(blob);
    let arrayBuffer = await (await fetch(audioURL)).arrayBuffer();
    let audioBuffer = await (new AudioContext()).decodeAudioData(arrayBuffer);
    // ... do stuff with audioBuffer
  };
})();

这在chrome中目前不起作用，因为opus编解码器存在漏洞。看起来它最近已经被修复了，所以应该在几个月内达到稳定版本（我想是吧？）

所以我的问题是：我上面提到的“你好世界”是正确的吗？它似乎在firefox上运行良好，并且有望很快在chrome上运行，但我并不完全确定规范的所有细节，我只是想确保我做的一切都是正确的。关于示例代码正确性的一些子问题：

• 在Firefox中，

  mediaRecorder.mimeType

  是一个空字符串，但是

  Blob

  显然仍然成功创建。在chrome中，

  mediaRecorder.mimeType

  是“video/webm”，尽管我在

  getUserMedia

  选项中指定了

  video:false

  。这是怎么回事
• 是否需要使用

  fetch

  将blob转换为数组缓冲区？这不难，但似乎有点粗糙
• 是否有一个解决办法，使其在Chrome中工作，而编解码器的错误得到解决？我尝试了新的MediaRecorder（流，{mimeType:“audio/wav”}）阅读后，但它给了我一个“不支持mimeType”错误。事实上，除了“video/webm”之外的任何

  mimeType

  都会在chrome上出现错误，而且firefox似乎只是忽略了

  mimeType

  选项
• 在测试中，他们使用

  newblob（块，{'type'：'audio/ogg；codecs=opus'}）。他们为什么选择这种类型和编解码器？他们怎么知道MediaRecorder使用的是真正的mime类型和编解码器？他们如何知道mime类型在所有浏览器中都能工作

这是一个相关的问题/答案。真的，我只想要一些我知道在3个月内不会被破解的代码，因为这些东西是由浏览器实现的，并且规范是经过调整的。这是一个奖金，如果它可以与铬现在也。谢谢

对于bullet 1，我想说（尽管我没有证据）chrome的实现目前有点不成熟。对于bullet 2，我认为更自然的方法是使用文件阅读器，尽管我不确定在这里使用fetch的缺点。对于bullet 3，一个解决方案是完全不使用MediaRecorder API来完成您当前正在做的事情。。。您可以简单地从那里创建arrayBuffer。对于#4，我想这只是一个例子，不一定是一个有效的例子。对于额外的子弹（在3个月内不会破裂的东西），我想你今天工作的几乎任何东西明天都会有效。问题是今天很多事情都没有按他们应该的方式进行。。。