Puppeteer:一个浏览器实例中的多个屏幕截图

时间:2017-08-21 14:07:50

标签: javascript chromium google-chrome-headless puppeteer

因此我希望多次截取特定的class,但始终会说Session ClosedTerminated,因此我开始实施打开多个实例的多个屏幕截图。

有人至少可以指导同一浏览器实例上的多个实例吗?

my code

const puppeteer = require("puppeteer");

const SELECTOR = ".octicon";

(async () => {
  let screenshotNumber = 0;
  async function screenshots() {
    const browser = await puppeteer.launch({
      headless: true
    });

    try {
      let page = await browser.newPage();
      page.setViewport({ width: 1000, height: 600, deviceScaleFactor: 2 });

      await page.goto("https://github.com/");
      await page.waitForNavigation({ waitUntil: "networkidle" });

      const rect = await page.evaluate(selector => {
        const element = document.querySelector(selector);
        const { x, y, width, height } = element.getBoundingClientRect();
        return { left: x, top: y, width, height, id: element.id };
      }, SELECTOR);

      await page.screenshot({
        path: `octicon-${screenshotNumber}.jpg`,
        clip: {
          x: rect.left,
          y: rect.top,
          width: rect.width,
          height: rect.height
        }
      });

      browser.close();
      screenshotNumber++;
    } catch (e) {
      console.log(e);
      browser.close();
    }
  }

  async function run() {
    await screenshots();
    setTimeout(run, 200);
  }

  run();
})();

1 个答案:

答案 0 :(得分:1)

连续运行两个屏幕截图命令而不调用browser.close()可以正常工作:

  await page.screenshot({
    path: `octicon-${screenshotNumber}.jpg`,
    clip: {
      x: rect.left,
      y: rect.top,
      width: rect.width,
      height: rect.height
    }
  });

  screenshotNumber++;

  await page.screenshot({
    path: `octicon-${screenshotNumber}.jpg`,
    clip: {
      x: rect.left,
      y: rect.top,
      width: rect.width,
      height: rect.height
    }
  });

  browser.close();