Puppeteer抓取页面时无法获取.Apps下strong标签文本问题求助

导致抓取结果为空的核心问题有3个，按优先级排查：

• 1. DOM遍历逻辑语法错误
     page.evaluate中的Array.from写法完全错误：Array.from的第二个参数是单元素遍历回调，会逐个接收类数组里的每一项作为入参，你当前的写法是给回调传入单个DOM节点后，尝试对节点调用.map()方法，会直接在页面上下文抛出JS异常，最终返回无效值，写入文件自然为空。
• 2. 目标访问地址无效
     你填写的跳转地址https://.herokuapp.com/域名以.开头，属于非法URL，根本无法访问到你部署的React应用，页面加载的是默认错误页，不存在你要查询的节点。
• 3. 未等待客户端渲染完成
     React是客户端渲染框架，page.goto默认仅等待页面load事件触发，此时React组件可能还未完成挂载，目标节点还没生成到DOM树中，查询结果为空。
• 额外校验点：类名大小写匹配
  HTML中class属性大小写敏感，你代码中React组件写的className="Apps"为大写A开头，需确认部署后实际渲染的DOM类名无拼写、大小写错误。

const puppeteer = require("puppeteer")
const fs = require("fs/promises")

async function start() {
  const browser = await puppeteer.launch()
  const page = await browser.newPage()
  // 替换为你实际部署的heroku应用地址，删除域名前多余的点
  await page.goto("https://你的应用名.herokuapp.com/", {
    // 等待网络空闲，确保React静态资源加载完成
    waitUntil: "networkidle2"
  })
  // 显式等待目标节点渲染到DOM，避免渲染延迟导致查询为空
  await page.waitForSelector(".Apps strong")

  const names = await page.evaluate(() => {
    // 修正Array.from写法，直接遍历每个匹配节点取文本
    return Array.from(document.querySelectorAll(".Apps strong"), el => el.textContent.trim())
  })
  await fs.writeFile("names.txt", names.join("\r\n"))

  await browser.close()
}

start()

如果修改后仍不符合预期，可以在查询节点前加一行全页截图代码，直观确认页面实际加载状态：

await page.screenshot({path: 'debug.png', fullPage: true})

打开截图就能快速定位是页面加载错误、节点未渲染还是选择器书写错误。调试阶段也可以给puppeteer.launch传入{headless: false}配置，拉起可见浏览器窗口手动查看页面状态。

内容的提问来源于stack exchange，提问作者Ali