Download or View file from Azure Blob in Aurelia UI

Question

I have my files stored in the Azure. I want to download or viewing mechanism the file on the client side. Like this:

Azure -> Api -> Client UI (Aurelia)

I have seen lot of c# examples, however I am not sure how to get the file on the UI side. Can anyone please help!

Thanks!

Edit:

Api Code:

public string getUtf8Text()
{
    CloudBlobClient blobClient = storageAccount.CreateCloudBlobClient();

    var containerName = "myContainer";
    var blobName = "myBlobName.pdf";                
    CloudBlobContainer container = blobClient.GetContainerReference(containerName);
    CloudBlockBlob blockBlob  = container.GetBlockBlobReference(blobName);

     string text;
     using (var memoryStream = new MemoryStream())
     {
        await blockBlob.DownloadToStreamAsync(memoryStream);
        text = System.Text.Encoding.UTF8.GetString(memoryStream.ToArray());
        return text;
     }
}

Trying to download a file, from the utf8 byte string. The client side code is:

var byteCharacters =result.byteArray;
var byteNumbers = new Array(result.byteArray.length);
for (var i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
var byteArray = new Uint8Array(byteNumbers);
var octetStreamMime = "application/octet-stream";
var contentType = octetStreamMime;
var blob = new Blob([byteArray] {type: contentType});
FileSaver.saveAs(blob, result.blobName);

it works sometimes for pdf, rest of the times its just blank pages. It hangs forever for mp4. Any idea whats going on here?

score 0 · Answer 1 · answered Jul 29 '16 at 00:35

Each blob has a unique URL address. You can use this to display the contents of the blob via a client that can process a URL.

The blob URL will be similar to:

https://myaccount.blob.core.windows.net/mycontainer/myblob

See Naming and Referencing Containers, Blobs, and Metadata for more information.

The greater challenge comes in how you authenticate access to the blob for your users. You have a couple of options:

You can make blobs in the container public, and thus available for anonymous access, without authentication. This means that all blobs in that container will be public. See Manage anonymous read access to containers and blobs.
You can use a shared access signature to delegate access to blobs in the container with the permissions you specify and over the time interval that you specify. This gives you a greater degree of control than anonymous access but also requires more design effort. See Shared Access Signatures, Part 1: Understanding the SAS model.

Note that although anyone possessing your account key can authenticate and access blobs in your account, you should not share your account key with anyone. However, as the account owner, you can access your blobs from your application using authentication with the account key (also known as shared key authentication).

I was thinking more like returning stream from the api, and then using that stream in the UI to convert to the doc. Isnt that possible? — genericuser, Jul 29 '16 at 13:34
Yes, you can get the stream by using a method like https://msdn.microsoft.com/en-us/library/microsoft.windowsazure.storage.blob.cloudblockblob.downloadtostreamasync.aspx. However, I can't tell you how to convert the stream in Aurelia; I'm not familiar with that framework. — Tamra Myers - Microsoft, Jul 29 '16 at 21:05

Download or View file from Azure Blob in Aurelia UI

1 Answers1