Axios-Cheerio如何等待，直到所有信息都从服务器加载

Question

我在尝试使用axios从url获取img时遇到问题。问题是axios在所有数据加载到页面之前就返回了内容。我已经在使用async/awaitsintax，但我不知道如何让请求等待所有数据加载。例如，使用cheerio来尝试获得img，由于这个概念，结果是undefined。

这是我关于获取网址的代码：

async function getUrl(url){
const request =   await axios.get(url);
const html    =   request.data;
const $       =   cheerio.load(html);
return $;
}

是否有方法检查是否加载了所有数据？

我正在抓取以获取主img的页面如下：https://www.saatchiart.com/art/Painting-Goat/313699/2073158/view

感谢

Answer 1

当您访问网页时，会收到一个纯文本HTML文档。该HTML文档通常具有指向脚本、图像、CSS等资源的链接，以及可能的内联JavaScript。浏览器解析该页面，执行JS并请求资源。这个过程需要一些时间。

Axios没有等待这些东西的概念——它只是一个HTTP请求库，所以它会向服务器请求静态HTML文本(或其他资源(，但与浏览器不同的是，它不会解析和呈现HTML或执行JS。它只会向您提供与在浏览器中使用view-source:时相同的纯文本HTML。

Cheerio也没有对JS做任何事情。它接受一个HTML字符串，并允许您遍历和操作它！

尽管如此，事实证明你想要的图像是在静态HTML:中

const axios = require("axios"); // ^1.2.2
const cheerio = require("cheerio"); // 1.0.0-rc.12
const url = "<your URL>";
axios.get(url).then(({data: html}) => {
const $ = cheerio.load(html);
console.log($('meta[property="og:image"]').attr("content"));
});

但有时不是，所以你可能想访问如何使用node.js抓取包含动态内容的页面？用于一般策略，例如使用Puppeter来自动化浏览器。