angular - 显示来自 azure blob 存储的 Pdf

Question

我正在尝试在我的页面上显示一个 pdf 文件。pdf 文件位于 azure 上的 blob 中。我从服务器获取到blob本身的链接，这样我就可以直接从存储中获取文件，而不是通过服务器传递它。

我设置了共享访问签名（SAS 密钥），因为容器受到保护。

因为我使用的是 angular 5，所以我需要清理我正在做的 url。

 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));

然后我将它放在一个对象中，但我要么只得到一个白页，要么得到以下错误。

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

我在天蓝色中设置了以下内容：

最奇怪的部分是：我可以抓取该文件，但只需输入该链接，它就会开始下载它。但是当我尝试从对象访问它时，它会抛出该错误。所以链接是正确的并且有效。只是每当我尝试从页面内访问它时..

标签： angularazureazure-storage

Answer 1

我建议您下载 Microsoft Azure Storage Explorer。在其中，您可以为特定资源设置 CORS 策略。我希望它能解决你的问题。