Chrome 浏览器上的自动文件下载限制为 10 个文件

Question

我有一个网页，我们根据用户选择的页面项目生成 PDF。这会导致创建 PDF 服务器端的回发（它是一个 ASP.NET WebForms 页面）。一<a class="documentDownload">则标记添加到每个项目的页面。

当页面在浏览器中重新加载时，将执行以下 jQuery 脚本以自动下载文件（如果用户选择了自动下载选项）：

var divHost = document.createElement("div");
divHost.id = "elmntDnldLinks";
divHost.style.display = "none";
document.body.appendChild(divHost);

setTimeout(function() {
    $(".documentDownload").each(function(idx, val) {

        var lnkDownload = $(val),
            save = document.createElement("a");

        save.href = lnkDownload.attr("href");
        save.download = lnkDownload.attr("download");
        save.target = "_blank";
        divHost.appendChild(save);
        save.click();
    });
}, 1000);

此脚本有 1 秒的延迟，然后对于每个 .documentDownload 元素，它会创建一个<a>与href原始元素具有相同属性的新元素，将其附加到新添加的隐藏元素，然后以编程方式单击它。

[这种创建新链接并单击这些链接而不是单击原始 DOM 元素的策略绕过了浏览器安全措施。]

这在 Firefox 中运行良好，但 Chrome 从不下载超过 10 个文件。为什么？例如，我可以在页面和隐藏元素中看到 15 个链接，但只下载了 10 个文件。

Answer 1

如果您在每 10 次下载之间暂停一秒钟，则所有这些都将在 Chrome 中运行。

我为此解决方法使用了异步超时功能：

function pause(msec) {
    return new Promise(
        (resolve, reject) => {
            setTimeout(resolve, msec || 1000);
        }
    );
}

async function downloadAll(elements) {
    var count = 0;
    for (var e in elements) {

        download(elements[e]); // your custom download code here, click or whatever

        if (++count >= 10) {
            await pause(1000);
            count = 0;
        }
    }
}

简单的超时乘以元素计数器也可能有效，但我没有测试它。