Question

问题的关键：我在javascript中连续下载2个文件，Chrome会在下载一个文件或两者之间间歇性地切换。自动下载多个文件的设置已激活。

详细信息： 对于我正在维护的内部应用程序，有一个例程从API中检索两组base64字符串。此应用仅在最新版本的谷歌浏览器中运行，但在Windows 8,10和最新版本的OSX上运行。

然后前端将这些字符串解码为数据blob，然后将blob解码为2 csv并下载它们。

我用来下载文件的Web API是createObjectURL()，假设base64被正确解码为blob（因为它在多个其他实例中使用），下载文件的功能是如下：

function downloadBlob (blob, filename, extension) {
    var a = window.document.createElement('a');
    a.href = window.URL.createObjectURL(blob);
    a.download = filename + '.' + extension;
    // Append anchor to body.
    document.body.appendChild(a);
    a.click();
    // Remove anchor from body
    document.body.removeChild(a);
}

同样，这在多个实例中使用，并且工作顺利。

因此，对API进行AJAX请求以检索两个base64字符串，成功回调基本上是：

Function success (b64A, b64B) {
    var csvA = b64toBlob(b64A, 'application/vnd.ms-excel');
    downloadBlob(csvA, 'filename', 'csv');
    var csvB = b64toBlob(b64B, 'application/vnd.ms-excel');
    downloadBlob(csvB, 'filename', 'csv');
}

如您所见，下载是连续执行的。这已经在Windows 8中的chrome和OSX上的chrome上进行了测试，两者似乎都在间歇性地下载这两个文件。大多数时候他们只下载后一个文件。

我对于为什么会发生这种情况感到有点困惑，并且想知道这是否是我的代码的问题或者Chrome中的一些小众故障行为。

Answer 1

我使用HTML代码和jquery下载多个文件，但几天前我只能下载最新文件。

我认为现在被Chrome阻止了。

Answer 2

我不确定这是Chrome中的错误还是预期的行为，但是我设法通过将第二个downloadBlob()包装在200ms的setTimeout中来解决了这个问题：

Function success (b64A, b64B) {
  var csvA = b64toBlob(b64A, 'application/vnd.ms-excel');
  downloadBlob(csvA, 'filename', 'csv');
  setTimeout(function() {
    var csvB = b64toBlob(b64B, 'application/vnd.ms-excel');
    downloadBlob(csvB, 'filename', 'csv');
  }, 200);
}

下载多个文件时，使用chrome中的window.URL.createObject会间歇性地失败

2 个答案: