向后和跨瀏覽器兼容的音頻播放

Question

我需要在許多不同的Web瀏覽器和不同版本中播放音頻文件。 舊系統生成4位WAV文件，許多瀏覽器無法處理。 所有文件都包含合成或錄制的人聲。 無論如何，我需要更換它。 所以我的問題是：

1）在兼容性，大小和質量方面，用於音頻文件的最佳文件格式是什么？

2）使用HTML5並保持向后兼容的最佳方式是什么？

我們需要支持Internet Explorer版本6,7,8和9; Firefox，Chrome和Safari。

更新 ：終於讓它適用於IE 6-9，Firefox和Chrome; 尚未測試Safari。 我了解到Safari for Windows需要Quicktime，IE需要Windows媒體播放器。

Answer 1

這是我正在使用的：

<audio autoplay>
    <source src="/static/sound/SOUND.mp3" type="audio/mpeg">
    <source src="/static/sound/SOUND.ogg" type="audio/ogg">
    <source src="/static/sound/SOUND.wav" type="audio/wav">
    <source src="/static/sound/SOUND.aiff" type="audio/x-aiff">
    <object>
        <param name="autostart" value="true">
        <param name="src" value="/static/sound/SOUND.mp3">
        <param name="autoplay" value="true">
        <param name="controller" value="false">
        <embed src="/static/sound/SOUND.mp3" controller="false" autoplay="true" autostart="true" type="audio/mpeg"></embed>
    </object>
</audio>

我提供MP3，OGG，WAV和AIFF相同的音頻剪輯，然后讓瀏覽器選擇它想要播放的內容。 audio標簽用於HTML5， object標簽用於舊系統，並且embed在不支持對象標簽的某些系統上。

我把它放在幾個網站上的一些信息中，但不幸的是我忘了這個網址。

UPDATE

我已經切換到使用howler.js這個東西了。 它會自動處理與聲音相關的所有跨瀏覽器問題。 不幸的是它不支持IE 6-8，但我已經放棄了支持它們的任何方式。

Answer 2

使用HTML5 audio標簽，您可以指定嘗試加載的不同音頻類型，因為每個瀏覽器允許使用不同類型。 此頁面上有一個很好的兼容性圖表： http ： //html5doctor.com/native-audio-in-the-browser/

以下代碼適用於大多數瀏覽器。 它首先嘗試新的HTML5 audio方法，然后再回到embed方法。

<audio width="100" height="100" autoplay="" controls="" tabindex="0">
<source type="audio/mpeg" src="songs/All-My-Life.mp3"></source>
<source type="audio/ogg" src="songs/All-My-Life.ogg"></source>
<source type="audio/wav" src="songs/All-My-Life.wav"></source>
<embed width="100" height="50" src="songs/All-My-Life.mp3">
</audio>