AudioContext Analyser在firefox/chrome上工作，但在Safari上不工作

AudioContext Analyser working on firefox/chrome but not Safari

本文关键字：工作 Safari 但在 chrome Analyser firefox AudioContext      更新时间：2023-09-26

我正在为音频编写可视化工具，在macosx和ios上使用远程调试器调试safari时遇到问题。在更新AudioContext分析器的动画函数上，ByteFrequency数组中的值在safari上不更新。以下是代码示例：

var context;
if (typeof AudioContext !== "undefined") {
    context = new AudioContext();
} else if (typeof webkitAudioContext !== "undefined") {
    context = new webkitAudioContext();
}
var analyser = context.createAnalyser();
analyser.fftSize = 64;
frequencyData = new Uint8Array(analyser.frequencyBinCount);
// Get the frequency data and update the visualisation
function update() {
    requestAnimationFrame(update);
    analyser.getByteFrequencyData(frequencyData); 
};
$(document).ready(function(){
    $("#player").bind('canplay', function() {
        var source = context.createMediaElementSource(this);
        source.connect(analyser);
        analyser.connect(context.destination);
    });
};

这是工作示例的链接http://basketballjock.org/

在safari中，您需要在用户交互后创建音频上下文。例如，在按钮onclick回调中。

HTML:<button onclick="play">Play</button>

Javascript：

function play() {
  var context;
  if (typeof AudioContext !== "undefined") {
      context = new AudioContext();
  } else if (typeof webkitAudioContext !== "undefined") {
      context = new webkitAudioContext();
  }
  var analyser = context.createAnalyser();
  analyser.fftSize = 64;
  frequencyData = new Uint8Array(analyser.frequencyBinCount);
  // Get the frequency data and update the visualisation
  function update() {
    requestAnimationFrame(update);
    analyser.getByteFrequencyData(frequencyData); 
  };
  var source = context.createMediaElementSource(this);
  source.connect(analyser);
  analyser.connect(context.destination);
}
相关文章：