将 html-pdf 与动态数据一起使用答案

【问题标题】：Using html-pdf with dynamic data将 html-pdf 与动态数据一起使用
【发布时间】：2017-02-15 00:24:50
【问题描述】：

目前我正在测试html-pdf 模块以从 html 生成 pdf。我已经成功生成了一个。但问题是html中的文本/数据目前是固定的。

我要做的是在前端有一个用户填写的 html 表单，然后生成一个包含用户输入内容的 pdf。

到目前为止我做了什么：

app.post('/pdf',function(req, res) {

  pdf.create(html, options).toFile('./businesscard.pdf', function(err, res) {
   if (err) return console.log(err);
     console.log(res);
   });

});

这可以使用 html-pdf 吗？任何帮助将不胜感激。

【问题讨论】：

为什么点击保存时不生成pdf？
@CodingDefined 是的，我可以这样做，但我仍然如何将用户数据传递给pdf.create，该html 文件作为参数转换为pdf。你明白我的意思吗？
为什么不在用户点击保存时截取网页截图。看看codingdefined.com/2016/01/…

标签： javascript html node.js fs

【解决方案1】：

很遗憾，html-pdf 模块无法处理动态数据。您可以查看屏幕截图的phantomjs。

事实上，html-pdf 模块在后台使用“phantomjs”。但是，它使用了phantomjs的小特性。

【讨论】：

【解决方案2】：

您可以查看dynamic-html-pdf

只需按照以下步骤操作：

使用此命令安装npm install dynamic-html-pdf --save
创建html模板

使用以下代码创建 pdf：

var fs = require('fs');
var pdf = require('dynamic-html-pdf');

var html = fs.readFileSync('template.html', 'utf8');

pdf.registerHelper('ifCond', function (v1, v2, options) {
if (v1 === v2) {
    return options.fn(this);
 }
 return options.inverse(this);
})

var options = {
 format: "A3",
 orientation: "portrait",
 border: "10mm"
};
 //Your dynamic data 
var users = [
 {
    name: 'aaa',
    age: 24,
    dob: '1/1/1991'
 },
 {
    name: 'bbb',
    age: 25,
    dob: '1/1/1995'
 },
 {
    name: 'ccc',
    age: 24,
    dob: '1/1/1994'
 }
];

var document = {
 type: 'buffer',     // 'file' or 'buffer'
 template: html,
 context: {
    users: users
 },
path: "./output.pdf"    // it is not required if type is buffer
};
 pdf.create(document, options)
 .then(res => {
    console.log(res)
 })
.catch(error => {
    console.error(error)
});

【讨论】：

【解决方案3】：

我正在寻找相同的解决方案并解决了一个问题。

https://medium.com/free-code-camp/how-to-generate-dynamic-pdfs-using-react-and-nodejs-eac9e9cb4dde

您可以在博客中查看这项工作。他只是调用了一个返回 HTML 字符串的函数，并使用反引号表示动态数据。

【讨论】：