Puppeteer を使用してシングルページアプリケーションから PDF を生成するにはどうすればよいですか?

Puppeteer を使用したシングル ページ アプリケーションからの PDF の生成

シングル ページ アプリケーション (SPA) の構築では、PDF の生成に関して課題が生じます。コンテンツは動的にロードされます。この記事では、PDF をエクスポートする前にページが完全に読み込まれていることを確認する問題について説明します。

アプローチ:

この問題を解決する鍵は、ページが読み込まれるのを待つことにあります。完全にロードします。固定遅延 (例: await page.waitFor(2000);) で推測する代わりに、Puppeteer の page.waitForNavigation() メソッドを利用できます。

実装:

PDF を生成する前にページが読み込まれるのを待つには、次のコードを使用します。

<code class="javascript">await page.waitForNavigation({
  waitUntil: 'networkidle0',
});</code>

これにより、ページの読み込みが完了し、すべてのネットワーク アクティビティが停止するまで実行が一時停止されます。

追加の考慮事項:

• waitForSelector()

  : PDF が生成される前にレンダリングする必要がある特定の要素がある場合は、page の使用を検討してください。 .waitForSelector() で可視性を確保します:

  <code class="javascript">await page.waitForSelector('#example', {
    visible: true,
  });</code>

waitForNetworkIdle() 対 waitForNetworkIdle2()
• : Puppeteer は、waitUntil の 2 つのバリエーション、networkidle0 と networkidle2 を提供します。 networkidle0 はすべてのネットワーク要求が完了するまで待機しますが、networkidle2 はすべてのロード後のタスクが完了するまで待機します。

結論:

page.waitForNavigation() と、オプションで page.waitForSelector() を利用すると、ページが完全に読み込まれたときにのみ PDF が生成され、単一ページ アプリケーションの動的コンテンツを正確にキャプチャできます。

以上がPuppeteer を使用してシングルページアプリケーションから PDF を生成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。