为什么 HTML5 Audio 标签总是有两个来源？答案

【问题标题】：Why does the HTML5 Audio tag always have two sources?为什么 HTML5 Audio 标签总是有两个来源？
【发布时间】：2012-12-24 00:26:06
【问题描述】：

看看它是如何链接到 .ogg 和 .mp3 的？这是为什么？我见过的所有示例和应用程序都做同样的事情。 有必要有两个来源吗？

<audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
  Your browser does not support the audio tag.
</audio>

【问题讨论】：

标签： html audio

【解决方案1】：

不，没有必要。不同的来源只是按顺序尝试的可能性；并非所有浏览器都保证支持所有格式，因此您需要提供后备选项。

（如果你只想提供一个，src和type也可以直接放在<audio>标签上。）

【讨论】：

所以在您的服务器上包含每个声音文件的两个版本是明智的吗？对于音频密集型应用程序来说，这似乎是一个空间占用者。
@Aerovistae：取决于您正在寻找什么样的浏览器支持，但是...是的 :)
@minitech 是的，当人们无法同意浏览器标准时，就会发生这种情况......
@LeeTaylor：是的，好吧，每个人都想要 MP3，但 Firefox 不能拥有它:(

【解决方案2】：

并非所有浏览器都支持 MP3 或 OGG 格式，因此通常会同时包含这两种格式以确保跨浏览器兼容性。

Wav 格式也可以包含在内，与 MP3 和 Ogg 不同，它支持所有浏览器（不包括 Internet Explorer）。

MP3 适用于 Internet Explorer 9+、Chrome 6+ 和 Safari 5+。 Ogg 适用于所有浏览器，不包括 Internet Explorer 和 Safari。

因此，MP3 和 Wav 或 MP3 和 Ogg 的组合可以在几乎所有主流浏览器上播放 HTML5 音频。当然，将 Wav 和 Ogg 作为一个组合包含在内是个坏主意，因为 Internet Explorer 需要 MP3 作为格式。

所以包含多个标签作为后备。

希望在未来，所有主流浏览器都将支持所有格式。目前只有 Chrome 支持。

（希望我的回答听起来不像绕口令。）

【讨论】：

【解决方案3】：

为了更简单，哈哈。

Firefox 不支持 mp3（如果他们仍然不支持，请确认）因此，要让您的播放器在 Firefox 中正常运行，您需要 ogg 作为备份。

Firefox 将跳过 mp3 并尝试查找 ogg。

【讨论】：