ウェブサイトからスクリーンショットを生成する方法

原作者：browserless

オリジナルソース：https://www.youtube.com/embed/BpbYQxWIyhw

単一の POST-to-PNG フロー用の /screenshot REST API と、完全なプログラムによる制御用の Browsers as a Service の Puppeteer という 2 つのブラウザレス メソッドを使用して、コードで Web サイトのスクリーンショットを撮る方法を学びます。このビデオでは、それぞれのデモを説明し、いつどれを選択するかを示します。学習内容: 1) なぜ最新の Web サイトで page.screenshot が空白の画像を返すのか 2) /screenshot を使用して 1 回の API 呼び出しでページ全体のスクリーンショットを撮る方法 3) URL を使用せずに HTML を直接スクリーンショットにレンダリングする方法 4) Puppeteer をブラウザレス BaaS に接続し、page.screenshot を呼び出す方法 5) CSS セレクターを使用してページ上の 1 つの要素をキャプチャする方法 6) REST Screenshot API と Puppeteer をいつ使用するかスクリーンショットのワークフロー 章: 00:00 ブラウザレスで Web サイトのスクリーンショットを撮る方法 (2 つの方法) 01:12 最新のサイトで page.screenshot が空白の画像を返す理由 02:08 ブラウザレス /screenshot API を使用してスクリーンショットを撮る 03:33 スクリーンショットを撮って画像をクリップする 03:50 生の HTML からスクリーンショットを撮る 04:20 BaaS を使用して Puppeteer と page.screenshot でスクリーンショットを撮る05:27 アクションを実行してスクリーンショットを取得する 05:52 Puppeteer で特定の要素のスクリーンショットを作成する 06:05 スクリーンショット API と Puppeteer を使用する場合 07:13 スクリーンショット API と Puppeteer の要約 リンク: - スクリーンショット API ドキュメント: https://docs.browserless.io/rest-apis/screenshot-api - Browsers as a Service クイックスタート: https://docs.browserless.io/baas/start - 無料プランのサインアップ: https://www.browserless.io/signup/email?plan=free - PDF とスクリーンショットの生成に関するブログ: https://www.browserless.io/blog/how-browserless-makes-pdf-generation-and-screenshots-simple-with-api-endpoints - スクリーンショット ボットがブロックされていますか?: https://docs.browserless.io/rest-apis/unblock - Puppeteer と Playwright の WaitUntil オプション https://www.browserless.io/blog/waituntil-option-for-puppeteer-and-playwright - スクレイピング サンプル サイト: https://scraping-sandbox.netlify.app/products ビデオで使用されているツール: Puppeteer、Node.js、cURL、Browserlessスクリーンショット REST API #Puppeteer #スクリーンショット #API #WebAutomation #ブラウザレス