Cheerio，axios，reactjs 到 web 从返回空列表的网页上刮下一张桌子答案

【问题标题】：Cheerio, axios, reactjs to web scrape a table off a webpage returning empty listCheerio，axios，reactjs 到 web 从返回空列表的网页上刮下一张桌子
【发布时间】：2020-07-14 23:25:59
【问题描述】：

试图从这个网站上刮掉这张桌子：https://www.investing.com/commodities/real-time-futures

但由于某种原因，当我尝试获取数据时，我总是得到一个空列表。

这是我正在做的获取数据并解析它：

componentDidMount() {
    axios.get(`https://www.investing.com/commodities/real-time-futures`)
      .then(response => {
        if(response.status === 200)
          {
            const html = response.data;
            const $ = cheerio.load(html);
            let data = [];
            $('#cross_rate_1 tr').each((i, elem) => {
                data.push({
                  Month: $(elem).find('td#left noWrap').text()
                })
            });
            console.log(data);
          }
        }, (error) => console.log('err') );
  }

这是我试图抓取的源代码特定部分的屏幕截图。

非常感谢任何帮助。

【问题讨论】：

你把它弄空的原因是因为他们通过 WebSocket 连接更新列表，如果你打开你的 devtools > network > WS 你会看到那里的连接。 ??????
它在网页上是空的，我只在我的本地主机 WS 中看到一个 sockjs.node 文件
我提到的WebSocket连接在https://www.investing.com/commodities/real-time-futures，而不是在你的本地网站。
哦，我现在看到了，是不是不能抓取数据？因为在控制台中执行此操作允许我获取所有值 document.querySelectorAll("#cross_rate_1 td")].forEach(td => console.log(td.innerText))
没错，您可以从investing.com 的控制台获取数据，但是当您从本地网站获取数据时，它没有数据，所以它只会得到空的html.

标签： javascript reactjs web-scraping axios cheerio

【解决方案1】：

如前所述，有问题的表通过 websocket 连接不断更新。您可以尝试通过 1) 连接到 websocket 或 2) 抓取动态生成的 html 来获取数据。

仅针对数据快照而非连续时间序列，您可以使用浏览器抓取扩展程序。这样你就不会关心 websocket 的实现了。

我已经为您确定了价格数据 CSS 选择器并创建了一个抓取配置以与开源浏览器扩展 https://github.com/get-set-fetch/extension 一起使用。

“eLtI4gnapZTLDsIgEEV / hejGLrC + F25N3OrCpUlD6FhIWmiY0f6 + 1Hd9EJsuSEguGRg4h8fSlS0Km / r3ZesjHR0g2zrtKzL2IYg1wOqLZ2hEicrSwxhFVOIyjquqGmpzAiRtsqG0RSxv5TVg7EDkvC7AD9etmqJlQBz9ONRW8HvgJ06UwD2HpCV / gtpFylFnC39A / s51A3qphMlg94ruBbtNCe5iMr5 / EP / S3ICZf4H5myP / 0tv3rSIm / oiQjBmlS0OKS6XzdDCJ9iYQT8PxLBzPw / Ei6rWwpZ0dZ2cMF5M =” P>

在扩展里面做：新项目>配置哈希>粘贴上面的哈希（不带引号）>保存，刮，查看结果>导出为csv。

免责声明：我是扩展作者。

【讨论】：