logo标签列表

音频数组缓冲区到音频元素

javascripthtmlaudiogoogle-chrome-extensionaudio-player
11

我正在创建一个Chrome应用程序，该应用程序可以解密从我的PBX服务器发送到我的Gmail帐户的MP3并播放它们。除了在Gmail中的音频播放器之外，我已经完成了所有内容。我有两个选择：

  1. 使用Web Audio API（我已经成功实现了，但无法弄清楚如何制作完全功能的搜索栏）。
  2. 从数组创建createObjectURL并将其传递给audio标记或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");
});

它会出现 "Failed to execute 'createObjectURL' on 'URL': No function was found that matched the signature provided." 的错误。我应该如何正确编写这个函数以创建一个可以被 Chrome 的 mp3 播放器或 SoundManager2 使用的 URL？

我的问题难以理解吗？ - SILENT
Gmail已经为我播放MP3附件了。你确定需要制作一个浏览器扩展程序吗？ - Brad
@Brad Gmail也可以播放我的mp3文件。然而，从我的PBX发送的mp3文件是加密的，因此除非我解密，否则无法播放。我的应用程序会解密mp3文件以进行播放。但是，我卡在了拥有声音缓冲区的阶段，无法使用多功能播放器（播放/停止/搜索/音量）播放它。 - SILENT
@SILENT 你解决了吗？我会感激你的回答。谢谢。 - elranu
1
@elranu 我重新尝试了选项1，并成功编写了一个具有寻找功能的播放器脚本。 - SILENT
2个回答
6

你需要首先创建一个Blob，然后将其作为参数传递给createObjectURL

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

源

请注意，如果您需要解码arrayBuffer，则会分离缓冲区，因此您将无法创建blob。解决方案：获取arrayBuffer，创建blob，解码arrayBuffer。 - JohnDoe
2
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接