1. IronPDF
  2. IronPDF博客
  3. Node PDF 工具
  4. 使用Javascript打印PDF
PDF 工具

如何在JavaScript中打印PDF文件

发布 2023年五月23日
分享:

1.0 引言

便携式文档格式 (PDF) 由 Adobe 公司开发，用于共享包含文本和图形的文档。要在线打开 PDF 文档，还需要一个额外的程序。在当今社会，PDF 文件对于关键信息非常重要。许多企业使用 PDF 文件创建文档和发票。为满足客户需求，开发人员制作 PDF 文档。有了现代库，创建 PDF 变得前所未有的简单。

要为使用此类库的项目选择理想的库，我们必须权衡一系列因素，包括构建、读取和转换能力。

在本教程中，我们将通过各种 JavaScript 库来制作 PDF。我们将分析 JS 库和实际应用场景，同时关注三个要点：

  • 运行配置

  • 方便打字和自定义字体的模块

  • 易用性

阅读完这些内容后，您就能为自己的 JavaScript 应用程序选择理想的 PDF 库了。最后，我们还将介绍 IronPDF，一个实用、高效的 PDF 库。

如何用 JavaScript 打印 PDF 文件

  1. 在 iframe 标记中嵌入 PDF
  2. 访问 iframe 的 PDF 浏览器自带的打印选项
  3. 使用 JavaScript 打印当前页面的 PDF
  4. 调用 printJS 方法，并将元素 ID 传递给可打印属性
  5. 在 .NET C# 中使用另一个库进行打印，利用 打印 方法

2.0 图书馆

假设我们希望客户能够下载并打印我们的发票副本。我们需要以合适的方式准确打印发票。在此，我们将仔细研究一下可用于将发票从 HTML 文件格式转换为 PDF 格式的众多库中的几个。

2.1 普通 JavaScript 代码

通常，要打印 PDF 文件的内容，我们需要将其下载到电脑上，打开并选择打印选项。另一方面，JavaScript 使直接从网页打印 PDF 文件变得非常简单。您只需要在网站上建立一个 iframe，或者能够动态建立一个 iframe，然后添加文档并打印。下面我将演示如何使用 JavaScript 打印 PDF 文件。使用 iframe 可以显示另一个网页中的网页。要显示网页，iframe 必须知道其来源。

<html>
<head>
    <title>javascript print pdf</title>
</head>
<body>
    <iframe 
        src="Demo.pdf" id="myFrame" 
            frameborder="0" style="border:0;" 
                width="300" height="300">
    </iframe>
    <p>
        <input type="button" id="bt" onclick="print()" value="Print PDF" />
    </p>
</body>

<script>
    let print = () => {
        let objFra = document.getElementById('myFrame');
        objFra.contentWindow.focus();
        objFra.contentWindow.print();
    }
</script>
</html>
<html>
<head>
    <title>javascript print pdf</title>
</head>
<body>
    <iframe 
        src="Demo.pdf" id="myFrame" 
            frameborder="0" style="border:0;" 
                width="300" height="300">
    </iframe>
    <p>
        <input type="button" id="bt" onclick="print()" value="Print PDF" />
    </p>
</body>

<script>
    let print = () => {
        let objFra = document.getElementById('myFrame');
        objFra.contentWindow.focus();
        objFra.contentWindow.print();
    }
</script>
</html>
HTML

至于打印 PDF，可以使用 iframe 显示文档内容，然后使用 JavaScript 打印内容。这两种情况都需要 iframe。在上面的示例中，有一个 iframe，其源代码为 (PDF).还有一个按钮型输入元素。

按钮的 onclick 属性将调用 print 方法。

如何用 JavaScript 打印 PDF 文件：图 1 - 打印

2.2 Print.js

创建 Print.js 的主要目的是让我们能够在应用程序中打印 PDF 文件，而无需跳转、从用户界面导入并打印或使用嵌入。这适用于用户只需打印 PDF 文件而无需打开或下载的特殊情况。

例如，当用户要求打印在服务器端生成的报告时，这就很有帮助。这些报告将以 PDF 文档的形式返回给您。这些文件无需打开即可打印。在我们的应用程序中，Print.js 提供了打印这些文件的便捷方法。

<html>
    <head>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js"></script>
        <script src="https://printjs-4de6.kxcdn.com/print.min.js"></script>
        <link href="https://printjs-4de6.kxcdn.com/print.min.css" rel="stylesheet">   
    </head>
    <body>
        <div id="print-area" class="print-main">
            <table>
                <tr>
                    <th>Name</th>
                    <th>Age</th>
                </tr>
                <tr>
                    <td>AAA</td>
                    <td>25</td>
                </tr>
                <tr>
                    <td>BBB</td>
                    <td>24</td>
                </tr>
            </table>
        </div>
        <button id="btnPrint">Print</button>
        <script>
                $(document).ready(function(){
                    $("#btnPrint").on("click",function(){
                        printJS({
                            printable: 'print-area',
                            type: 'html'});
                    })
                })
        </script>
    </body>
</html>
<html>
    <head>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js"></script>
        <script src="https://printjs-4de6.kxcdn.com/print.min.js"></script>
        <link href="https://printjs-4de6.kxcdn.com/print.min.css" rel="stylesheet">   
    </head>
    <body>
        <div id="print-area" class="print-main">
            <table>
                <tr>
                    <th>Name</th>
                    <th>Age</th>
                </tr>
                <tr>
                    <td>AAA</td>
                    <td>25</td>
                </tr>
                <tr>
                    <td>BBB</td>
                    <td>24</td>
                </tr>
            </table>
        </div>
        <button id="btnPrint">Print</button>
        <script>
                $(document).ready(function(){
                    $("#btnPrint").on("click",function(){
                        printJS({
                            printable: 'print-area',
                            type: 'html'});
                    })
                })
        </script>
    </body>
</html>
HTML

上述代码可用于直接从网站打印 PDF 文件。它显示，打印时将打印 ID 为 "print-area "的 HTML 元素内的所有 HTML 字符串。

如何用 JavaScript 打印 PDF 文件：图 2 - 打印这些字符串

2.3 IronPDF - Node.js PDF 库

IronPDF 是一个全面的 Node.js PDF 库，在准确性、易用性和速度方面都非常出色。它提供了大量功能，可直接从 React 中的 HTML、URL 和图像生成、编辑和格式化 PDF。IronPDF 支持各种平台，包括 Windows、MacOS、Linux、Docker 以及 Azure 和 AWS 等云平台，确保了跨平台兼容性。其用户友好的 API 使开发人员能够快速将 PDF 生成和操作集成到他们的 Node.js 项目中。

IronPDF for Node.js 的主要功能：

  • 多功能 PDF 生成：使用 IronPDF，开发人员可以从各种来源生成 PDF，包括 HTML、CSS、JavaScript、图像和其他文件类型。这种灵活性使其能够根据特定要求创建动态的、具有视觉吸引力的 PDF 文档。
  • 高级文档定制：IronPDF 允许开发人员使用页眉、页脚、附件、数字签名、水印和书签等功能来增强 PDF 文档。这样就可以创建具有丰富内容和互动元素的专业级 PDF。
  • 安全功能：IronPDF 提供了强大的安全功能，以保护 PDF 免受未经授权的访问。开发人员可以实施密码、数字签名、元数据和其他安全设置等安全措施，以保护 PDF 文档中包含的敏感信息。

  • 优化的性能：IronPDF 专为优化性能而设计，具有完整的多线程和异步支持功能。这确保了高效的 PDF 生成，使其适用于对性能要求极高的关键任务应用程序。

  • 全面的功能集：IronPDF 拥有 50 多种用于创建、格式化和编辑 PDF 文档的功能，可为所有 PDF 相关任务提供全面的解决方案。从基本的文档生成到高级定制和安全，IronPDF 提供了广泛的功能以满足开发人员的需求。

下面是一个从以下文件生成并保存 PDF 文档的示例 HTML 文件、HTML 字符串和 网址 以保留打印格式：

import {PdfDocument} from "@ironsoftware/ironpdf";

(async () => {
    const pdfFromUrl = await PdfDocument.fromUrl("https://getbootstrap.com/");
    await pdfFromUrl.saveAs("website.pdf");

    const pdfFromHtmlFile = await PdfDocument.fromHtml("design.html");
    await pdfFromHtmlFile.saveAs("markup.pdf");

    const pdfFromHtmlString = await PdfDocument.fromHtml("<p>Hello World</p>");
    await pdfFromHtmlString.saveAs("markup_with_assets.pdf");
})();
JAVASCRIPT

有关 PDF 相关任务的更多代码示例，请访问此处 代码示例 page.

如何在 JavaScript 中打印 PDF 文件：图 3 - IronPDF

3.0 结论

用户可以看到上面的 JavaScript 代码，但它可能被其他人滥用。以这种方式使用源代码是可能的。此外，在网站上添加危及通过网站发送的数据安全的代码也并非难事。上述 JavaScript 库在不同浏览器中的显示方式不同。因此，代码在发布前必须在各种系统中运行。由于旧版浏览器不支持某些新功能，因此我们还需要考虑这些浏览器的兼容性。上述库可以生成 PDF 文件。用户还必须对所使用的脚本有一定的了解。

有了 IronPDF 对 JavaScript 框架和库的直接集成过程，出色的 文献资料 在 Node.js 相关应用程序中生成和打印专业级 PDF 的首选。

IronPDF 提供 免费试用因此，在做出明智决定之前，您可以测试其全部功能。它还可用于其他语言，如 C# .NET, Java 和 Python.访问 IronPDF 网站了解更多详情。从以下地址下载 IronPDF for Node.js 这里.

< 前一页
如何使用JavaScript生成PDF文件
下一步 >
如何在React中将HTML转换为PDF（开发者教程）

使用 npm 安装

版本： 2024.9

> npm i @ironsoftware/ironpdf

报告问题

准备开始了吗？ 版本： 2024.9 刚刚发布

免费 npm 安装 查看许可证 >

获取您的免费

30天试用密钥 立即。

15天试用密钥 立即。

bullet_checked无需信用卡或创建账户
试用表格已提交
成功地。

您的试用密钥应在电子邮件中。
如果不是，请联系
support@ironsoftware.com

子弹测试测试生产环境
无水印
子弹日历30天全功能使用
功能性产品
子弹支持24/5技术支持
试用期间的支持

谢谢！

您的许可证密钥已发送到所提供的电子邮件。联系我们

24小时升级优惠：

Save 50% 在一个
专业 升级

去 专业 支持10位开发者
和无限项目。

小时

:

分钟

:

秒

升级到Professional

升级

专业

$600 美元

$299 美元

  • 10位开发者
  • 10个位置
  • 10个项目
今天 只有

5个.NET产品，两件的价格

IronPDF IronOCR IronXL IronBarcode IronWebscraper

套件总价值：

$7,192 美元

升级价格

今天
只有

$499 美元

24小时后

$1,098 美元