如何使用cheerio抓取动态网站?

问题描述

首先,请理解使用翻译器可能导致语法不正确。

我将使用cheerio在React环境中进行网页抓取。

网站的一部分(例如):

<ul>
  <li>
    <div class="name">burger</div>
    <div class="price">5,500</div>
  </li>
  <li>
    <div class="name">sandwich</div>
    <div class="price">3,500</div>
  </li>
  <li>
    <div class="name">ramyeon</div>
    <div class="price">1,500</div>
  </li>
</ul>

我的代码(仅供参考,此代码在抓取其他网站时效果很好):

const cheerio = require("cheerio");
let prodData = [];

useEffect(() => {
    scraping();
},[]);

const scraping = () => { 

     axios.get("/product/thisIsExample")
        .then(res => {
            if (res.status === 200) {
                const html = res.data;
                const $ = cheerio.load(html);
                const children = [...$("ul").children("li")];
                children.forEach(v => {
                    prodData.push({
                        prodName: $(v).find("div.name").text(),prodPrice: $(v).find("div.price").text()
                    });

                });
                
                if(prodData.length !== 0) {
                    console.log(prodData);
                }
            }
        },(err) => console.log("error"));

}

问题是我试图抓取的部分 (

  • ) 是动态的,因此只有在数据调用完成后才会生成

    我的意思是,我试图将

    • 抓取到一个数组中,但是当我抓取它时,
        中没有
      • 我该怎么做才能刮

  • 解决方法

    动态页面在加载后很好地创建可见内容 - 从服务器读取 html 将为您提供一些基本结构和脚本标签,但不是由该页面中的脚本生成并最终由用户可见的内容。

    要抓取动态网页,您需要像 selenium 和自动化真实浏览器之类的东西。