从MediaRecorder Blob零件创建新的Blob将导致空Blob

Question

我在new Blob构造函数中遇到了一个非常奇怪的行为。 我有一个由MediaRecorder返回的Blob数组：

现在，我似乎无法在代码中对这个Blob做任何事情。 在我的代码中运行new Blob(audioChunks)导致输出一个空数组，但是在控制台中运行相同的命令会正确创建一个新的Blob！ 这是完整的方法：

navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {
        const mediaRecorder = new MediaRecorder(stream);
        mediaRecorder.start();

        const audioChunks = [];
        mediaRecorder.addEventListener("dataavailable", event => {
          audioChunks.push(event.data);
        });

        sleep(1000).then(r => {
          mediaRecorder.stop();
          console.log(audioChunks) // Show the audioChunks
          console.log(new Blob(audioChunks)) // Show the failed blob
          let audio = new File(new Blob(audioChunks), `${name}.webm`, {
            type: "audio/webm;codecs=opus"
          });
          global.addTrack("filename", audio, id);
          console.log(audioChunks)
        });
      });

当我单击触发它的按钮时，将获得以下控制台输出：

这是作为Vue.js中的方法构建的，但是不确定是否真的有所作为。

Answer 1

您可能会遇到的一个问题是，您没有在mediaRecorder.start（）中设置时间片，因此在获取任何数据之前会触发睡眠超时。 （这只是这么短的测试的一个问题）

设置较小的时间片（例如100ms）：

mediaRecorder.start(100);

您还会遇到其他一些问题，但这可以回答您的最初问题。

仅供参考，您可以将blob数组传递给新的File（），这对我来说是一团blob。 我将其更改为此，并成功：

let audio = new File(audioChunks, `${name}.webm`, {
    type: "audio/webm;codecs=opus"
});

我不知道此行的预期目的：

global.addTrack("filename", audio, id);

我在这里收到“ Uncaught ReferenceError：未定义全局”。 这是用来干嘛的？