播放問題HTML5音頻多次在Safari

HTML：

<div id="audio-files" style="display: none;"> 
    <audio id="click-sound"> 
     <source src="/assets/click.mp3" type="audio/mpeg"> 
     <source src="/assets/click.wav" type="audio/wav"> 
    </audio> 
</div>

的JavaScript：

play: function() { 
    var audio = $('#audio-files').find('audio#click-sound'); 
    if (audio.length) { 
    audio[0].play(); 
    } 
}

期望的行爲：
當我調用播放（）聲音應該播放一次。應該只有1個請求到服務器 - 頁面加載。 play（）的多個呼叫不應觸發多個請求。

實際行爲：
- Firefox（19.0.2），Chrome（26.0.1410.43）和Opera（12.15）按預期工作。
- Safari（6.0.3）只播放一次所需的聲音，然後在要求時拒絕播放它或任何其他聲音。

我試着在audio[0].play()之前加入audio[0].load()，但這會導致瀏覽器在每次播放音頻時都會發出請求，這是完全不希望的。

小提琴：http://jsfiddle.net/Tpvfm/

來源

2013-04-08 George Atsev

Safari瀏覽器有一些有趣的音頻問題。我注意到的一件事是，如果沒有用戶輸入以編程方式觸發，音頻將無法啓動。實質上，如果您的聲音在用戶點擊或執行操作時被觸發，Safari很可能會拒絕播放它。 audio [i] .play（）如何被調用？ – akamaozu 2013-04-10 18:16:08

在示例jsfiddle中，它通過用戶單擊進行調用。在我們的代碼中，它是以編程方式觸發的......您是否有任何關於該主題的文檔/文章的鏈接？ – 2013-04-11 08:36:42

我覺得這是你的榜樣MP3文件的問題。我剛剛從你的小提琴中刪除它（mp3），它可以在OSX上的Safari中使用。

<div id="audio-files" style="display: none;"> 
    <audio id="click-sound"> 
    <source src="/assets/click.wav" type="audio/wav"> 
    </audio> 
</div>

小提琴：73GCX

來源

2013-04-12 14:44:11 danilopopeye

嗯......這很奇怪。你是對的，當我只離開wav源時，它工作正常。但爲什麼？在Safari中應該支持作爲源的Mp3格式。 btw我在我的生產環境中使用不同的文件，這個文件只是我在互聯網上隨機發現的東西。然而，這個問題和我們的2個生產.mp3文件都被重現了。請給出一個合理的解釋，我會給你你的獎勵。謝謝！ – 2013-04-12 15:19:29

@GeorgeAcev你錯過了Content-Range標題。請參閱[Apple Developer]（https://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/CreatingVideoforSafarioniPhone/CreatingVideoforSafarioniPhone.html#//apple_ref/doc/uid/TP40006514-SW1）和[html5 -audio-獵裝現場直播-VS-沒有（http://stackoverflow.com/questions/1995589/html5-audio-safari-live-broadcast-vs-not） – danilopopeye 2013-04-12 21:40:51

播放問題HTML5音頻多次在Safari

回答

相關問題