Question

我一直在测试一个网络应用程序，由于某些原因，许多应该在onLoad上播放的音频在很多情况下无法播放。是否有更好的策略来确保所有设备/浏览器上的音频播放？

这是我的代码：

$( document ).ready(function() {

    var audio = document.getElementById('audio1');
    if (audio.paused) {
        audio.play();
    }else{
        audio.currentTime = 0
}
});

HTML：

 <audio id="audio1" src="https://LINK.wav" ></audio>

Answer 1

您必须包含文件类型，例如

 <audio id="audio1" src="your_filepath/LINK.wav" type="audio/wav"></audio>

但如果您只提供WAV文件，某些浏览器无法播放（如IE）

提供mp3 和 ogg文件更可靠，如下所示：

<audio>
  <source src="LINK.ogg" type="audio/ogg">
  <source src="LINK.mp3" type="audio/mpeg">
</audio>

每个浏览器都能理解这两个中的至少一个，并且（压缩的）文件要小得多，因此在加载并开始播放之前不会花那么长时间。

Answer 2

（根据评论反馈编辑 - 谢谢！）

Wave文件是未压缩的音频，往往是需要下载的大文件。这就是Mp3，Ogg或AAC作为网络格式的首选原因。并非所有浏览器都支持每个浏览器。 Firefox不支持AAC，IE和Safari不支持Ogg。您可以使用caniuse to check。

HTML5音频将设置为：

<audio controls preload>
  <source src="https://LINK.m4a" type="audio/mp4" />
  <source src="https://LINK.oga" type="audio/ogg" />
</audio>

来自this article on HTML5 audio types的信息。

使音频适用于所有浏览器

2 个答案: