首页 > 解决方案 > 为什么 puppeteer 截图页面两次然后页面重新加载

问题描述

const puppeteer = require('puppeteer');
const iPhone = puppeteer.devices['iPhone 6'];



(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.emulate(iPhone);

  async function screenshot() {
    const element = await page.$("body")
    await element.screenshot({
      path: `img/${new Date().getTime()}.png`
    });
  }

  // await page.setRequestInterception(true);
  // page.on('request', (request) => {
  //   console.log(request.resourceType())
  //   if (request.resourceType() === 'image') request.abort();
  //   else request.continue();
  // });
  page.on('domcontentloaded', async () => {
    console.log('domcontentloaded')
  })

  page.on('console', msg => {
    for (let i = 0; i < msg.args().length; ++i)
      console.log(`${i}: ${msg.args()[i]}`);
    }
  )

  page.on('dialog', async dialog => {
    console.log(dialog.message(), dialog.type());
    await dialog.accept();
  });

  await page.goto('http://127.0.0.1:5500/test.html', {
    waitUtil: 'networkidle0'
  });
  await screenshot()
  
  // 触发点击在截图
  await page.click('.one', {
    waitUntil: 'domcontentloaded'
  })

  await screenshot()


  // 其他操作...
  await browser.close();
})();

我需要使用 puppeteer 两次截取页面。第一次是进入页面,第二次是触发点击操作。但是,当我第二次这样做时,页面会再次重新加载。

在此处输入图像描述

标签: puppeteer

解决方案


推荐阅读