How To Upload A Text String Directly To Windows Azure Blob From The Browser Using Javascript

I would like to upload from a web browser a text/html string as an Azure blob directly to Azure storage (without first going thru the Azure VM/webserver) using browser side javasc

Solution 1:

I don't think this can be done. Unless the web page is being hosted from the same blob storage domain, this would be a cross-domain call, which isn't allowed (unless CORS headers are set, which they aren't for blob storage).

In addition, uploading to a blob requires an HTTP PUT request, and I believe most browsers only allow POST and GET.

UPDATE

See comments below, but it looks like some browsers do allow PUT requests. As noted, the same-origin policy can be defeated by serving the original page from the same blob storage account. In that case, the code would look something like this (using jQuery):

$.ajax({
    url: url,
    type: 'PUT',
    data: 'Hello, World!',
    headers: {'Content-Type': 'text/html'}
}).success(function () {
    console.log('Saved successfully.');
});

Solution 2:

You can upload from the client without touching the MVC site using JavaScript, I have written a blog post with an example on how to do this http://blog.dynabyte.se/2013/10/09/uploading-directly-to-windows-azure-blob-storage-from-javascript/ the code is at GitHub

It is based on Gaurav Mantris post and works by hosting the JavaScript on the Blob Storage itself.