Displaying Pdf from azure blob storage

Question

I'm trying to get a pdf file displayed on my page. The pdf file is located as a blob on azure. I'm getting the link to the blob itself from the server, that way i can grab the file directly from the storage instead of passing it through the server.

I set up a shared access signature(SAS key) because the container is protected.

Since I'm using angular 5 I need to sanitize my url which i'm doing.

 this.http.get(baseUrl + 'api/download/fileuri?sheetId=' + this.sheetId, { responseType: 'text' }).subscribe(result => {
        this.url = result.toString();            
        this.sanitizedUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.url);
        console.log(this.sanitizedUrl);
    }, error => console.error(error));

I'm then putting it inside a object, yet i either get nothing but a white page or i get the following error.

<object [data]="sanitizedUrl" type="application/pdf" style="width:100%; height:100vh"></object>

I set up the following in azure:

The weirdest part is: I can grab that file but just inputting that link, it just starts downloading it. But the moment i try to access it from the object, it throws that error. So the link is correct and it works. It's just whenever i try to access it from within the page..

I did, the last picture is of the storage account CORS. I allowed all traffic to go through by putting in * to make sure that would not block it for testing — RektByMemes
– RektByMemes, Commented Nov 8, 2018 at 11:57

Mateusz Wyczawski · Accepted Answer · 2018-11-08 11:59:48Z

1

I recommend you to download Microsoft Azure Storage Explorer. Inside of it you can set CORS policy for specific resource. I hope it will solve your problem.

answered Nov 8, 2018 at 11:59

Mateusz Wyczawski

965 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Displaying Pdf from azure blob storage

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related