如何通过javascript下载pdf文件？答案

【问题标题】：How to download a pdf file through javascript?如何通过javascript下载pdf文件？
【发布时间】：2013-06-07 09:08:23
【问题描述】：

我的 javascript 代码向我的 node.js 服务器发出以下 AJAX 请求：

var url = '/node/download';
var downloadRequest = new goog.net.XhrIo();
downloadRequest.headers.set('content-type', 'application/json');
downloadRequest.send(url);

我的 node.js 服务器在节点上创建一个 pdf 并通过以下代码将 pdf 流式传输回客户端：

    var filestream = fs.createReadStream(pdfpath);                  
    res.writeHead(200, {
        'Content-disposition': 'attachment; filename=' + filename,
        "Content-Type":"application/pdf","Content-Transfer-Encoding": "binary"});
    filestream.on('data', function(chunk) {                     
        res.write(chunk);
    });
    filestream.on('end', function() {
        res.end();
    });

但现在我在如何在 javascript 客户端接收此响应时遇到问题，以便打开下载提示以允许用户下载并保存 pdf 文件。

请帮忙！

提前谢谢！

附： Plz 还建议任何更好的方法来实现我的节点代码（如果有的话）

编辑：一种可能的解决方案是这样发送我的请求：

window.location.assign('/node/download');

这样我得到了下载提示，除了牺牲了产品的异步特性之外，一切正常。有没有办法解决这个问题，以便我也可以保持异步性？

【问题讨论】：

为什么要使用 XHR 而不是仅仅设置window.location？
@Christoph 请求需要是异步的，这是公司的需求。无论如何，即使我不需要使其异步，您如何建议我使用 window.location 来做到这一点？ pdf 文件是在服务器上动态创建的，因此它的名称也不是预先确定的。
附加查询字符串？无论如何，使用 AJAX 请求来触发内容创建 - 这不会阻止您设置 location 以在 PDF 可用时触发下载...
不要设置“内容传输编码”。 HTTP 中没有这样的头域。
他的第二个问题中可能有更多信息：stackoverflow.com/questions/16978546/…

标签： javascript node.js http streaming google-closure

【解决方案1】：

用于下载保存在服务器上的 pdf 文件

从客户端 javascript 发出这样的请求：

var reqObj = new XMLHttpRequest();
reqObj.open('GET','getpdf',true);     // 'getpdf' is the URI to recongize your request at the server
reqObj.send();

reqObj.onreadystatechange = function() {
    var resObj = this;
    if(resObj.readyState == resObj.DONE) {
        if (resObj.status != 200) {
            console.log("pdf can't be downloaded");
        } else if (resObj.status == 200){
            var resTxt = reqObj.responseText;
            window.location.assign(resTxt);    // Opens the pdf download prompt
        }
    }
}

在节点处理从上面收到的请求并响应：

var http = require('http');

function getPDFUrl() {
    return "http://testing.com/pdf/test.pdf";
}

var handler = http.createServer(function(request, response) {
if (request.url == 'getpdf' && request.method.toLowerCase() == 'get') {
    var pdfUrl = getPDFUrl();       //get pdf url here

    if (pdfUrl != null && pdfUrl != undefined && pdfUrl != '') {
        response.writeHead(200, {"Content-Type":"text/html"});
        response.write(pdfUrl);
        response.end();
    } else {
        response.writeHead(404, {"Content-Type":"text/html"});
        response.write("Not Found");
        response.end();
    }

}
});

【讨论】：

【解决方案2】：

我在一些应用中实现了类似的异步文件生成功能。我采用的方法涉及更多一点，但保持界面异步。

客户端发送生成文件的请求。
服务器使用生成文件的 URL 发送响应。
客户端再次请求下载生成的文件。

这对用户是不可见的，他们只需要等待第二笔交易回来。

【讨论】：