抓取：仅抓取第一张图像，其余部分用占位符填充。为什么？

Question

我正在使用 JavaScript 和无头浏览器 Puppeteer 抓取工作网站。

我成功地从求职网站抓取了前 6 个公司徽标项。然而，在这前 6 个徽标之后，它会突然停止打印出真正的徽标（因此，向我提供 src URL），而是输入一个占位符图像。

这可能是什么原因？

仅供参考，我正在抓取这样的图像：

const image = card.querySelector('div.job-element__logo img').src

Answer 1

正在延迟加载图像。

正确的 src of the images that have not been loaded yet are stored in a data attribute called data-src. You can use page.evaluate() in conjunction with Array.from() to filter and scrape all of the correct image src 值：

const images = await page.evaluate(() => {
  return Array.from(document.querySelectorAll('.job-element__logo img'), e => e.dataset.src ? `https://www.stepstone.de${e.dataset.src}` : e.src);
});

如果您想抓取每个职位的职位、公司、描述和图像，可以使用以下解决方案：

const jobs = await page.evaluate(() => {
  return Array.from(document.querySelectorAll('.job-element'), card => {
    const position = card.querySelector('.job-element__body__title').textContent.trim();
    const company = card.querySelector('.job-element__body__company').textContent.trim();
    const description = card.querySelector('.job-element__body__details').textContent.trim();
    const image_element = card.querySelector('.job-element__logo img');
    const image = image_element.dataset.src ? `https://www.stepstone.de${image_element.dataset.src}` : image_element.src;

    return {
      position,
      company,
      description,
      image,
    };
  });
});

抓取：仅抓取第一张图像，其余部分用占位符填充。为什么？

Scraping: Only first images are scraped, rest is filled with placeholder. Why?

javascript

screen-scraping

node.js

web-scraping

puppeteer