使用带有音频标签源的AudioContext

Question

我正在构建一个音乐播放器，我想根据当前播放的曲目添加脉动效果。

这里有一些我想要的例子：

http://www.htmlfivewow.com/demos/hal/index.html

http://www.schillmania.com/projects/soundmanager2/demo/360-player/canvas-visualization.html

我的问题是，在第一个例子中，声音是通过xhr加载的，而第二个例子是使用flash。

我希望能够从音频标签中获取我想要分析的声音。

我担心这是不可能的，它会导致严重缺乏安全性，因为我们可以加载网页而不是声音然后分析它。还有解决方案吗？

Answer 1

您可以在AudioContext中使用 createMediaElementSource 方法。

<audio id="audio" src="test.mp3"></audio>
<script type="text/javascript">
    var context = new webkitAudioContext;
    var el = document.getElementById('audio');
    var source = context.createMediaElementSource(el);
    source.connect(context.destination);
    el.play();
</script>

Answer 2

看起来这是一个通过Web Audio API实现的实现：

https://github.com/richtaur/audia/blob/master/audia.js

和背景：

http://www.lostdecadegames.com/audia-is-a-library-for-simplifying-the-web-audio-api/