Wie lade ich Audio vollständig vor dem Abspielen?

Question

Ich muss Audio vollständig laden, bevor Sie es spielen. Der Player sollte automatisch Audio abspielen, nachdem er vollständig geladen wurde. Es sollte keine Pause-Taste geben, der Benutzer kann sie nicht anhalten. Hier ist mein Code, aber nicht in der Lage. Markup Language

Hyper Text:

<audio class="audio-player" onloadeddata="myOnLoadedData()" onprogress="myOnProgress()" src="<?php echo $audio_link;?>" controls> 

JavaScript:

function myOnLoadedData() { 
    console.log('Loaded data'); 
    $('audio.audio-player').attr('autoplay','autoplay'); 
} 
function myOnProgress(){ 
    console.log('downloading'); 
} 

Oder gibt es andere Spieler, die meine Anforderungen erfüllt?

Answer 1

Versuchen XMLHttpRequest mit Blob der Audiodatei zurückzukehren, new Audio(), .load(), .play()

var request = new XMLHttpRequest(); 
request.open("GET", "/path/to/audio/file/", true); 
request.responseType = "blob";  
request.onload = function() { 
    if (this.status == 200) { 
    var audio = new Audio(URL.createObjectURL(this.response)); 
    audio.load(); 
    audio.play(); 
    } 
} 
request.send(); 

Answer 2

ich die Methode von @ guest271314 verwendet, um eine funtion zu tun, die jede Musik Link/URL laden, die in einem Objekt sind.

function LoadSounds(obj,ch,ca){ 
(function(r){ 
    var i, 
    lo=0, // number of sounds loaded 
    len=0, // number of sounds to load 
    con={}; // an object with the sounds loaded 
    for(i in obj){ 
     len++ // increase the number of sounds to load 
    } 
    for(i in obj){ 
     (function(i){ 
      r=0; 
      r=new XMLHttpRequest(); 
      r.open("GET",obj[i],true); 
      r.responseType="blob"; 
      r.onload=function(){ 
       if(this.status==200){ 
        lo++ 
        con[i]=new Audio(URL.createObjectURL(this.response)); 
        con[i].load(); 
        ch(obj[i]); 
        if(lo==len)ca(con) 
        r=undefined; 
       } 
      } 
      r.send(); 
     })(i); 
    } 
    i=undefined; 
})(0); 

}

Komprimierte ...!

function LoadSounds(n,o,e){!function(t){var i,s=0,d=0,u={};for(i in n)d++;for(i in n)!function(i){t=0,t=new XMLHttpRequest,t.open("GET",n[i],!0),t.responseType="blob",t.onload=function(){200==this.status&&(s++,u[i]=new Audio(URL.createObjectURL(this.response)),u[i].load(),o(n[i]),s==d&&e(u),t=void 0)},t.send()}(i);i=void 0}(0)} 

Beispiel verwenden ...!

// Note that these musics in my example aren't in a valid link 
var MyMusics={ 
    Music1:'http://example.com/music.ogg', 
    BestEver:'http://example.com/bestever.ogg' 
}; 
LOAD_SOUNDS(
MyMusics, // Musics object 
function(){alert("+1 loaded");}, // function when a link music is loaded 
function(){e.BestEver.play();} // function when all musics from links were loaded 
);