HTML5 <audio>元素不會加載頁面上的文件

Question

我正在運行到this error上傳我的.mp3文件到PHP服務器上的元素。本質上有no response from the server to the GET URL request.我想知道什麼可能是這個錯誤的原因。 6個文件似乎加載得很好。我爲所有文件使用相同的HTML代碼 - 加載和不加載文件。我試圖改變php.ini文件/Applications/MAMP/bin/php/php5.6.2/conf/php.ini和upload_max_filesize和max_file_uploads屬性無濟於事。任何幫助或指導將非常感謝！

的源代碼：

<div class="row spacer"> 
 
    <div class="large-4 columns"> 
 
     <h2>Conducting Audio</h2> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-12 columns"> 
 
     <img class="audio-image" src="img/IMG_4717.JPG" alt=""> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-12 columns"> 
 
     <h4>Tchaikovsky - Symphony No. 5 in e minor, Op. 64</h4> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-1 columns">&nbsp;</div> 
 
    <div class="large-4 columns"> 
 
     <!-- Audio track title here --> 
 
     <h6>1st movement: Andante; Allegro con anima</h6> 
 
    </div> 
 
    <div class="large-7 columns"> 
 
     <audio controls> 
 
     <source src="audio/conducting_audio/tchaikovsky_symphony_no5_mvt1.mp3" type="audio/mpeg"> 
 
     Your browser does not support HTML5 audio. 
 
     </audio> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-1 columns">&nbsp;</div> 
 
    <div class="large-4 columns"> 
 
     <!-- Audio track title here --> 
 
     <h6>2nd movement: Andante cantabile</h6> 
 
    </div> 
 
    <div class="large-7 columns"> 
 
     <audio controls> 
 
     <source src="audio/conducting_audio/tchaikovsky_symphony_no5_mvt2.mp3" type="audio/mpeg"> 
 
     Your browser does not support HTML5 audio. 
 
     </audio> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-1 columns">&nbsp;</div> 
 
    <div class="large-4 columns"> 
 
     <!-- Audio track title here --> 
 
     <h6>3rd movement: Valse; Allegro moderato</h6> 
 
    </div> 
 
    <div class="large-7 columns"> 
 
     <audio controls> 
 
     <source src="audio/conducting_audio/tchaikovsky_symphony_no5_mvt3.mp3" type="audio/mpeg"> 
 
     Your browser does not support HTML5 audio. 
 
     </audio> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-1 columns">&nbsp;</div> 
 
    <div class="large-4 columns"> 
 
     <!-- Audio track title here --> 
 
     <h6>4th movement: Andante maestoso; Allegro vivace</h6> 
 
    </div> 
 
    <div class="large-7 columns"> 
 
     <audio controls> 
 
     <source src="audio/conducting_audio/tchaikovsky_symphony_no5_mvt4.mp3" type="audio/mpeg"> 
 
     Your browser does not support HTML5 audio. 
 
     </audio> 
 
    </div> 
 
    </div>  
 

 
    <div class="row"> 
 
    <div class="large-12 columns"> 
 
     <h4>Mahler - Symphony No. 2 in c minor ("Resurrection")</h4> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-1 columns">&nbsp;</div> 
 
    <div class="large-4 columns"> 
 
     <!-- Audio track title here --> 
 
     <h6>1st movement: Allegro maestoso</h6> 
 
    </div> 
 
    <div class="large-7 columns"> 
 
     <audio controls> 
 
     <source src="audio/conducting_audio/mahler_symphony_no2_1st_mvt.mp3" type="audio/mpeg"> 
 
     Your browser does not support HTML5 audio. 
 
     </audio> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-1 columns">&nbsp;</div> 
 
    <div class="large-4 columns"> 
 
     <!-- Audio track title here --> 
 
     <h6>2nd movement: Andante moderato</h6> 
 
    </div> 
 
    <div class="large-7 columns"> 
 
     <audio controls> 
 
     <source src="audio/conducting_audio/mahler_symphony_no2_2nd_mvt.mp3" type="audio/mpeg"> 
 
     Your browser does not support HTML5 audio. 
 
     </audio> 
 
    </div> 
 
    </div> 
 

 
    <div class="row"> 
 
    <div class="large-12 columns"> 
 
     <h4>Stravinsky - The Rite of Spring</h4> 
 
    </div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="large-1 columns">&nbsp;</div> 
 
    <div class="large-4 columns"> 
 
     <!-- Audio track title here --> 
 
     <h6>Part 1: The Adoration of the Earth</h6> 
 
    </div> 
 
    <div class="large-7 columns"> 
 
     <audio controls> 
 
     <source src="audio/conducting_audio/stravinsky_rite_of_spring_pt_1.mp3" type="audio/mpeg"> 
 
     Your browser does not support HTML5 audio. 
 
     </audio> 
 
    </div> 
 
    </div>

Answer 1

你使用谷歌瀏覽器？ Google Chrome的舊版本& Chromium在打開大量音頻源時遇到問題。 (source 1)(source 2)。另外，我建議你從MDN的文章Using HTML5 audio and video。他們寫了回退和錯誤處理。

一些庫媒體：

• Popcorn.js
• audio.js