从 javascript blob 下载 PDF，不替换打开的页面

Question

我在浏览器中生成了一个 PDF，并将其转换为 blob object。使用 javascript 注入 a 标签（下面的示例代码）的“传统”下载方法会在浏览器中打开 PDF，但是这会替换用户打开的页面，导致他们丢失任何未保存的工作。添加 target="_blank" 不会改变这一点，文档仍会在同一选项卡中打开。

const blob = new Blob([arrayBuffer], { type: "application/pdf" });
const url = URL.createObjectURL(blob);

const anchorElement = document.createElement('a');
anchorElement.href = url;
anchorElement.download = fileName;
anchorElement.target = "_blank";

anchorElement.click();
anchorElement.remove();
URL.revokeObjectURL(url);

我很乐意在新选项卡中打开 PDF 或强制下载它。由于 PDF 不是从 URL 加载的，因此无法在其上设置任何 headers。

Answer 1

尝试一下；

const blob = new Blob([arrayBuffer], { type: "application/pdf" });
const url = URL.createObjectURL(blob);
window.open(url, '_blank');

Answer 2

最终找到了解决方案，在 blob 上错误地设置 MIME 类型会破坏浏览器的文件类型检测，并停止启动 built-in 预览。

const blob = new Blob([arrayBuffer], { type: "application/octet-stream" });

从 javascript blob 下载 PDF，不替换打开的页面

Download PDF from javascript blob, without replacing the open page

javascript

pdf

download