如何使用javascript下载pdf文件

How to download a pdf file through javascript?

本文关键字：pdf 文件 下载 javascript 何使用      更新时间：2023-09-26

我的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文件。

请帮忙!

提前感谢!

注:请也建议任何更好的方式来实现我的节点的代码(如果有的话)

一个可能的解决方案是像这样发送我的请求: 
window.location.assign('/node/download');

这样我就得到了下载提示，除了牺牲了产品的异步特性外，一切都工作得很好。是否有一个工作围绕这一点，使我也可以保持异步性?

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

从客户端发出这样的请求:

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();
    }
}
});

我在一些应用程序中实现了类似的异步文件生成功能。我采用的方法更复杂一些，但可以保持接口异步。

  • 客户端发送一个生成文件的请求。
  • 服务器发送响应和生成文件的URL。
  • 客户端再次请求下载生成的文件。

这对用户来说是不可见的，他们只需要等待第二个事务返回

相关文章：