Question

以下是我的代码，该代码将iframe的src属性设置为我创建的Blob网址：-

function downloadFromIframeUsingBody(filebody: any) {
  const iframe = document.createElement('iframe');
  iframe.setAttribute('style', 'display: none;');
  const newurl = window.URL.createObjectURL(new Blob([filebody.data],{type: 'application/pdf'}));
  iframe.setAttribute('src', newurl);
  const register = () => {
    if (iframe.contentWindow) {
      setTimeout(function() {
        // Clean after 1 minute, by then it should already have started downloading
        iframe.parentNode!.removeChild(iframe);
      }, 60000);
    }  else {
      setTimeout(register, 100);
    }
  };
  register();
  document.body.appendChild(iframe);
}

我希望该iframe下载包含pdf的blob，以自动下载该blob。目前，执行此操作后没有任何反应。

Answer 1

如果您将“下载”表示为“保存在磁盘上”，则只需使用HTMLAnchorElement及其download属性。

甚至可以使用ligthweight FileSaver脚本处理所有极端情况（旧的IE和Safari怪癖）。

var blob = new Blob(["I'm just a text file..."], {type: 'plain/text'});

saveAs(blob, 'myFile.txt');

<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2014-11-29/FileSaver.js"></script>

请注意，在任何情况下都是如此。 iframe hack只是一个糟糕的hack，只有在确定没有其他更好的方法可以使用时才应使用。

现在要解释为什么它不起作用，好吧，这是因为浏览器实际上能够显示pdf文件，因此会[尝试]这样做而不是强制下载。

<iframe src="https://cdn.jsdelivr.net/gh/mozilla/pdf.js/test/pdfs/S2.pdf"></iframe>

（请注意，当前的Chrome浏览器似乎存在一个错误，该错误会使pdf阅读器在嵌套的iframe中失败，因此here is a link to a plunker，您可以通过单击浏览器上的展开按钮在浏览器中看到该错误右面板。

无法下载加载到iframe中的Blob

1 个答案: