safari - Safari 中的 OfflineAudioContext 和 FFT

Question

我正在使用 OfflineAudioContext 在后台进行波形分析。

在 Chrome、Firefox 和 Opera 中一切正常，但在 Safari 中我遇到了一个非常狡猾的行为。波形应该由许多样本 (329) 组成，但在 Safari 中样本只有 ~38。

window.AudioContext = window.AudioContext || window.webkitAudioContext;
window.OfflineAudioContext = window.OfflineAudioContext || 
window.webkitOfflineAudioContext;

const sharedAudioContext = new AudioContext();

const audioURL = 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/1141585/song.mp3';

const audioDidLoad = ( buffer ) =>
{
  console.log("audio decoded");
  var samplesCount = 0;
  const context = new OfflineAudioContext(1, buffer.length, 44100);
  const source = context.createBufferSource();
  const processor = context.createScriptProcessor(2048, 1, 1);

  const analyser = context.createAnalyser();
  analyser.fftSize = 2048;
  analyser.smoothingTimeConstant = 0.25;

  source.buffer = buffer;

  source.connect(analyser);
  analyser.connect(processor);
  processor.connect(context.destination);

  var freqData = new Uint8Array(analyser.frequencyBinCount);
  processor.onaudioprocess = () =>
  {
    analyser.getByteFrequencyData(freqData);
    samplesCount++;
  };

  source.start(0);
  context.startRendering();

  context.oncomplete = (e) => {
    document.getElementById('result').innerHTML = 'Read ' + samplesCount + ' samples';

   source.disconnect( analyser );
    processor.disconnect( context.destination );
  };
};

var request = new XMLHttpRequest();
request.open('GET', audioURL, true);
request.responseType = 'arraybuffer';
request.onload = () => {
  var audioData = request.response;
  sharedAudioContext.decodeAudioData(
    audioData,
    audioDidLoad,
    e => { console.log("Error with decoding audio data" + e.err); }
  );
};
request.send();

参见 Codepen .

Answer 1

我认为在这里，Safari 有正确的行为，而不是其他行为。 onaudioprocess 的工作方式是这样的:你给一个缓冲区大小(创建你的 scriptProcessor 时的第一个参数，这里是 2048 个样本)，每次处理这个缓冲区时，该事件将被触发。所以你取你的采样率(默认为 44.1 kHz，意味着每秒 44100 个样本)，然后除以缓冲区大小，这是每次将处理的样本数，你得到每秒的次数audioprocess 事件将被触发。参见 https://webaudio.github.io/web-audio-api/#OfflineAudioContext-methods

This value controls how frequently the onaudioprocess event is dispatched and how many sample-frames need to be processed each call.

当您实际播放声音时，情况确实如此。您需要在适当的时间处理适当的数量，以便正确播放声音。但是 offlineAudioContext 处理音频而不关心实际播放时间。

It does not render to the audio hardware, but instead renders as quickly as possible, fulfilling the returned promise with the rendered result as an AudioBuffer

所以有了 OfflineAudioContext，就不需要时间计算了。每次处理缓冲区时，Chrome 和其他浏览器似乎都会触发 onaudioprocess，但对于离线音频上下文，这实际上不是必需的。

也就是说，通常也不需要将 onaudioprocess 与 offlineAudioContext 一起使用，除非可能要了解性能。所有数据都可从上下文中获得。另外，329个样本意义不大，基本上只是样本数除以缓冲区大小。在您的示例中，您有 673830 个样本的来源，每秒 44100 个样本。所以你的音频是 15,279 秒。如果您一次处理 2048 个样本，则您处理音频大约 329 次，这是您使用 Chrome 获得的 329 次。无需使用 onaudioprocess 来获取此数字。

并且由于您使用离线音频上下文，因此无需实时处理这些样本，甚至无需在每 2048 个样本处调用 onaudioprocess。