我正在玩Web Audio API并尝试找到导入mp3的方法(所以这只在Chrome中),并在画布上生成它的波形.我可以实时做到这一点,但我的目标是比实时更快地做到这一点.
我能够找到的所有示例都涉及从onaudioprocess事件附带的函数中读取分析器对象的频率数据:
processor = context.createJavascriptNode(2048,1,1);
processor.onaudioprocess = processAudio;
...
function processAudio{
var freqByteData = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteFrequencyData(freqByteData);
//calculate magnitude & render to canvas
}
但是看起来,analyser.frequencyBinCount只有在播放声音时才会填充(有关填充缓冲区的信息).
我想要的是能够尽可能快地手动/编程地逐步浏览文件,以生成画布图像.
到目前为止我得到的是:
$("#files").on('change',function(e){
var FileList = e.target.files,
Reader = new FileReader();
var File = FileList[0];
Reader.onload = (function(theFile){
return function(e){
context.decodeAudioData(e.target.result,function(buffer){
source.buffer = buffer;
source.connect(analyser);
analyser.connect(jsNode);
var freqData = new Uint8Array(buffer.getChannelData(0));
console.dir(analyser);
console.dir(jsNode);
jsNode.connect(context.destination);
//source.noteOn(0);
});
};
})(File);
Reader.readAsArrayBuffer(File);
});
但是getChannelData()总是返回一个空的类型数组.
任何见解都会受到赞赏 - 即使事实证明它无法完成.我想我是唯一一个互联网不想要做的东西,在实时.
谢谢.
我正在开发一个Web应用程序,用户可以对音频样本进行排序,并可选择将效果应用于他们使用Web Audio API创建的音乐模式.模式存储为JSON数据,我想对每个模式服务器端的渲染音频进行一些分析.据我所知,这给我留下了两个选择:
在服务器端运行我自己的渲染代码,尝试尽可能忠实于浏览器内渲染.也许我甚至可以从Chromium项目中取出Web Audio代码并对其进行修改,但这似乎可能需要做很多工作.
渲染客户端,希望比实时更快,然后将渲染的音频发送到服务器.这是理想的(和DRY),因为只有一个引擎用于模式渲染.
这个问题引导我到Chromium存储库中的这个代码示例,这似乎表明离线处理是可能的.诀窍似乎是webkitAudioContext用一些参数构造一个(通常使用零参数构造函数).以下是我对参数含义的猜测:
new webkitAudioContext(2, // channels
10 * 44100, // length in samples
44100); // sample rate
我稍微调整了样本,并在Windows,Mac和Linux上的Chrome 23.0.1271.91中进行了测试. 这是实例和结果(打开Dev Tools Javascript控制台以查看发生的情况):
webkitAudioContext我上面描述的构造函数导致Windows和Linux上的异常.
离线渲染对于我正在尝试做的事情来说是完美的,但我无法在任何地方找到文档,并且支持不太理想.有没有人有关于此的更多信息？我是否应该尽快在Windows和/或Linux中期待对此的支持,或者我应该期待支持在Mac上很快消失？