Blob createObjectURL 下载在 Chrome 中不起作用答案

【问题标题】：Blob createObjectURL download not working in chromeBlob createObjectURL 下载在 Chrome 中不起作用
【发布时间】：2020-07-27 06:37:03
【问题描述】：

下面的代码在 Chrome 中显示“找不到文件”错误，但相同的代码适用于 chrome 中的某些其他环境，并且在添加了一些时间延迟后它可以正常工作。
请告知我当地环境所需时间延迟的原因。

var a = document.createElement('a');
a.style = "display: none";  
var blob = new Blob(data, {type: "application/octet-stream"});
var url = window.URL.createObjectURL(blob);
a.href = url;
a.download = filename;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
window.URL.revokeObjectURL(url);

【问题讨论】：

@CodyGray 有足够的信息来看看这里出了什么问题。
@CodyGray 如果你知道这个 API 是如何工作的，那么很明显他们会在浏览器下载之前撤销 blob URI。无需编辑，它已经是 MCVE。
请显示无延时和有延时的代码

标签： javascript revokeobjecturl

【解决方案1】：

我已经添加了如下所示的 setimeout 现在它工作正常

setTimeout(function(){ window.URL.revokeObjectURL(url); }, 3000);

【讨论】：

上一个答案告诉你要做什么...

【解决方案2】：

撤销 blob:// URI 是同步操作，而下载文件则不是。

尽管数据可以在内存中，因此下载速度非常快，但情况并非总是如此。 Blob 的数据甚至可能不在一个地方，例如一些 blobParts 可能在内存中，其他一些在用户磁盘上，甚至在通过网络访问的共享文件夹中。此外，简单地请求操作系统访问写入实际上可以异步进行。

所以当您调用revokeObjectURL 时，浏览器可能还没有时间将您的文件写入磁盘，当它尝试这样做或访问新的 blobPart 时，没有更多可用的指针在提供的地址。

不幸的是，没有任何事件让我们知道何时完成写入磁盘，至少在native-file-system API 正式发布之前不会，所以我们现在能做的最好的事情就是在撤销 blob 之前等待相当长的时间:// URI。
作为参考，FileSaver.js 确实会等待 40 秒。

【讨论】：