2014-02-05 81 views
1

Im在播放存儲爲來自javascript的Azure Blob存儲中的bae64編碼字符串的音頻文件(.aac)時遇到問題。從Azure Blob服務播放base64音頻字符串Javascript/Phonegap

我有以下情形:

  • 移動應用(PhoneGap的),它記錄音頻的文件.AAC並將其存儲在localStorage的。文件同樣很小(< 250kb)
  • 文件get被轉換爲base64編碼的字符串,並通過使用Blob服務REST api通過jquery ajax調用(請參閱UPLOAD_CODE)上載到我的blob存儲帳戶。有關BLOB服務rest api的詳細信息,請參見this page
  • 當我通過瀏覽器手動下載該文件I可以看到哪些開始女巫的base64編碼字符串「的數據:應用/八位字節流;的base64,AAAA .....」

UPLOAD_CODE片段:

$.ajax({ 
    url: url, 
    type: "PUT", 
    data: requestData, 
    processData: false, 
    beforeSend: function (xhr) 
       { 
       xhr.setRequestHeader('x-ms-blob-type', 'BlockBlob'); 
       }, 
       tryCount: 0, 
       retryLimit: NUMBER_OF_RETRIES, 
       success: successcallback, 
       error: errorcallback 
    }); 

此時一切都很好。我被卡在從存儲API中回放文件。我可以通過url訪問文件,但現在我想讓用戶能夠聽取上傳的音頻。

我一直沿着下面的解決方案,我一直沒能想獲得工作尚未:

A.使用PhoneGap的媒體類,並通過在URL中編碼字符串中的Base64並開始播放(流)音頻。

B.下載base64字符串,在javascript中轉換爲音頻文件並開始播放。

C.將Blob存儲中的文件上傳爲實際的aac文件,而不是base64編碼的字符串,以便在通過例如瀏覽器打開網址時開始播放。

D. ...?

我可以通過什麼方式將這些場景中的任何一個轉變爲可行的解決方案?

回答

0

我已經通過將文件上傳爲byte []而不是base64編碼的字符串來解決此問題。文件get以blob存儲中的.aac音頻文件形式存儲,並可直接從存儲中播放。

用於上傳我使用以下代碼:

var reader = new FileReader(); 
reader.onloadend = function (evt) { 

if (evt.target.readyState === FileReader.DONE) { // DONE == 2 

    var RETRY_TIMEOUT_SECONDS = 5; 
    var NUMBER_OF_RETRIES = 3; 

    var requestData = new Uint8Array(evt.target.result); 

    $.ajax({ 
      url: url, 
      type: "PUT", 
      data: requestData, 
      processData: false, 
      beforeSend: function (xhr) { 
           xhr.setRequestHeader('x-ms-blob-type', 'BlockBlob'); 
          }, 
      tryCount: 0, 
      retryLimit: NUMBER_OF_RETRIES, 
      success: function (data, status) { 
           console.log(status); 
          }, 
       error: function (xhr, desc, err) { 
         if (xhr.status === 403) { 
            console.log("Access denied, the assigned upload time has been exeeded"); 
           } else { 
            this.tryCount += 1; 
            if (this.tryCount <= this.retryLimit) { 
             console.log("Retrying transmission"); 
             setTimeout($.ajax(this), RETRY_TIMEOUT_SECONDS * 1000); 
             return; 
            } 
           } 
           console.log(desc); 
           console.log(err); 
          } 
         }); 
        } 
       }; 

    // Read the file as a byte[] 
    reader.readAsArrayBuffer(dbFile);