How to download file from azure's blob storage

Question

I am trying to download a file from azure's blob storage using jquery's $.ajax() method.

I am using the following c# code to download the blob which I believe the problem lies.

  [System.Web.Services.WebMethod]
        public static void DownLoadBlob(string blobStorageName, string companyID)
        { 
            CloudStorageAccount storageAccount = CloudStorageAccount.Parse(
                CloudConfigurationManager.GetSetting("StorageConnectionString"));
            CloudBlobClient blobClient = storageAccount.CreateCloudBlobClient();
            CloudBlobContainer container = blobClient.GetContainerReference(System.Text.RegularExpressions.Regex.Replace(companyID.ToLower(), @"\s+", ""));
            CloudBlockBlob blockBlob = container.GetBlockBlobReference(blobStorageName);
            MemoryStream memStream = new MemoryStream();
            blockBlob.DownloadToStream(memStream);
            HttpResponse response = HttpContext.Current.Response;
            response.ContentType = blockBlob.Properties.ContentType;
            response.AddHeader("Content-Disposition", "Attachment; filename=" + blobStorageName.ToString());
            response.AddHeader("Content-Length", blockBlob.Properties.Length.ToString());
            response.BinaryWrite(memStream.ToArray());
        }

The above code is triggered by the following ajax call.

  var objRecordJSON = JSON.parse(response.d);
                $.ajax({
                    type: "POST",
                    url: "FroalaImageUpload.aspx/DownLoadBlob",
                    data: '{"blobStorageName":"' + objRecordJSON[0].uploaded_file + '", ' +
                    '"companyID" : "' + $("#trainingcompanyid").val() + '" }',
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {

                    },
                    failure: function (response) {

                    }
                });

I have a break point on my server side c# code and it is hitting that piece of code. However the file does not download on the client end. I don't get any errors in the console either.

Any help or advice would be appreciated.

Thanks

Answer 1

I am trying to download a file from azure's blob storage using jquery's $.ajax() method.

AFAIK, we could not directly download a file via an Ajax call. I assumed that you could create a single WebForm page and move your code for outputting blob file(s) to Page_Load, and leverage the querystring to pass your parameters as follows:

protected void Page_Load(object sender, EventArgs e)
{
    var blobStorageName = Request.QueryString["blobStorageName"];
    var companyID = Request.QueryString["companyID"];
    CloudStorageAccount storageAccount = CloudStorageAccount.Parse(Microsoft.Azure.CloudConfigurationManager.GetSetting("StorageConnectionString"));
    CloudBlobClient blobClient = storageAccount.CreateCloudBlobClient();
    CloudBlobContainer container = blobClient.GetContainerReference(System.Text.RegularExpressions.Regex.Replace(companyID.ToLower(), @"\s+", ""));
    CloudBlockBlob blockBlob = container.GetBlockBlobReference(blobStorageName);
    System.IO.MemoryStream memStream = new System.IO.MemoryStream();
    blockBlob.DownloadToStream(memStream);
    HttpResponse response = HttpContext.Current.Response;
    response.ContentType = blockBlob.Properties.ContentType;
    response.AddHeader("Content-Disposition", "Attachment; filename=" + blobStorageName.ToString());
    response.AddHeader("Content-Length", blockBlob.Properties.Length.ToString());
    response.BinaryWrite(memStream.ToArray());
}

Then for your client, you could download the file as follows:

window.location = "/FroalaImageUpload.aspx?blobStorageName=2017%2F11%2F7%2F2017-7-10-1.png&companyID=images";

Moreover, you could also leverage iframe to download the file. Details you could refer to this similar issue.