JavaScript / HTML5中的声音效果HTML5 对象Audio网络音频接口
我正在使用HTML5来编写游戏;我现在遇到的障碍是如何播放音效。
具体要求不多:
- 播放和混合多种声音,
- 多次播放同一样本,可能重叠播放,
- 在任何时候中断采样的回放,
- 最好播放包含(低质量)原始PCM的WAV文件,但我当然可以转换这些文件。
我的第一种方法是使用HTML5元素并定义我页面中的所有声音效果。Firefox只是桃色地播放WAV文件,但多次调用并不能真正多次播放示例。根据我对HTML5规范的理解,该元素还跟踪播放状态,因此可以解释为什么。<audio>
#play
<audio>
我立即想到的是克隆音频元素,所以我创建了以下小型JavaScript库来为我做到这一点(取决于jQuery):
var Snd = {
init: function() {
$("audio").each(function() {
var src = this.getAttribute('src');
if (src.substring(0, 4) !== "snd/") { return; }
// Cut out the basename (strip directory and extension)
var name = src.substring(4, src.length - 4);
// Create the helper function, which clones the audio object and plays it
var Constructor = function() {};
Constructor.prototype = this;
Snd[name] = function() {
var clone = new Constructor();
clone.play();
// Return the cloned element, so the caller can interrupt the sound effect
return clone;
};
});
}
};
所以现在我可以从Firebug控制台做并播放,但我仍然不能多次播放相同的样本。似乎该元素实际上更像是一种流媒体功能,而不是用来播放声音效果的东西。Snd.boom();
snd/boom.wav
<audio>
有没有一种聪明的方法可以做到这一点,我错过了,最好只使用HTML5和JavaScript?
我还应该提到,我的测试环境是Ubuntu 9.10上的Firefox 3.5。我尝试过的其他浏览器 - Opera,Midori,Chromium,Epiphany - 产生了不同的结果。有些不玩任何东西,有些抛出异常。