Viewing pdf files from the azure blob store

Question

I'm probably doing something completely stupid as I'm new to Azure (being a DB / application developer).  It may not even be an Azure issue, but please stick with me.

I have a small ASP.NET application that displays pdf files stored locally in the file system in a browser.  I use an iframe with the class set to "PdfViewer" and the src attribute set dynamically to the full path of the file.  This works fine in IE 9 and Chrome so I know that the PDF viewer plug-ins are working.  

However, I intend to run the app in Azure and so I've been testing out the Azure blob storage.  I understand the intricacies of this (I think!)  I've uploaded some pdfs (and some jpegs as well for a comparison) using "Azure Storage Explorer" (great little app - google it!)  This allows me to get the files' URIs as well as setting the blob container to public so there's no security block.  I've waded through all the naming conventions for containers, blobs, etc. and they are OK.

According to https://www.windowsazure.com/en-us/develop/net/how-to-guides/blob-storage/#configure-access and  http://social.msdn.microsoft.com/Forums/en-US/windowsazuredevelopment/thread/4ed63963-047b-46f7-b8bb-5de5e1e8cddf,  it should now just be a matter of setting the src attribute of the PdfViewer to this URI.  

OK - it works in IE9 but not in Chrome!

In Chrome - all that happens is a blank space where the PDF viewer should be.  I've tried changing the blob security, which simply causes a "object not found" type message - so I know it's not that.  I've renamed the files to remove underscores, upper-case, etc. No luck!  I've checked the page source and the URI syntax is fine.  However, I've noticed that if I try to paste this URI into the address bar in Chrome, it just disappears and I get "About: Blank" instead.  This doesn't happen in IE9 - it takes the URI and displays the pdf.  This is suggesting to me that it's more to do with internet security through Chrome than the nature of the blob store itself.

Six hours so far!!  Please, can anyone help? 

Simon Poulton,

Director,  BioEcoSS Ltd.

Answer 1

I think I know why this is happening. It's related to content-type property of your pdf file. If you look at that property in Azure Storage Explorer, it will show you "application/octet-stream" which is the default content type for a blob. I believe Chrome goes by the content-type to launch various plugins and IE looks at the file content as well (Totally Guessing!!!). Try changing the content-type property of the pdf file in question by double clicking on that file from "application/octet-stream" to "application/pdf" and try again. You should be able to see the PDF file in Chrome as well. You may need to clear your browser cache to see the file.

Hope this helps.

Thanks

Gaurav Mantri

Cerebrata Software

http://www.cerebrata.com

Answer 2

Hi Gaurav,

Right first time!

Thank you so much for giving me this solution.  Not only has this worked for pdf files, but I've also checked it with jpg and png files in an image control as well - all worked fine.

Just a couple of words of follow-up that might be useful.  Firstly, the pdf suffix must be in lower case - I carelessly typed it in upper case for one of my test files and it did not work.

The other comment is that both the methods I used for uploading files into the blob store (Azure Storage Explorer and my own VB.NET code taken from the URL in my original post) generate "application/octet-stream" ContentType properties.  It seems to me that what I am doing is pretty standard - use the blob storage for these types of large files and then exposing them dynamically in a web page.  I assume this means that when I come to upload thousands of files, I need to write code that will modify this property on/after upload.  Furthermore, I assume that the common file extensions will work in this property - could be a useful modification for the Azure Storage Explorer!

Many thanks again.

Simon Poulton

Answer 3

I'm glad the issue is resolved. Regarding your 2nd comment about common file extensions, there are other tools available which do that at the time of uploading. Some of them are:

Cloud Storage Studio [Shameless product plug :)]: http://www.cerebrata.com/Products/CloudStorageStudio

ClumsyLeaf CloudXplorer: http://www.clumsyleaf.com

Cloudberry Blob Explorer for Azure: http://www.cloudberrylab.com/free-microsoft-azure-explorer.aspx

You may want to check that out as well.

Hope this helps.

Thanks

Gaurav

Answer 4

Dear Gaurav,

Thanks for these pointers.  No problem with the shameless plug - I've downloaded your trial version and it is definitely superior to the Azure Storage Explorer.  I'll play with it over the next month, but will I part with my hard-earned cash - that's the question?

Thanks, Simon

Answer 5

Hey Simon,

I work with Gaurav on the Cerebrata tools.

Could you drop me an email?

Regards,

Luke ([e-mail])

Answer 6

        blob.Properties.ContentType = "application/pdf";

StackOverFlow