Einstellen der HTML5-Medienquelle mit Ajax
Ich musste Authentifizierungsheader für meine Audiodateien unterstützen, die ich von einem externen Server abgerufen habe. Jetzt versuche ich, Ajax zu verwenden. Ich kann die Dateien in Ordnung bringen, aber ich kann sie nicht als Medienquelle für meinen Player festlegen. Wie gehen Sie vor, um eine mit Ajax geladene Datei als Audioquelle festzulegen?
BEARBEITEN
Behebung des Problems für den Fall, dass jemand auf diese Weise zurückkommt.
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();
};
Musste asynch machen: false, sonst würde ich einen kleinen Teil des Audios bekommen, anstatt alles. Obwohl das Entfernen des Asynchrons das Debuggen am Ende einfacher machte.