木偶等待页面完全加载 [英] Puppeteer wait until page is completely loaded

问题描述

我正在通过网页创建PDF.

I am working on creating PDF from web page.

我正在处理的应用程序是单页应用程序.

The application on which I am working is single page application.

我在 https://github.com/GoogleChrome/puppeteer/issues上尝试了许多选项和建议/1412

但是它不起作用

    const browser = await puppeteer.launch({
    executablePath: 'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe',
    ignoreHTTPSErrors: true,
    headless: true,
    devtools: false,
    args: ['--no-sandbox', '--disable-setuid-sandbox']
});

const page = await browser.newPage();

await page.goto(fullUrl, {
    waitUntil: 'networkidle2'
});

await page.type('#username', 'scott');
await page.type('#password', 'tiger');

await page.click('#Login_Button');
await page.waitFor(2000);

await page.pdf({
    path: outputFileName,
    displayHeaderFooter: true,
    headerTemplate: '',
    footerTemplate: '',
    printBackground: true,
    format: 'A4'
});

我想要的是在页面完全加载后立即生成PDF报告.

What I want is to generate PDF report as soon as Page is loaded completely.

我不想写任何类型的延迟，即await page.waitFor(2000);

I don't want to write any type of delays i.e. await page.waitFor(2000);

我无法执行waitForSelector，因为该页面具有在计算后呈现的图表.

I can not do waitForSelector because the page has charts and graphs which are rendered after calculations.

我们将不胜感激.

推荐答案

您可以使用 page.waitForNavigation() 在生成PDF之前等待新页面完全加载:

You can use page.waitForNavigation() to wait for the new page to load completely before generating a PDF:

await page.goto(fullUrl, {
  waitUntil: 'networkidle0',
});

await page.type('#username', 'scott');
await page.type('#password', 'tiger');

await page.click('#Login_Button');

await page.waitForNavigation({
  waitUntil: 'networkidle0',
});

await page.pdf({
  path: outputFileName,
  displayHeaderFooter: true,
  headerTemplate: '',
  footerTemplate: '',
  printBackground: true,
  format: 'A4',
});

如果您希望将某些动态生成的元素包含在PDF中，请考虑使用

If there is a certain element that is generated dynamically that you would like included in your PDF, consider using page.waitForSelector() to ensure that the content is visible:

await page.waitForSelector('#example', {
  visible: true,
});

这篇关于木偶等待页面完全加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！