使用Ajax设置html5媒体源

Question

我需要帮助从外部服务器获取的音频文件的身份验证标头。所以现在我正在尝试使用Ajax，我可以很好地抓取文件，但是无法将它们设置为播放器的媒体源。您如何将ajax加载的文件设置为音频源？

编辑

最后修复它，以防有人以这种方式回来。

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();
};

不得不执行asynch：false，否则我会得到一小部分音频，而不是全部音频。尽管删除了异步，最终使调试变得更加容易。

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();
};

不得不执行asynch：false，否则我会得到一小部分音频，而不是全部音频。尽管删除了异步，最终使调试变得更加容易。