如何使用 Puppeteer 抓取 React 網站？

Question

我正在嘗試抓取一個使用 react 的網站，在 chrome 中我可以訪問我想要的元素，但是當我嘗試使用 puppeteer 時，我無法訪問相同的元素，因為源代碼沒有加載這些 react 元素, 有什么辦法可以訪問它。

這是代碼

const request= require('request-promise')
const cheerio= require('cheerio');
const puppeteer = require("puppeteer");

const Url='https://angel.co/companies';


(async ()=>{

    const browser = await puppeteer.launch({headless: false});
    const page = await browser.newPage();

    await page.goto(Url);
      const html = await page.content();
    // const response=request.get(Url)
    const $ = await cheerio.load(html);




    // const companies=$('div.base.startup').html()
     const companies=await $('div.base.startup > div.company.column > div > div.text > div.pitch').text()
    // const companies=document.querySelectorAll('div.base.startup > div.company.column > div > div.text > div.pitch')

    console.log(companies)
    await browser.close()

} )()

Answer 1

幾個月前我用 Python 做了一些類似的事情。 基本上是等待一個元素出現在頁面上（作為指示器，React 完成加載）。

我查找了 Puppeteer 的 API 並找到了page.waitForSelector ，我猜你可以使用它。