尝试使用 puppeteer 抓取网站并取回空对象

Question

今天开始学习puppeteer，遇到了一个问题。 我试图创建一个 covid 跟踪器，我想从 worldometers 中抓取。 但是当我试图取回信息时，它返回一个包含空对象的数组。 对象数量与具有相同 class 的标签数量相匹配，但不显示任何信息。 这是我的代码

const puppeteer = require("puppeteer")
async function getCovidCases(){
    const browser = await puppeteer.launch({
        defaultViewport: null,
        headless: false,
        slowMo: 250
    })
    const page = await browser.newPage()
    const url = "https://www.worldometers.info/coronavirus/#countries"
    await page.goto(url, {waitUntil: 'networkidle0'})
    await page.waitForSelector(".navbar-nav", {visible: true})
    const results = await page.$$eval(".navbar-nav", rows => {
        return rows
    })
    await console.log(results)
}
getCovidCases()

有谁知道该怎么做？

Answer 1

基于选择器，我假设您在此步骤中对导航栏项目感兴趣。

    const results = await page.$$eval(".navbar-nav", navBars => {
      return navBars.map(navBar => {
        const anchors = Array.from(navBar.getElementsByTagName('a'));
        return anchors.map(anchor => anchor.innerText);
      });
    })

这会产生[ [ 'Coronavirus', 'Population' ] ]并且可能对您有用。

如果您只需要一个元素，请使用$eval ；如果您需要多个元素，请使用$$eval 。 在回调中，您有对该 dom 元素的引用，但您不能直接返回它。 如果你console.log任何它不会显示在 nodejs 终端，但在浏览器终端。 你返回的内容将被发送回 nodejs，它需要是可序列化的（我认为）。 您从navBar返回的内容将转换为空的 object 而不是您想要的。 这就是为什么我对它进行 map 并将其转换为字符串 ( innerText )。

如果你想抓取其他数据，你应该使用另一个选择器（ .nav-bar ）。