以 PDF 格式下载时，Chrome 会阻止 Blob 对象

Question

我创建了一小段脚本，它调用 API 来获取 PDF 并将 responseType 作为数组缓冲区发送。

使用这个我创建一个新的 Blob 并将类型设置为“应用程序/pdf”

为了强制下载，我创建了一个锚元素，将 blob 传递给它并单击它。

这在本地和我的测试服务器上的其他浏览器上都可以正常工作，但在 Chrome 上我失败了 - 下载栏中没有文件。

PDF 绝对可用，因为我可以将 API 的 url 粘贴到选项卡中并查看它，并且来自原始 API 调用的响应被传递到 Blob。

示例代码

var fileName = 'dummyFilename-' + offerId + '.pdf';
var blob = new window.Blob([resData], { type: 'application/pdf' });

var anchorElement = document.createElement('a');
var url = window.URL.createObjectURL(blob);

document.body.appendChild(anchorElement);
anchorElement.id = 'anchorElement';
anchorElement.hidden = 'true';
anchorElement.href = url;

if (typeof anchorElement.download !== 'undefined') {
    anchorElement.download = fileName;
} else {
    anchorElement.target = '_blank';
}

anchorElement.click();

Answer 1

你有像 uBlock Origin 这样的广告拦截器扩展吗？如果是这样，它可能会阻止弹出窗口/选项卡中的所有 blob URL。默认情况下，Easylist 会这样做：

https://github.com/easylist/easylist/commit/e3276b6ff9611e821d0e8ba7ac4dc336a4e3b765

就我而言，我为我的网站禁用了 uBlock Origin 并且它起作用了。