时间戳

首页 > 解决方案 > iframe src 中的 blob 对象

angular - iframe src 中的 blob 对象

问题描述

我正在尝试做一些看起来很简单的事情：我正在尝试在 iframe 中显示一个 window.URL.createObjectURL （* .pdf 文件 - Blob）。我试图通过将 iframe src 属性绑定到 window.URL.createObjectURL 函数的输出来做到这一点。请参阅我的代码：组件 Html：

<iframe [src]="safeResourceUrl" class="iframe"></iframe>

在组件中绑定属性：

safeResourceUrl : SafeResourceUrl;
this.safeResourceUrl = this.sanitizer.bypassSecurityTrustResourceUrl(url);

网址看起来像这样（示例）：

“斑点：http://localhost:4200/84999abe-5a02-48e0-bf61-f693eb5e0f6b ”

这是它的内容（没错，这些是保存为 PDF 的 HTML 标记，但任何其他内容也应该没问题）：

<html>
  <body>
     <label style="color:red;"> test file (HTML) </label>
  </body>
</html>

文件路径由从 webApi 获取请求生成的 Blob 生成。请求配置为：

responseType: 'blob'

并且 blob 类型是

 type: 'application/octet-stream'

我在这里想念什么？下载的文件内容正确，但 iframe 内容（在开发人员工具中包含空 HTML 标记）：

<html><head></head><body></body></html>

请支持

标签： angularasp.net-web-apiiframehttpresponse

解决方案

经过几次测试后弄清楚了：我将 blob 类型设置为“application/pdf”，而不是用于下载的“application/octet-stream”。

const blob = new Blob([res.body], { type: obj.action == FileAction.save ?  'application/octet-stream' : 'application/pdf' }); // preview in a PDF format

推荐阅读