How to convert Html to PDF with Node.js (Guide)-Front-end Q&A-php.cn

How to convert Html to PDF with Node.js (Guide)

PHPz

Release： 2023-04-17 16:04:33

Original

1621 people have browsed it

With the development of the Internet, more and more websites need to provide document downloads in PDF format to facilitate users to read or print offline. Using Node.js to convert HTML to PDF has become a popular solution.

In this article, we will introduce how to use Node.js to convert HTML to PDF, while analyzing related technologies and precautions.

Environment preparation:

Before you start converting HTML to PDF, you need to ensure that Node.js and related dependencies have been installed in the local environment. Dependencies used in this article include: html-pdf, ejs, express, etc.

Install html-pdf

html-pdf is an open source Node.js package that can be installed via npm:

npm install -g html-pdf

Copy after login

Install express

express It is a web application development framework based on Node.js, which can be installed through npm:

npm install -g express

Copy after login

Install ejs

ejs is an efficient JavaScript template engine, which can be installed through npm:

npm install -g ejs

Copy after login

Create a simple Web application:

Next, we create a simple Web application to test the effect of converting our HTML to PDF.

Create a project named node-pdf and execute it in this directory:

npm init

Copy after login

Create a project named public in the node-pdf directory Folder for storing static files.
In the public folder, create a file named index.html to display the HTML content that needs to be converted to PDF. The content is as follows:

<!doctype html>
<html>

<head>
  <title>HTML转PDF</title>
  <meta charset="utf-8">
</head>

<body>
  <h1>HTML转PDF</h1>
  <p>这是一段需要转换为PDF的HTML内容。</p>
</body>

</html>

Copy after login

In the node-pdf directory, create a file named app.js for creating web applications. The content is as follows:

const express = require('express');
const app = express();
const ejs = require('ejs');
const path = require('path');

// 设置模板引擎
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// 服务器首页
app.get('/', function(req, res) {
  res.render('index');
});

// 转换HTML为PDF并进行下载
app.get('/download', function(req, res) {
  const pdf = require('html-pdf');
  const html = ejs.render('<%- include(\&#39;../public/index.html\&#39;) %>', {});
  const options = { format: 'A4' };
  pdf.create(html, options).toStream(function(err, stream) {
    if (err) return res.send(err.message);
    res.setHeader('Content-disposition', 'attachment; filename=sample.pdf');
    res.setHeader('Content-type', 'application/pdf');
    stream.pipe(res);
  });
});

// 启动服务器
app.listen(3000, function() {
  console.log('App listening on port 3000!');
});

Copy after login

In the above code, we define two routes: one for accessing the server homepage (/), and the other for converting HTML to PDF and downloading (/download ).

Among them, the ejs template engine is used to render the index.html file in the public folder, html-pdf is used to convert the rendered HTML file, and finally the browser is used to save the PDF file as a download.

In the node-pdf directory, create a folder named views, and create a file named index.ejs under the folder to set the template file of the web application . The content is as follows:

<!doctype html>
<html>

<head>
  <title>HTML转PDF</title>
  <meta charset="utf-8">
</head>

<body>
  <h1>HTML转PDF</h1>
  <p>这是一段需要转换为PDF的HTML内容。</p>
  <a href="/download">下载PDF</a>
</body>

</html>

Copy after login

Open the command line in the node-pdf directory and execute the following command to start the application:

node app.js

Copy after login

In the browser Visit http://localhost:3000/ to access the server homepage. Click "Download PDF" to convert the HTML file to PDF and download it.

This article is just a simple guide to convert HTML to PDF based on Node.js. For more details and functions, please refer to html-pdf, ejs, express and other related documents. At the same time, in the actual application process, you also need to pay attention to factors such as caching and HTML structure complexity to improve the efficiency and quality of converting HTML to PDF.

The above is the detailed content of How to convert Html to PDF with Node.js (Guide). For more information, please follow other related articles on the PHP Chinese website!