音频阵列缓冲区到音频元素

Question

我正在创建一个chrome应用程序,用于解密从我的PBX服务器发送到我的Gmail帐户的mp3并播放它们.我已经完成了除gmail中的音频播放器之外的所有内容.我有两个选择:

1. 使用Web Audio API(我让它工作但无法弄清楚如何制作一个功能齐全的搜索栏).
2. 从数组创建一个createObjectURL并传递给audio tag或soundmanager2.

我想尽可能多地重用代码,并且无法找到带有搜索条的预制Web Audio API播放器.所以,我尝试尝试选项2,以下是我去的地方

window.AudioContext = window.AudioContext || window.webkitAudioContext;
var context = new AudioContext();
context.decodeAudioData(arr.buffer, function (soundBuffer) {
    windowURL = window.URL || window.webkitURL;
    var audio = document.createElement("audio");
    audio.src = windowURL.createObjectURL([soundBuffer]);
    var someDiv = document.getElementById("testDiv");
    someDiv.appendChild(audio);
    audio.onload = function (e) {
        windowURL.revokeObjectURL(this.src);
    }
}, function (err) {
   console.log("couldnt decode buffer");
});

它失败并且"无法在'URL'上执行'createObjectURL':未找到与提供的签名匹配的功能." 我该如何正确编码这个函数来创建一个可以被chrome的mp3播放器或soundmanager2使用的url？

Answer 1

您需要首先创建一个 Blob，并将其作为createObjectURL的参数传递

....
const blob = new Blob([soundBuffer], { type: "audio/wav" });
audio.src = window.URL.createObjectURL(blob);
....

来源

Answer 2

是的，你可以做到

1. 获取数组缓冲区并解码音频
2. 使用侦听器“sourceopen”创建 MediaSource
3. 使用方法appendBuffer将解码后的音频添加到MediaSource

https://developer.mozilla.org/en-US/docs/Web/API/MediaSource