美文网首页
puppeteer 等页面加载完再截图

puppeteer 等页面加载完再截图

作者: zhumu3 | 来源:发表于2022-02-22 17:27 被阅读0次

目前用puppeteer 搭配node实现给某个网站截图的功能,但是有几率会出现截的图是没有加载后端数据的图片,推测是puppeteer还没加载完接口,就开始截图了,目前在网上搜索到的解决方法总结汇总如下:

1.主要是在page.goto 后面加上一个配置

'waitUntil':'networkidle0'

这个代表的意思是当前页面在500ms内没有http请求存在,再返回
还有一个值是networkidle2,代表的意思是当前页面在500ms内没有2个http请求存在

2.增加await page.content();,这句话的意思是获取当前页面的document数据

代码如下:

    const browser = await puppeteer.launch({
        args: ["--no-sandbox", "--disable-setuid-sandbox"]
    });
    const page = await browser.newPage();
    const response = await page.goto(XXX,{'timeout':1000*30,'waitUntil':'networkidle0'});
    await page.setViewport({
            width: 1920,
            height: 1080
        });
    await autoScroll(page);
    await page.content();
    await page.screenshot({
            path: './paper.jpeg',
            fullPage: true,
            quality:70
        });
    await browser.close();

相关文章

  • puppeteer 等页面加载完再截图

    目前用puppeteer 搭配node实现给某个网站截图的功能,但是有几率会出现截的图是没有加载后端数据的图片,推...

  • 解决页面wx:if页面闪烁

    一开始先隐藏起来,等页面加载完再显示 html

  • 页面图片加载显示完再执行其他js

    页面图片加载显示完再执行其他js

  • 怎么获取页面加载完成的最佳时机?

    Android 开发页面的时候,一般的流程都是先加载页面,等页面加载完成后再执行其他后续操作。而获取页面加载完成的...

  • jquery ready方法

    jquery ready方法 为啥要用ready方法 用于于当文档加载完后再执行js代码,就是为了防止页面未加载完...

  • 1

    1.页面加载完之前执行 2.页面加载后执行 3.页面加载后执行 4.页面加载后执行

  • import和link导入css的区别

    import只能用来加载css,且只有等页面加载完之后才会加载css link 除了加载css外还可以用来定义rs...

  • App页面加载

    1.单页面整体加载 一次性加载完页面的全部内容 2.页面分块加载 优先加载重要内容、分页加载 3.跨页面预加载 帮...

  • puppeteer截图基础

    1.引入 在机器上截图的时候headless设为true const browser = await puppet...

  • puppeteer截图乱码

    最近使用puppeteer来写一个M页的监控工具,部署到linux上运行后发现截图中文乱码了: 搜了一些资料,解决...

网友评论

      本文标题:puppeteer 等页面加载完再截图

      本文链接:https://www.haomeiwen.com/subject/sviglrtx.html