node.js - 使用 puppeteer 生成包含多个页面的 PDF

Question

我创建了一个 React 应用程序和 nodejs 服务器。我的 puppeteer 师有一个大问题。我想创建一个包含多个页面的 PDF。但是当呈现 PDF 时，我只有一页，而不是所有内容。

我正在使用 puppeteer v-4.0.0

有人可以帮我吗？谢谢

Answer 1

你隐藏了这个例子的代码，因此我不能 100% 知道发生了什么。

有两种方法可以做到这一点。您可以将 Web 应用程序的所有内容添加到一个页面中，或者让 Puppeteer 循环浏览一系列页面。创建多个页面的想法与 CSS 分页媒体有关。换句话说，如果一个网站已经为一个给定的文档打印了多个页面，Puppeteer 就会跟进并做同样的事情。

简而言之，当您以用户身份在 Chrome 中简单地执行此操作时，您就知道您的打印件何时准备就绪:

window

Control + P > 点击打印按钮

苹果

Command + P > 点击打印按钮

所见即所得。

然而，如果您的代码指示 headless 浏览器表现为屏幕，例如await page.emulateMediaType('screen'); 在某些情况下，您最终会得到一大块 PDF，类似于用户尝试使用 Chrome 打印该页面时所做的事情。

如果您要打印文档之类的东西，也许修改打印页面的概念是个不错的主意。例如，打印页面将知道如何收集所有文档并将其全部打包成一种格式，然后可以在以后打印。这会生成一个 PDF 文件，然后您可以从客户端完全控制。

但有时，这种捆绑可能过于繁琐或不理想，然后您将不得不像这样遍历页面:

const pages = [
   'relative-path-1',
   'relative-path-2',
   'relative-path-3'
];

let index = 0;

for (let link of pages){
  index++;
  await page.goto('the website address' + link);
  await page.pdf({
    path: 'Page-' + index + '.pdf'
  });
}