logo标签列表

使用Ajax调用在新窗口中打开PDF文件

jquerynode.jsajaxpdfjsreport
3

我正在使用nodejs和jquery开发web应用程序。其中有一个报告部分。当用户使用ajax调用向服务器发送一些数据（这里我使用“get”方法来简化问题）时，它应该将pdf发送到客户端并在弹出窗口中显示。

我使用jsreport来生成服务器端的报告。

以下是Node js服务器端代码。

.get('/testPdf', async function (req, res, next) {

    var htmlNew = '<html> ' +
        '<head> ' +
        '</head> ' +
        '<body> ' +
        '<h2>Hello World</h2>' +
        '</body> ' +
        '</html> ';

    return jsreport.render({
        template: {
            content: htmlNew,
            engine: 'handlebars',
            recipe: 'chrome-pdf'
        },
    }).then((resp) => {
        var data = resp.content;
        res.contentType("application/pdf");
        res.send(data);
    });
})

这是客户端 jQuery 的代码。
function myPdfRun() {
    console.log('Call')
    $.ajax({
        type: 'get',
        url: serverLocation + "/api/dashboard/testPdf",
        contentType: "application/json; charset=UTF-8",
        success: function (response) {

            window.open("data:application/pdf," + escape(response));

        },
        error: function (textStatus, errorThrown) {
            console.log('Err');
        }
    });
}

我尝试了几个方法来完成我的任务。以下代码在ajax调用的success中执行。

尝试1

window.open("data:application/pdf," + response);

//打开了一个新标签页，但是页面是空白的。

尝试2

使用download js下载文件。

download.bind(response, "mydownload.pdf", "application/pdf");

//没有任何反应。只有成功触发。

尝试三

download(response, "mydownload.pdf", "application/pdf;base64");

//PDF已下载，但内容不可见，只有白色的纸张出现。

尝试4

(这段代码来自论坛)

var a = document.createElement('a');
var pdfAsDataUri = "data:application/pdf;base64," + response;
a.download = 'export.pdf';
a.type = 'application/pdf';
a.href = pdfAsDataUri;
a.click();

一个PDF文件被下载了，但是无法打开它。
尝试5：
window.open("data:application/pdf," + response);

//打开新窗口。但是控制台窗口中有一个错误日志。

错误: 不允许将顶部框架导航到数据URL: data:application/pdf,%PDF-1.4%0A%.................

最好的部分是，当我直接从浏览器调用Node js api (http://localhost:9176/api/dashboard/testPdf)时，它成功地打开了pdf。这意味着服务器端或返回信息没有问题。

请指导我如何使用Ajax调用在新窗口中打开pdf。

1个回答
8

php

$base64 = chunk_split(base64_encode(file_get_contents('YOUR PDF FILE')));

echo $base64 ;

java script

var a = document.createElement('a');
a.href= "data:application/octet-stream;base64,"+response;
a.target = '_blank';
a.download = 'filename.pdf';
a.click();
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接