Question

我最近制作了一个3D可视化工具，我在使用我的音频代码在Firefox中工作时遇到了一些问题。

我设置了我的AudioContext：

audioContextSetup: function () {
  try {
    Sound.audioContext = new (window.AudioContext || window.webkitAudioContext)();
  } catch(e) {
    alert('Web Audio API is not supported in this browser');
  }
},

我创建了一个audioObject：

createAudioObject: function () {
  Sound.audio0 = new Audio();
  Sound.audio0.src = '/audio/MakeYouWanna.mp3';
  Sound.audio0.controls = true;
  Sound.audio0.autoplay = false;
  Sound.audio0.loop = true;
},

我设置了audioNodes：

setupAudioNodes: function () {
  Sound.sourceNode = Sound.audioContext.createMediaElementSource(Sound.audio0);
  Sound.analyserNode = Sound.audioContext.createAnalyser();
  Sound.analyserNode.fftSize = 1024,
  Sound.frequencyArray = new Uint8Array(Sound.analyserNode.frequencyBinCount);
  Sound.timeDomainArray = new Uint8Array(Sound.analyserNode.frequencyBinCount);
},

我连接了我的audioNodes：

connectAudioNodes: function () {
  Sound.sourceNode.connect(Sound.analyserNode);
  Sound.analyserNode.connect(Sound.audioContext.destination);
},

然后，我运行这条在Chrome中完美运行的神奇系列:(注意#player是一个空div。）

$('#player').append(Sound.sourceNode.mediaElement);

但在Firefox中，我没有爱。我最近已经意识到mp3不能在Firefox（跛脚）中工作，但播放器应该仍然显示正确吗？

我有一个文件拖放功能，它也使用上面的.append（）行，我尝试了.wav文件，但也没有用。

网站：http://tadx-3dsound.herokuapp.com/ Github回购：https://github.com/aldhsu/TeamDNM

非常感谢， Xaun Lopez。

Answer 1

问题是：

$('#player').append(Sound.sourceNode.mediaElement);

MediaElementAudioSourceNode的{{1}}属性已被弃用了一段时间。它不会在Chrome中得到长时间的支持（或者它已被删除，不确定），并且在Firefox中从未存在过（因为我们在删除后开始实施Web Audio API）。

您需要自己进行映射（只需保留mediaElement＆lt; - ＆gt; MediaElementAudioSourceNode地图），或者只需执行以下操作：

<audio>

针对您的具体案例。

此外，Firefox现在已经在所有平台上支持mp3了很长一段时间。

Web Audio API：麻烦将JS音频对象附加到Firefox </audio>中的<audio> html5播放器

1 个答案: