Impostazione della sorgente multimediale html5 utilizzando ajax

Question

Avevo bisogno di aiutare le intestazioni di autenticazione per i miei file audio che stavo catturando da un server esterno. Quindi ora sto cercando di usare ajax, posso prendere i file bene, ma non posso impostarli come fonte multimediale per il mio giocatore. Come ti avvicini all'impostazione di un file caricato ajax come sorgente audio?

EDIT

Finito fissandolo in caso qualcuno torna in questo modo.

if (this.mAudioPlayer.canPlayType("audio/mpeg")) { 
    this.mExtension = '.mp3'; 
}else if (this.mAudioPlayer.canPlayType("audio/ogg")) { 
    this.mExtension = '.ogg'; 
} else if (this.mAudioPlayer.canPlayType("audio/mp4")) { 
    this.mExtension = '.m4a'; 
} 

this.CreateAudioData = function() { 

    //downloading audio for use in data:uri 
    $.ajax({ 
     url: aAudioSource + this.mExtension + '.txt', 
     type: 'GET', 
     context: this, 
     async: false, 
     beforeSend: function(xhr) {xhr.setRequestHeader('Authorization', window.userId);}, 
     success: this.EncodeAudioData, 
     error: function(xhr, aStatus, aError) { HandleError('Audio Error: ' + aStatus); } 
    }); 
}; 

this.EncodeAudioData = function(aData) { 
    //this.mAudioData = base64_encode(aData); 
    this.mAudioData = aData; 

    if (this.mExtension == '.m4a') { 
     Debug("playing m4a"); 
     this.mAudioSrc = "data:audio/mp4;base64," + this.mAudioData; 
    } else if (this.mExtension == '.ogg') { 
     Debug("playing ogg"); 
     this.mAudioSrc = "data:audio/ogg;base64," + this.mAudioData; 
    } else if (this.mExtension == '.mp3') { 
     Debug("playing mp3"); 
     this.mAudioSrc = "data:audio/mp3;base64," + this.mAudioData; 
    } 

}; 

this.play = function() { 

    if (this.mAudioPlayer.src != this.mAudioSrc) { 
     this.mAudioPlayer.src = this.mAudioSrc; 
    } 
    this.mAudioPlayer.load(); 
    this.mAudioPlayer.play(); 
}; 

doveva fare asincrono: true, altrimenti avrei ottenere un piccolo pezzo di audio invece di tutto questo. Anche se rimuovendo il debug asynch reso più facile alla fine.

Answer 1

if (this.mAudioPlayer.canPlayType("audio/mpeg")) { 
    this.mExtension = '.mp3'; 
}else if (this.mAudioPlayer.canPlayType("audio/ogg")) { 
    this.mExtension = '.ogg'; 
} else if (this.mAudioPlayer.canPlayType("audio/mp4")) { 
    this.mExtension = '.m4a'; 
} 

this.CreateAudioData = function() { 

//downloading audio for use in data:uri 
$.ajax({ 
    url: aAudioSource + this.mExtension + '.txt', 
    type: 'GET', 
    context: this, 
    async: false, 
    beforeSend: function(xhr) {xhr.setRequestHeader('Authorization', window.userId);}, 
    success: this.EncodeAudioData, 
    error: function(xhr, aStatus, aError) { HandleError('Audio Error: ' + aStatus); } 
    }); 
}; 

this.EncodeAudioData = function(aData) { 
    //this.mAudioData = base64_encode(aData); 
    this.mAudioData = aData; 

    if (this.mExtension == '.m4a') { 
    Debug("playing m4a"); 
    this.mAudioSrc = "data:audio/mp4;base64," + this.mAudioData; 
    } else if (this.mExtension == '.ogg') { 
    Debug("playing ogg"); 
    this.mAudioSrc = "data:audio/ogg;base64," + this.mAudioData; 
    } else if (this.mExtension == '.mp3') { 
    Debug("playing mp3"); 
    this.mAudioSrc = "data:audio/mp3;base64," + this.mAudioData; 
    } 

}; 

this.play = function() { 

    if (this.mAudioPlayer.src != this.mAudioSrc) { 
     this.mAudioPlayer.src = this.mAudioSrc; 
    } 
    this.mAudioPlayer.load(); 
    this.mAudioPlayer.play(); 
}; 

doveva fare asincrono: true, altrimenti avrei ottenere un piccolo pezzo di audio invece di tutto questo. Anche se rimuovendo il debug asynch reso più facile alla fine.

Answer 2

Stai effettivamente scaricando il file o restituendolo in formato codificato Base64 (vale a dire come URI di dati)?

Cambiare la sorgente di un elemento audio tramite JavaScript è abbastanza semplice.

<audio id="myAudio" controls /> 

E poi una volta che hai la fonte ,:

var audio = document.getElementById("myAudio"); 
audio.src = myAudioFile; 
audio.type = "type/ogg"; // ony showing an OGG example here