个性化阅读
专注于IT技术分析

如何在Node.js中使用wkhtmltopdf创建PDF

点击下载

本文概述

你是否曾经尝试使用PDFKit创建带有复杂图表的PDF?这样的****任务不是吗?我们知道用于node.js的出色PDFKIT, PDFKit是用于Node和浏览器的PDF文档生成库, 可轻松创建复杂的多页可打印文档。以下代码应生成带有一些文本的简单PDF文档:

var PDFDocument, doc;

var fs = require("fs");

PDFDocument = require('pdfkit');

doc = new PDFDocument;

doc.pipe(fs.createWriteStream('output.pdf'));

doc.fontSize(25).text('Some text with an embedded font!', 100, 100);

doc.addPage().fontSize(25).text('Here is some vector graphics...', 100, 100);

doc.save().moveTo(100, 150).lineTo(100, 250).lineTo(200, 250).fill("#FF3300");

doc.scale(0.6).translate(470, -380).path('M 250, 75 L 323, 301 131, 161 369, 161 177, 301 z').fill('red', 'even-odd').restore();

doc.addPage().fillColor("blue").text('Here is a link!', 100, 100).underline(100, 100, 160, 27, {
  color: "#0000FF"
}).link(100, 100, 160, 27, 'http://google.com/');

doc.end();

好了, 那应该在执行脚本的路径中创建output.pdf文件。功能性的, 但是, 我不想使用该代码绘制复杂的图表, 不。

服务器端生成图表的一种替代方法是使用Javascript(客户端)生成图表。有许多Javascript库可以创建精美的图表, 你可以检索其SVG(或base64图像)并将其返回到服务器, 以将它们作为图像包含在PDF中。听起来不错且功能强大, 但是此解决方案有一个缺点。 SVG会更改, 并会根据用户显示器的分辨率或浏览器窗口的尺寸, 在稍后的PDF中引起尺寸问题。

作为解决方案, 某些Web应用程序将生成html视图作为对浏览器的响应(它将呈现你的花式图表), 并且用户将需要使用(并知道如何)浏览器将内容保存(或打印)为PDF 。但是, 作为用户, 你可能只想单击一个按钮即可下载PDF, 选择保存位置, 仅此而已。

到处都是问题, 但这正是wkhtmltopdf派上用场的地方, 因为你将能够以与在网站中一样的方式编写css, html和javascript(显然有一些最小的限制), 并且PDF看起来很棒。

在本文中, 你将学习如何在Node.js项目中使用wkhtmltopdf创建PDF。

要求

你需要wkhtmltopdf在系统中可用并且在命令提示符下可访问。 wkhtmltopdf是一个命令行工具, 可使用Qt WebKit渲染引擎将HTML渲染为PDF和各种图像格式。它们完全”无头运行”, 不需要显示或显示服务。

  • Windows:你可以在安装区域中下载每种体系结构(x86和x64)的安装程序。尽管稍后你可以在config.yml文件中更改wkhtmltopdf可执行文件的路径, 但是建议将wkhtmltopdf用作系统上的环境变量(如果你不想为wkhtmltopdf创建环境变量, 则可以提供可执行文件的完整路径)。你可以在本文中阅读如何在Windows中创建环境变量。
  • Debian / Ubuntu:你可以使用以下命令直接在控制台中从wkhtmltopdf安装发行版:
sudo apt-get install wkhtmltopdf

确定你的系统上已安装wkhtmltopdf后, 请继续在Node.js中使用

实现

要从Node.js处理wkhtmltopdf, 我们需要依赖第三方模块。 wkhtmltopdf模块为wkhtmltopdf提供了有用的命令行指令包装, 以从Node.js生成PDF, 要安装此模块, 请在终端中执行以下命令:

npm install wkhtmltopdf

安装后, 你将可以使用require(‘wkhtmltopdf’)要求wkhtmltopdf模块。

完成安装后, 请确保wkhtmltopdf命令行工具位于PATH中。如果由于某种原因不想执行此操作, 可以将require(‘wkhtmltopdf’)。command属性更改为wkhtmltopdf命令行工具的路径:

var wkhtmltopdf = require('wkhtmltopdf');
// If you don't have wkhtmltopdf in the PATH, then provide
// the path to the executable (in this case for windows would be):
wkhtmltopdf.command = "C:\\Program Files\\wkhtmltopdf\\bin\\wkhtmltopdf.exe";

然后, 你将可以在Node.js中使用wkhtmltopdf正常工作。

从网站创建PDF

提供一个Web URL(带有协议http或https)作为第一个参数, 以将网站呈现为PDF并提供输出路径:

var wkhtmltopdf = require('wkhtmltopdf');

wkhtmltopdf('http://ourcodeworld.com', { 
    output: 'ourcodeworld.pdf', pageSize: 'letter'
});

从html文件创建PDF

要根据html文件的内容创建PDF, 请使用filesystem.readFileSync方法提供从文件中检索的HTML代码:

var wkhtmltopdf = require('wkhtmltopdf');
var fs = require("fs");

wkhtmltopdf(fs.readFileSync("index.html", "utf8"), {
    output: 'demo.pdf', pageSize: 'letter'
});

在此示例中, 该html文件将为index.html, 并且具有以下内容:

<!DOCTYPE>
<html>
    <head>
        <meta charset="UTF-8" />
    </head>
    <body>
        <h1>Hello World !</h1>
        <p>This is my awesome first PDF generated using WKHTMLTOPDF with Node.js</p>
        <p>UTF-8 Test : κσμε</p>
        <p>Image : </p><br>
        <img height="200" src="http://ourcodeworld.com/resources/img/ocw-empty.png"/>
        <p>SVG Example : </p><br>
        <div>
            <!-- Do not forget to give width and height to your svg 
                use PLAIN SVG directly (<svg>content</svg>)
                Tiger SVG EXAMPLE : https://upload.wikimedia.org/wikipedia/commons/f/fd/Ghostscript_Tiger.svg
            -->
            <img src="https://upload.wikimedia.org/wikipedia/commons/f/fd/Ghostscript_Tiger.svg" width="144" height="144"/>
        </div>
        <p>Canvas Example with Javascript: </p><br>
        <div>
            <canvas id="myCanvas" width="300" height="200"/>
        </div>
        <hr>
        <span id="dinamic-content"></span>
        <script>
            document.getElementById("dinamic-content").innerHTML = 'This string has been appended using javascript';
            
            // Draw circle on canvas
            var c = document.getElementById("myCanvas");
            var ctx = c.getContext("2d");
            ctx.beginPath();
            ctx.arc(100, 75, 50, 0, 2*Math.PI);
            ctx.stroke();
        </script>
    </body>
</html>

节点代码的执行应生成一个demo.pdf文件, 它将类似于:

Node.js wkhtmltopdf pdf示例

从html字符串创建PDF

与从HTML文件渲染PDF的方式相同, 只需提供HTML字符串作为第一个参数即可:

var wkhtmltopdf = require('wkhtmltopdf');
var htmlContent = "<h1>Test</h1><p>Hello world</p>";

wkhtmltopdf(htmlContent, {
    output: 'demo.pdf', pageSize: 'letter'
});

注意:如果要返回PDF文件作为响应, 因为你将Node.js与HTTP服务器一起使用, 则可以简单地创建该文件并作为响应返回该文件。

最后的笔记

  • node.js wkhtmltopdf允许你以与命令行相同的方式添加选项, 而你需要在第二个参数的对象中将它们作为属性提供(–page-size =” letter”是等效的在Javascript中为pageSize:”字母”)。在此处阅读wkhtmltopdf的所有可用选项。
  • 在此处阅读有关Node.js的wkhtmltopdf模块的更多信息。
  • 在此处了解有关wkhtmltopdf库的更多信息。

编码愉快!

赞(0)
未经允许不得转载:srcmini » 如何在Node.js中使用wkhtmltopdf创建PDF

评论 抢沙发

评论前必须登录!