如何强制/允许用户下载多个文件？ （客户端）

问题描述

输入是可变数量的URL（远程），所有链接图像资源。希望允许用户允许在一批中下载所有这些URL。由于我们讨论的是1000-2000个图像资源，要求用户点击另存为...，因为每个URL都不可行。

The input is a variable number of URLs (remote), all linking image resource. It is desired to allow user to allow to download all of these URLs in one batch. Since we are talking about 1000-2000 image resources, asking user to click "Save As..." for every URL is not feasible.

我原来的尝试是下载将所有图像转换为blob（，由于同源策略不起作用），归档文件并允许用户下载（所有这个客户端）。

My original attempt was to download all the images into a blob (How to read loaded image into a blob?, did not work because of the same-origin policy), archive the file and allow the user to download it (all of this client side).

我想知道什么是可能的替代解决方案？无论解决方案是什么，它都不得涉及随时将远程资源下载到服务器。

I was wondering what are possible alternative solutions? Whatever the solution is, it must not involve downloading the remote resources to the server at any time.

推荐答案

虽然它不应该有可能，我设法在Chrome中做了一些巫术。首先，您需要将下载 attrbute设置为所有链接f.ex：

Although it shouldn’t be possible, I managed to do this in Chrome with some sorcery. First you need to set the download attrbute to all your links f.ex:

<a href="http://example.com/image1.jpg" download>download</a>
<a href="http://example.com/image2.jpg" download>download</a>

然后创建一个合成点击功能：

Then create a synthetic click function:

function makeClick(element) {
    var evt = element.ownerDocument.createEvent('MouseEvents');
    evt.initMouseEvent('click', true, true,
        element.ownerDocument.defaultView, 1, 0, 0, 0, 0, false,
        false, false, false, 1, null);
    element.dispatchEvent(evt);
}​

然后只需循环链接并调用它：

Then just loop through your links and call it:

var links = document.getElementsByTagName('a');
for(var i=0;i<links.length; i++) {
    makeClick(links[i]);
}

这是一个演示：

在Chrome中，您会收到类似警告的警告这个网站要你下载多个文件。允许吗？但这可能是可以控制的。

In Chrome you will get a warning saying something like "This site wants you to download multiple files. Allow?" but this might be manageable.

免责声明：我没有在其他浏览器中尝试过，我认为它不是跨浏览器友好的。

Disclaimer: I havent tried in other browsers, and I don’t think it’s very cross-browser friendly.

这篇关于如何强制/允许用户下载多个文件？ （客户端）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！