使用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:假,否则我会得到一小部分音频而不是全部.虽然删除asynch最终使调试更容易.

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，否则我会得到一小块音频而不是全部。尽管删除异步最终使调试变得更容易。