html5音頻

使用html5音頻背景

直到現在，仍然不存在一項旨在網頁上播放音頻的標準。今天，大多數音頻是通過插件（比如 Flash）來播放的。然而，並非所有瀏覽器都擁有同樣的插件。HTML5 規定了一種通過 audio 元素來包含音頻的標準方法，audio 元素能夠播放聲音文件或者音頻流。

音頻格式

當前，audio 元素支持Ogg Vorbis,Mp3,Wav這三種音頻格式，這是音頻格式瀏覽器支持情況如下：

使用audio元素實現音頻播放

audio元素的controls 屬性供添加播放、暫停和音量控制項，<audio> 與 </audio> 之間插入的內容是供不支持audio 元素的瀏覽器顯示的，source 元素可以鏈接不同的音頻文件，解決瀏覽器相容音頻格式問題，下麵使用了二個source元素實現上面五個瀏覽器都能播放該音頻。簡單代碼如下：

<audio controls="controls">該瀏覽器不支持該格式音頻的播放
    <source src="../videoAudio/1.mp3"></source>
    <source src="../videoAudio/1.wav"></source>
</audio>

使用Dom進行操作audio

使用自定義的按鈕實現controls屬性的播放與暫停功能，代碼如下：

        <button onclick="controlPlay()">播放/停止</button>
        <audio id="vioce" >該瀏覽器不支持該格式音頻的播放
            <source src="../videoAudio/1.mp3"></source>
            <source src="../videoAudio/1.wav"></source>
        </audio>
        <script>
            var voice =document.getElementById("vioce");
            function controlPlay(){
                if(voice.paused){//判斷是否停止了
                    voice.play();//播放
                } else{
                    voice.pause();//停止
                }
            }
        </script>                

音頻格式轉化（將Wav格式轉換成MP3格式）

1.首先下載ffmpeg，輸入網址www.ffmpeg.org(開源網址），進入windows中進行下載windows版本的文件。

2.解壓ffmpeg壓縮文件（以ffmpeg-20180803-5aeb3b0-win32-static.zip為例），再環境變數path中增加ffmpegbin目錄的路徑（G:\mydeveloperapplication\hbuilder\html5\ffmpeg-20180803-5aeb3b0-win32-static\bin）。

3.環境變數設置好後，然後在DOS命令窗體中鍵入ffmpeg，測試是否可運行。

4. 在DOS命令窗體中 切換到mp3音頻文件就在的目錄，最後鍵入ffmpeg -i 1002_c.wav -f mp3 -acodec libmp3lame -y 2.mp3(這裡是將1002_c.wav裝換成2.mp3）。

5.ffmpeg其他音頻格式的轉換以及常用命令，請參考https://www.cnblogs.com/xiaofengfeng/p/3573025.html，https://www.cnblogs.com/dwdxdy/p/3240167.html。