預加載HTML5項目中的音頻文件

-1

對於我的HTML5項目，我想預先加載音頻文件。我希望它們被預加載和緩存。這樣我就可以在需要時播放它們。我用jquery預加載了內容和圖像（http://www.gayadesign.com/scripts/queryLoader/），但我無法預載音頻文件。預加載HTML5項目中的音頻文件

<音頻控件= 「控制」> <源SRC = 「song.ogg」類型= 「音頻/ OGG」/> <源SRC = 「song1.mp3」類型= 「音頻/ MPEG」/ > 您的瀏覽器不支持音頻元素。 < /音頻>

請幫我這個。

來源

2012-03-14 Bruno

[被回答過了幾次...]（http://stackoverflow.com/questions/2810779/pre-load-audio-files-at-the-client - 側換後使用） – keltor 2012-03-14 19:40:46

HTML5規範描述了三種可能的值的預壓性能：

「無」：提示用戶代理，要麼筆者並不希望用戶所需要的媒體資源，或服務器想要以儘量減少不必要的流量。如果您的場景是播客博客，並且每個帖子都有一個音頻文件，則此選項的作用尤其是，因爲它減少了初始預載帶寬。一旦用戶播放該文件（通過默認的視覺控件或JavaScript方法加載（）或播放（）），瀏覽器將開始獲取音頻流。
「元數據」：提示給筆者並不指望用戶所需要的媒體資源的用戶代理，但獲取的資源元數據（尺寸，持續時間等）是合理的。如果您正在構建音頻播放器控件，並且您需要有關音頻剪輯的基本信息，但不需要再播放，則建議使用此選項。
「自動」：提示，用戶代理可以把用戶的需求放在首位，而不針對服務器的危險，直至幷包括樂觀下載整個資源的用戶代理。如果您正在構建一款遊戲，則此方法可能是最好的方法，因爲它允許您在實際開始遊戲體驗之前預加載所有音頻剪輯。請注意，當您以編程方式設置音頻元素的src屬性時，除非另有說明，瀏覽器會將預加載屬性 - 設置爲「auto」。因此，如果您的方案需要不同的值，請確保指定它在設置src之前在代碼行中。

通過使用F12開發工具（網絡選項卡）運行此頁面，您可以預覽這三個選項對網絡的影響。出於調試目的，您可以通過選中「始終從服務器刷新」菜單來模擬新調用並禁用本地緩存。

雖然此屬性適用於初始化階段，但您可能還需要知道瀏覽器何時實際下載了音頻剪輯並準備播放它。您可以通過聽「canplaythrough」事件來獲取這些信息;一旦用戶代理估計如果現在開始播放，則該事件被用戶代理調用，媒體資源可以以當前回放速率一直呈現到其結束，而不必停止進一步緩衝。

var audio = document.createElement("audio"); 
audio.src = "audio/sample.mp3"; 
audio.addEventListener("canplaythrough", function() { 
    alert('The file is loaded and ready to play!'); 
}, false);

從msdn

來源

2012-03-14 19:52:07 j08691

預加載HTML5項目中的音頻文件

回答

相關問題