javascript - Puppeteer:向下滚动 Twitter 时间轴停止

Question

我在使用 puppeteer 抓取用户时间轴上的所有推文 URL 时遇到问题。

使用 puppeteer，脚本应该在 scrollToEnd 函数中 while 循环的每次迭代中向下滚动时间线，直到到达底部。为了监视进度，我让脚本输出 previousHeight 变量的值，该值是每次执行滚动之前评估的 document.body 的当前 scrollheight。

但是，一旦输出值变为 285,834，滚动就会停止。令人费解的是，该脚本既没有跳出 while 循环，也没有 page.waitForFunction 方法抛出超时错误。

我应该如何重写 scrollToEnd 函数或脚本的任何其他部分，以便函数正确结束？

这是我的代码片段。为了简洁起见，省略了不相关的功能。

const puppeteer = require('puppeteer');

var UserUrls = ['https://twitter.com/someuser'];

// more functions here

async function scrollToEnd(
    page,
    ScrollDelay = 1000
) {
    try {
        let previousHeight = 0;
        let notEnd = await page.waitForFunction(`document.body.scrollHeight > ${previousHeight}`);
        while (notEnd) {
            previousHeight = await page.evaluate('document.body.scrollHeight');
            await page.evaluate('window.scrollBy(0, document.body.scrollHeight)');
            await page.waitFor(ScrollDelay);

            notEnd = await page.waitForFunction(`document.body.scrollHeight > ${previousHeight}`);
            console.log(previousHeight)
        };
        return;
    } catch (e) {
        return;
    };
};

(async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    var tweetUrls = [];
    for (let UserUrl of UserUrls) {
        await page.goto(UserUrl);
        await page.evaluate((async () => {
            await scrollToEnd(page);
        })());
        await page.screenshot({ path: 'PageEnd.png' });
        tweetUrls = await getTweetUrls(page, extractItems, 100);
    };
    await browser.close();
    console.log(tweetUrls);
})();

Answer 1

您可以尝试这两种方法之一吗？该脚本尝试通过比较滚动高度(如您所做的那样)或等待标记流结束的元素可见来滚动到底部。所有滚动逻辑都放置在浏览器上下文中评估的函数内。这两个函数都会返回整个页面中的推文计数，以将结果与时间线顶部声明的用户推文计数进行比较。另外，我已将第一种方法的延迟更改为 3 秒，因为有时 1 秒对于更改滚动高度来说似乎太小了。

'use strict';

const puppeteer = require('puppeteer');

(async function main() {
  try {
    const browser = await puppeteer.launch({ headless: false });
    const [page] = await browser.pages();

    await page.goto('https://twitter.com/GHchangelog');
    const data1 = await page.evaluate(scrollToBottomByMaxHeight);
    console.log(`Tweets: ${data1}`);

    await page.goto('https://twitter.com/GHchangelog');
    const data2 = await page.evaluate(scrollToBottomByEndElement);
    console.log(`Tweets: ${data2}`);

    // await browser.close();
  } catch (err) {
    console.error(err);
  }
})();

async function scrollToBottomByMaxHeight() {
  try {
    let previousHeight = 0;
    let currentHeight = document.scrollingElement.scrollHeight;

    while (previousHeight < currentHeight) {
      previousHeight = document.scrollingElement.scrollHeight;
      window.scrollBy(0, previousHeight);
      await new Promise((resolve) => { setTimeout(resolve, 3000); });
      currentHeight = document.scrollingElement.scrollHeight;
    }

    return document.querySelectorAll('a.js-permalink').length;
  } catch (err) {
    return err;
  }
}

async function scrollToBottomByEndElement() {
  try {
    const endElement = document.querySelector('div.stream-end');

    while (endElement.clientHeight === 0) {
      window.scrollBy(0, document.scrollingElement.scrollHeight);
      await new Promise((resolve) => { setTimeout(resolve, 1000); });
    }

    return document.querySelectorAll('a.js-permalink').length;
  } catch (err) {
    return err;
  }
}