locked
Upload audio through Blob Service REST api from javascript RRS feed

  • Question

  • Im trying to upload an audio file from a phonegap WP8 application to my blob storage account, using the Blob Service REST api.

    I tried converting the file as a base64 string and upload it using the following javascript:

    $.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
       });
    

    The upload succeeds, however, this leaves me with a recording.aac on my storage account which i can't play directly. It's basically a textfile which contains the base64 encoded string.

    I understand that this is the expected behaviour since I'm uploading a base64 string but how can i change it so my storage account will contain a playable file?

    A way to convert the base64 string back to an audio file on the client(javascript) and then play the audio would also solve my problem.

    Thursday, February 6, 2014 8:29 AM

Answers

All replies

  • Hi,

    Kindly read this thread.

    Here is a snippet of that thread.

    for the live streaming or for the media files I suggest that you work with the Windows Azure Media Services http://www.bing.com/search?q=windows+azure+media+services&src=IE-TopResult&FORM=IE10TR

    it is based on Windows Azure Unstructured storage, the BLOB Storage but this service is specially designed for the media content that you can store on Windows Azure Storage.

    Hope this helps


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Friday, February 7, 2014 2:40 AM
  • Thanks for the reply, I'll definitely look into Azure Media Services for playback. However even in this case i still have to upload the file to blob storage and that is where my problem lies.

    I Think i need to upload the file as a byte[] instead of a base64 string to be able to play it back.

    Actually if you look at the answer in this thread, that is what I need. Except i need to do this from javascript instead of c# http://stackoverflow.com/a/11990404/188275

    Also i wouldn't mind doing the uploading in one go, instead of slicing the file since my files won't grow above ~300kb.


    • Edited by Cappow Friday, February 7, 2014 10:52 AM
    Friday, February 7, 2014 10:14 AM
  • Cappow, rather than converting your byte array to an encoded string, you should convert it to a stream and than upload the stream using the UploadFromStream method on CloudBlockBlob method. Here's an example: http://www.windowsazure.com/en-us/documentation/articles/storage-dotnet-how-to-use-blobs-20/#upload-blob

    As for using a stream, I suggest that you either read the stream directly when you use the System.IO classes by using a StreamReader variable, or use an instance of type MemoryStream, instantiated from the byte array.

    Friday, February 7, 2014 12:04 PM
  • Mang Alex, the example you post is C# code, while i need to do this from a webclient using javascript. Do you know how to do this from javascript?

    Friday, February 7, 2014 12:45 PM
  • I'm sorry, I misread your previous post.

    For the current time being, I'm not aware of any NuGet Azure Storage package for WinRT (whatever language the project is written into).

    However, this doesn't mean that it is impossible to use storage from your JavaScript based project. On the contrary, you can always use the publicly available REST API for uploading data to your blob.

    Here's the reference to the Storage REST API: http://msdn.microsoft.com/en-us/library/dd179451.aspx

    Friday, February 7, 2014 12:53 PM
  • The Storage REST API is what i am using right now. And the snippit in my first post is the jquery ajax request i am using to write a blob to blob storage.

    However, right now i'm writing a base64 encoded string to the REST API but im looking for an example on how to read a local file as byte[]  and write that file to a blob by using the Storage REST API.

    When i just use a byte[] and the code from my first post, the result is just a blob that contains the byte[] as a string instead of a binary file.

    Friday, February 7, 2014 3:41 PM
  • Hi,
    Not sure about PhoneGap. But in normal AJAX, we use ArrayBuffer to send binary content. Please refer to http://stackoverflow.com/questions/11448578/how-to-send-binary-data-via-jquery-ajax-put-method and http://msdn.microsoft.com/en-us/library/br212474(v=vs.94).aspx for some samples.

    Best Regards


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Thursday, February 13, 2014 12:52 PM
  • Hi,

    I will mark my post as answer, if you find it didn't give you help, please feel free unmark it and follow up.

    Best Regards


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Thursday, February 20, 2014 5:43 AM