直接从 JavaScript 打印 PDF

IT技术 javascript pdf
2021-02-08 03:25:09

我正在用 HTML 构建一个 PDF 列表。在列表中,我想包含一个下载链接和一个打印按钮/链接。有没有办法直接打开 PDF 的“打印”对话框,而无需用户查看 PDF 或打开 PDF 查看器?

将 PDF 下载到隐藏的 iframe 并触发它使用 JavaScript 打印的一些变体?

6个回答

根据下面的评论,它不再适用于现代浏览器
这个问题展示了一种可能对您有帮助的方法:Silent print an Embedded PDF

它使用<embed>标签将 PDF 嵌入到文档中:

<embed
    type="application/pdf"
    src="path_to_pdf_document.pdf"
    id="pdfDocument"
    width="100%"
    height="100%" />

然后.print()在加载 PDF 时在 Javascript 中调用元素上方法:

function printDocument(documentId) {
    var doc = document.getElementById(documentId);

    //Wait until PDF is ready to print    
    if (typeof doc.print === 'undefined') {    
        setTimeout(function(){printDocument(documentId);}, 1000);
    } else {
        doc.print();
    }
}

您可以将嵌入内容放置在隐藏的 iframe 中并从那里打印出来,从而为您提供无缝体验。

更容易将 javascript 添加到 pdf 以在渲染时打印。这就是 Google 文档所做的。这样,浏览器或 adobe 插件都会加载并打印它。
2021-03-16 03:25:09
如果嵌入的文档位于不同的域中,这将不起作用。
2021-03-22 03:25:09
此解决方案不起作用...我的 Chrome 和 FF 权限被拒绝
2021-04-01 03:25:09
这不再有效。Chrome 最新版本,同一域中的 PDF。@nullability 如果您找不到解决方法,请编辑并明确说明过去所写的内容是真实的,但不再有效,这样人们就不会浪费时间尝试。
2021-04-01 03:25:09
是的,我在所有未定义 print() 方法的浏览器上都遇到了问题。这种方法过时了吗?还有其他解决方案吗?
2021-04-05 03:25:09

这是一个从 iframe 打印 PDF 的函数。

您只需要将 PDF 的 URL 传递给函数。加载 PDF 后,它将创建一个 iframe 并触发打印。

请注意,该函数不会破坏 iframe。相反,它每次调用函数时都会重用它。很难销毁 iframe,因为在打印完成之前需要它,并且打印方法没有回调支持(据我所知)。

printPdf = function (url) {
  var iframe = this._printIframe;
  if (!this._printIframe) {
    iframe = this._printIframe = document.createElement('iframe');
    document.body.appendChild(iframe);

    iframe.style.display = 'none';
    iframe.onload = function() {
      setTimeout(function() {
        iframe.focus();
        iframe.contentWindow.print();
      }, 1);
    };
  }

  iframe.src = url;
}
感谢您,因为您帮我解决了一个大问题:没有setTimeout,打印功能有时会失败。不知道为什么,希望有人能找到它。
2021-03-21 03:25:09
如果 iframe 内容不是来自同一来源,Chrome 会阻止 .print() 方法。不幸的是,截至 2021 年不起作用
2021-03-24 03:25:09
打印方法确实有回调支持,但是当您在 2014 年编写此答案时还没有得到广泛支持。所有主要桌面浏览器的最新版本都支持onafterprint. 我有点担心重用 iframe 可能会引入竞争条件,即有人快速点击两个按钮并最终打印第二个 PDF 两次,因为 iframe URL 在第一个打印对话框出现之前已经被换出。
2021-03-25 03:25:09

您可以使用 Print.js ( npm install print-js)。解压后大小为 128kB,您可以在http://printjs.crabbly.com/ 上找到文档

不过,它不会在 IE 上打印,在这些情况下,您必须下载 PDF。

$http({
    url: "",
    method: "GET",
    headers: {
        "Content-type": "application/pdf"
    },
    responseType: "arraybuffer"
}).success(function (data, status, headers, config) {
    var pdfFile = new Blob([data], {
        type: "application/pdf"
    });
    var pdfUrl = URL.createObjectURL(pdfFile);
    //window.open(pdfUrl);
    printJS(pdfUrl);
    //var printwWindow = $window.open(pdfUrl);
    //printwWindow.print();
}).error(function (data, status, headers, config) {
    alert("Sorry, something went wrong")
});
不在 IE、Edge 或 Firefox 上打印 PDF。
2021-03-21 03:25:09
我可以单击打印多个 pdf 文件吗?
2021-03-24 03:25:09
刚试过演示页面。它在 Firefox 中打印
2021-03-26 03:25:09
今天尝试使用 jQuery get 从服务器获取 pdf 的字节,然后创建 blob 和 'createOvjectURL' 如上所述。在这种情况下,PrintJS 不显示打印对话框。:)
2021-03-30 03:25:09

https://github.com/mozilla/pdf.js/

现场演示http://mozilla.github.io/pdf.js/

这可能是你想要的,但我看不出这有什么意义,因为现代浏览器包含这样的功能,而且它在低功耗设备上运行速度也会非常慢,比如移动设备,顺便说一下,这些设备有自己优化的插件和应用程序.

Pdf.js 在打印大文件时也非常慢,比如 80MB+
2021-04-04 03:25:09

我使用此功能从服务器下载 pdf 流。

function printPdf(url) {
        var iframe = document.createElement('iframe');
        // iframe.id = 'pdfIframe'
        iframe.className='pdfIframe'
        document.body.appendChild(iframe);
        iframe.style.display = 'none';
        iframe.onload = function () {
            setTimeout(function () {
                iframe.focus();
                iframe.contentWindow.print();
                URL.revokeObjectURL(url)
                // document.body.removeChild(iframe)
            }, 1);
        };
        iframe.src = url;
        // URL.revokeObjectURL(url)
    }