javascript - 如何使用 puppeteer(Node.js 应用程序)抓取 instagram 帖子 URL

Question

随着对当前 Instagram API 的所有更改，我试图构建一个抓取工具。环顾四周后，我发现了 puppeteer。虽然这看起来很简单，但我遇到了一个我似乎无法解决的问题。

问题如下:我知道帖子的 div 标签是什么 (.v1Nh3.kIKUG._bz0w) 以及如何调用它 (elements = await page.$$('.v1Nh3.kIKUG._bz0w ');)

如果我正确理解 $ 函数，这应该会返回一个包含“页面”上所有帖子的数组的 promise 。

我的第一个问题是这个假设是否正确，第二个问题是如何从中取出数组。 (如果一切正常，如何获取子 href 中包含的重定向 URL)

Answer 1

首先要注意的是:由于 Instagram 是一个重 javascript 驱动的 React 应用程序，您所选择的选择器在页面加载后可能无法立即使用。所以我们应该等待它们出现在 DOM 中:

await page.waitForSelector('.v1Nh3.kIKUG._bz0w');

现在使用 page.evaluate 我们得到了帖子，但是由于您只想要这些帖子中的链接，所以让我们在查询中立即获取它们:

const result = await page.evaluate(() => {
    // Get elements into a NodeList
    const elements = document.querySelectorAll('.v1Nh3.kIKUG._bz0w a');
    ...
}

但是我们不能将元素从 Nodelist 转换为 Array 并直接返回它们，因为它们仍然是 DOM Node ，复杂的不可序列化对象，它们需要是 serializable能够从 page.evaluate 返回。因此，我们不会返回完整的 Node ，而只会得到我们需要的:来自 href 属性的 urls:

const result = await page.evaluate(() => {
    // Get elements into a NodeList
    const elements = document.querySelectorAll('.v1Nh3.kIKUG._bz0w a');

    // Convert elements to an array, 
    // then for each item of that array only return the href attribute
    const linksArr = Array.from(elements).map(link => link.href);

    return linksArr;
});

其他方法

在您的问题中，您提到了 page.$$ 方法。它确实适用于获取我们寻找的对象的句柄。但是迭代它们的代码并不漂亮:

const results = await page.$$('.v1Nh3.kIKUG._bz0w a')
for (const i in results)
{
   console.log(await(await(await results[i]).getProperty("href")).jsonValue());
}

我最喜欢的获取这些链接的方法是使用 page.$$eval 方法:

const results = await page.$$eval('.v1Nh3.kIKUG._bz0w a', links => links.map(link => link.href))

它与我们在 page.evaluate 解决方案中所做的完全相同，但方式更加简洁。