WebAudioApi，频率声音动画，安卓铬v37

Question

我在安卓chrome v.37上通过网络音频api进行声音频率动画时遇到了问题我能听到音乐，但没有动画。

经过大量的实验，我最终找到了两种不同的加载声音和动画的方法。在第一种方式中，我通过adiohtml5元素加载声音。然后创建以audio元素为参数的MediaElementSource。将MediaElementSource连接到Analyser（AudioContext.createAnalyser元素）。分析我连接到GainNode，并最终将GainNode连接到AudioContext.destination.

代码：

var acontext = new AudioContext();
var analyser = acontext.createAnalyser();
var gainNode = acontext.createGain();
var audio = new Audio(path_to_file);
var source = acontext.createMediaElementSource(temp_audio);
source.connect(analyser);
analyser.connect(gainNode);
gainNode.connect(acontext.destination);

这个模式适用于PC Chrome和最新的移动safari。同样在火狐。

我发现第二种方式几乎没有什么不同。这里的声音读取到缓冲区，然后连接到分析器。

代码：

var acontext = new AudioContext();
var analyser = acontext.createAnalyser();
var gainNode = acontext.createGain();
var source = acontext.createBufferSource(); 
var request = new XMLHttpRequest();
request.open('GET', path, true);
request.responseType = 'arraybuffer';
request.addEventListener('load', function(){ source.buffer = acontext.createBuffer(request.response, false); }, false);
request.send();
source.connect(analyser);
analyser.connect(gainNode);
gainNode.connect(acontext.destination);

对于绘制动画，我使用画布，绘制数据：

analyser.fftSize = 1024;
analyser.smoothingTimeConstant = 0.92;
var dataArray = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteFrequencyData(dataArray); //fill dataArray from analyser
for (var i = 0; i < analyser.frequencyBinCount; i++) {
    barHeight = dataArray[i];
    // and other logic here.
}

第二种方法是在旧Chrome、移动浏览器、safari上工作。

但在安卓chrome v37中，这两种方式都不起作用。正如我之前所说的，第一种方法不显示动画，第二种方法只是出现错误——acontext.createBuffer（）请求3个参数而不是2个。据我所知，在新的WebAudioApi版本中，这个方法是为最新的调用类型重写的，有不同的参数，所以我不使用它

有什么建议可以在这里强制使用Android Chrome v.37吗？

Answer 1

我找到了跨浏览器解决方案。

acontext.decodeAudioData(request.response, function (buffer) {
    source.buffer = buffer
}

这种方式适用于所有浏览器。但我拒绝了音频标记，并通过XmlHTTPRequest加载声音。如果您知道如何从音频元素中获取缓冲区，以便在decodeAudioData中对其进行解码，请评论如何。