不使用Zip文件下载多个文件

Question

我有一个通用的处理程序Document.ashx,可以通过读取查询字符串中的信息来动态创建Word文档Document.ashx?clientid=123&documentid=10,它可以很好地工作.

我需要创建一个带有复选框和Download All按钮列表的界面.到目前为止我最好的想法是使用这样的东西来调用处理程序.

$("body").append("<iframe src='Document.ashx?clientid=123&documentid=10'></iframe>
                  <iframe src='Document.ashx?clientid=123&documentid=11'></iframe>")

Chrome和Firefox按预期处理此问题,但IE9会提示用户询问是否要保存第一个文件但忽略以下文件.

如何从客户端开始下载多个文件？

这是一个内部网站点,因此文件总是在〜1秒内生成,用户一次选择〜3-5个文档.绝大多数用户都在使用IE9.我可以告诉每个人他们必须使用Firefox或Chrome,但我宁愿找到适用于所有现代浏览器的解决方案.

我不想创建一个zip文件服务器端,因为它们总是必须首先解压缩它(这对于某些人来说太难理解)并且它会减慢它们的速度.

Answer 1

所以这可能是矫枉过正,但适用于IE9,FF7和Chrome 16:

灵感来自这篇SO帖子

jQuery插件:

• json2.js
• $ .cookie()
• $ .bbq()

处理程序中的C#:

public void ProcessRequest (HttpContext context) {

    ...

    if (!string.IsNullOrEmpty(context.Request.QueryString["downloadid"])) 
          Response.Cookies[context.Request.QueryString["downloadid"]].Value = "complete";
}

使用Javascript/jQuery的:

function downloadFile(url, downloadid) {
    //set a cookie with a unique download id
    $.cookie(downloadid, 'pending', { path: '/' });

    //create a new url
    var newurl = $.param.querystring(url, { downloadid: downloadid });

    //append an iframe with new url
    $("body").append("<iframe style='height:0;width:0;' data-downloadid='" + downloadid + "' src='" + newurl + "'></iframe>");
}

function downloadComplete(downloadid) {
    //check if download is pending
    return $.cookie(downloadid) == "complete";
}

function downloadManager(arrDownloads) {
    //loop through download items backwards
    var allComplete = false;
    for (var i = arrDownloads.length; i > 0; i--) {
        if (downloadComplete(arrDownloads[i - 1].downloadid)) {
            //download the next one if it exists
            if (i == arrDownloads.length) {
                allComplete = true;
            }
            else {
                downloadFile(arrDownloads[i].url, arrDownloads[i].downloadid);
            }
            //stop checking for completed downloads
            break;
        }
    }

    if (allComplete) {
        //remove cookies
        for (var i = arrDownloads.length; i > 0; i--) {
            $.cookie(arrDownloads[i - 1].downloadid, null, { path: '/' });
        }

        //remove iframes
        $("iframe[data-downloadid]").remove();
    }
    else {
        setTimeout("downloadManager(" + JSON.stringify(arrDownloads) + ");", 500);
    }
}

function downloadFiles(arrurls) {
    var arrDownloads = [];

    for (var i = 0; i < arrurls.length; i++) {
        var item = new Object();
        item.url = arrurls[i];
        item.downloadid = newGuid();
        arrDownloads.push(item);
    }

    //start the first download
    downloadFile(arrDownloads[0].url, arrDownloads[0].downloadid);
    //initiate the manager
    downloadManager(arrDownloads);
}

$(function () {
    var arrurls = [];
    arrurls.push("Document.ashx?clientid=123&documentid=10");
    arrurls.push("Document.ashx?clientid=123&documentid=11");
    arrurls.push("Document.ashx?clientid=123&documentid=12");
    arrurls.push("Document.ashx?clientid=123&documentid=13");
    arrurls.push("Document.ashx?clientid=123&documentid=14");
    downloadFiles(arrurls);
});

Answer 2

jQuery插件,它将为您完成工作:

github.com/biesiad/multiDownload