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..
