puppeteer生成pdf与截图，简单便捷又靠谱

2023-10-27 01:42:38

之前写过一篇 vue cli2 使用 wkhtmltopdf 踩坑指南，由于wkhtmltopdf对vue的支持并不友好，而且不支持css3，经过调研最终选择puppeteer，坑少，比较靠谱。

一、puppeteer安装

npm install puppeteer --save

二、puppeteer生成pdf

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  const pdfBuffer = await page.pdf({
    format: 'A4',
    margin: {
      top: '1cm',
      right: '1cm',
      bottom: '1cm',
      left: '1cm'
    }
  });
  await browser.close();

  // 将pdfBuffer保存到本地
  fs.writeFileSync('example.pdf', pdfBuffer);
})();

三、puppeteer生成截图

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  const screenshotBuffer = await page.screenshot({
    fullPage: true
  });
  await browser.close();

  // 将screenshotBuffer保存到本地
  fs.writeFileSync('example.png', screenshotBuffer);
})();