nodejs通过puppeteer实现多url页面生成截图并拼接为pdf

1、安装所需要的依赖

npm install express puppeteer pdfkit

2、代码实现

const express = require('express')
const router = require('./router.js')
const bodyParser = require('body-parser') // 如果使用post方法的话需要安装body-parser引入，参数从req.body中获取
const app = express()

app.use(bodyParser.json()) 
app.use(router)

app.listen(3000, () => {
    console.log('监听端口：3000')
})

const express = require('express')
const router = express.Router()
const puppeteer = require('puppeteer')
const PDFDocument = require('pdfkit')

router.get('/generate', async (req, res) => { 
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  const width = 1920
  const height = 1080
  // 指定页面大小
  await page.setViewport({ width, height });
  const urls = [ 
    { name: 'example1.png', url: 'https://www.baidu.com/' },
    { name: 'example2.png', url: 'https://www.baidu.com/' }
  ]
  const imgs = []
  for (let i = 0; i < urls.length; i++) {
    const item = urls[i]
    await page.goto(item.url, { waitUntil: 'networkidle0', timeout: 0 });
     // 如果不需要保存图片在硬盘上，则不需要path传参
    const img = await page.screenshot({ path: item.name, fullPage: true });
    imgs.push(img)
  } 
   
  // 创建PDF文档
  const doc = new PDFDocument({
    autoFirstPage: false // 不写这一项会在页面开始生成一个空白页
  });
  
  res.setHeader('Content-Type', 'application/pdf');
  res.setHeader('Content-Disposition', 'attachment; filename="example.pdf"');
 
  doc.pipe(res);
   
  imgs.forEach((img, index) => {
    doc.addPage({
      size: [width, height],
      margin: 200
    });
    // 将图片画到PDF上
    doc.image(img, 0, 0, { width, height });
  }); 
  doc.end();
})
module.exports = router

部署问题

假如是需要部署在centos上，需要安装chromium

yum install -y chromium

安装完成后运行which chromium-browser

然后需要在puppeteer.launch()中配置

const browser = await puppeteer.launch({
      executablePath: '/usr/bin/chromium-browser',
      args: ['--no-sandbox'],
});

不配置 args: [‘–no-sandbox’],的话会报这个错