用 Node.js + Puppeteer 轻松保存网页为图像和 PDF

2023-11-07 03:38:46

随着 Web 技术的飞速发展，将网页内容转换为图像或 PDF 格式的需求日益增长。最近，由 Google 维护的 Puppeteer 异军突起，为我们提供了这样一个强大的工具，可以轻松实现此目标。

Puppeteer 简介

Puppeteer 是一个基于 Chrome 的无头浏览器库，它允许我们通过 Node.js 控制和自动化 Chrome 浏览器。它提供了一系列 API，使我们能够执行广泛的操作，包括导航、页面交互、元素选择以及屏幕截图。

安装 Puppeteer

在使用 Puppeteer 之前，我们需要先安装它。我们可以通过以下命令使用 npm 进行安装：

npm install puppeteer

将网页保存为图像

要将网页保存为图像，我们可以使用 Puppeteer 的 screenshot() 方法。此方法接受一个可选的 options 对象，我们可以通过该对象指定图像格式、尺寸和其他选项。

例如，以下代码将当前网页保存为 PNG 图像：

const puppeteer = require('puppeteer');

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

将网页保存为 PDF

要将网页保存为 PDF，我们可以使用 Puppeteer 的 pdf() 方法。此方法也接受一个可选的 options 对象，我们可以通过该对象指定 PDF 的页面大小、方向和页边距等选项。

例如，以下代码将当前网页保存为 A4 大小的 PDF，页边距为 1 厘米：

const puppeteer = require('puppeteer');

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