如何通过JavaScript或Node.js强制从文件夹下载PDF到浏览器/用户?

3

HTML(ejs模板)代码:

<input class="download" data-orderId="<%= orders[i].stubhubOrderId %>" type="button" value="Download">

JavaScript / jQuery 代码:

$(document).on('click', '.download', function (e) {
    showSpinner();
    const orderId = $(this).attr('data-orderId');
    axios.post('/get-order-ticket-by-orderid', {
        orderId: orderId
    })
    .then(function (response) {
            hideSpinner();
            // PDF Download code
            const fileURL = '/uploads/539038653.pdf'
            const fileName = '539038653.pdf'
            // for non-IE
            if (!window.ActiveXObject) {
                var save = document.createElement('a');
                save.href = fileURL;
                save.target = '_blank';
                save.download = fileName || 'unknown';

                var evt = new MouseEvent('click', {
                    'view': window,
                    'bubbles': true,
                    'cancelable': false
                });
                save.dispatchEvent(evt);

                (window.URL || window.webkitURL).revokeObjectURL(save.href);
            }

            // for IE < 11
            else if ( !! window.ActiveXObject && document.execCommand)     {
                var _window = window.open(fileURL, '_blank');
                _window.document.close();
                _window.document.execCommand('SaveAs', true, fileName || fileURL)
                _window.close();
            }   
    })
    .catch(function (error) {
        hideSpinner();
    });
});    

当我手动打开PDF(http://localhost:3001/uploads/539038653.pdf)在新标签页中,它能够正常显示,但是通过上述代码下载的PDF文件已经损坏 / 受损。我在打开下载的PDF时收到了“PDF文档已受损”的消息。
请问有人可以帮我用JavaScript从文件夹下载PDF文件吗?

你没有使用createObjectURL,所以不应该使用revokeObjectURL - Phil
1
当然可以...删除这一行 ~ (window.URL || window.webkitURL).revokeObjectURL(save.href); - Phil
是的,我已经在文本编辑器中打开了下载的文件,它似乎是编码字符串,即:%PDF-1.5 %\E2\E3\CF\D3 40 0 obj - Milan
那么问题与您的JavaScript代码无关。 - Phil
也许你太快了。是什么创建了PDF?它是异步的吗,即HTTP响应在PDF完全创建之前返回? - Phil
显示剩余12条评论
1个回答

3
我已经解决了这个问题,通过在节点路由“/get-order-ticket-by-orderid”中添加下面的代码来实现(参考我的问题中“/get-order-ticket-by-orderid”的代码)
let wstream = data.data.pipe(fs.createWriteStream('uploads/test.pdf'));
 wstream.on('finish', function () {
    return res.status(data.status).json(data);
 });

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接