使用 Puppeteer 进行网页抓取：检测网站变化并截图

Emma Foster

Machine Learning Engineer

07-Oct-2024

网页抓取已成为自动化数据收集和监控网站变化的必备工具。在这篇博文中，我们将探索如何使用 Puppeteer，一个 Node.js 库，来进行网页抓取、检测网站变化以及截取这些变化的屏幕截图。

什么是 Puppeteer？

Puppeteer 是一个 Node.js 库，它提供了一个高级 API 来通过 DevTools 协议控制无头 Chrome 或 Chromium。它可以用于网页抓取、自动化测试，甚至生成网页的屏幕截图和 PDF。

先决条件

在开始之前，请确保您已安装以下内容：

Node.js
NPM（与 Node.js 捆绑在一起）

您可以在终端中运行以下命令来安装 Puppeteer：

bash 复制代码

npm install puppeteer

使用 Puppeteer 进行基本网页抓取

首先，让我们创建一个基本的网页抓取程序，它会导航到网站并提取文本内容。

javascript 复制代码

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();

    // 导航到网站
    await page.goto('https://example.com');

    // 提取文本内容
    const content = await page.evaluate(() => {
        return document.querySelector('h1').innerText;
    });

    console.log('页面内容：', content);

    await browser.close();
})();

此脚本会打开一个无头浏览器，导航到 example.com，并从 <h1> 元素中提取文本。您可以将 URL 替换为您要抓取的网站，并将选择器调整为与您感兴趣的元素相匹配。

使用 Puppeteer 截取屏幕截图

Puppeteer 允许您轻松地截取网页的屏幕截图。您可以捕获全页屏幕截图或页面的特定区域。

以下是如何截取全页屏幕截图：

javascript 复制代码

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();

    // 导航到网站
    await page.goto('https://example.com');

    // 截取全页屏幕截图
    await page.screenshot({ path: 'screenshot.png', fullPage: true });

    await browser.close();
})();

此脚本会将整个页面的屏幕截图保存为 screenshot.png。您可以修改 path 以指定不同的文件名或位置。

检测网站变化

监控网站的变化是网页抓取中的一项有用功能。您可以通过反复检查网站的内容并将它与之前保存的版本进行比较来实现这一点。

以下是如何检测文本变化并在内容发生变化时截取屏幕截图的示例：

javascript 复制代码

const puppeteer = require('puppeteer');
const fs = require('fs');

(async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();

    // 导航到网站
    await page.goto('https://example.com');

    // 提取文本内容
    const currentContent = await page.evaluate(() => {
        return document.querySelector('h1').innerText;
    });

    const previousContentPath = 'previous-content.txt';
    let previousContent = '';

    // 检查之前的内容是否存在
    if (fs.existsSync(previousContentPath)) {
        previousContent = fs.readFileSync(previousContentPath, 'utf8');
    }

    // 将当前内容与之前的内容进行比较
    if (currentContent !== previousContent) {
        console.log('内容已更改！');

        // 保存新内容
        fs.writeFileSync(previousContentPath, currentContent);

        // 截取更改的屏幕截图
        await page.screenshot({ path: `screenshot-${Date.now()}.png`, fullPage: true });
        console.log('屏幕截图已保存！');
    } else {
        console.log('未检测到更改。');
    }

    await browser.close();
})();

在这个例子中：

该脚本会提取 <h1> 元素的内容。
它将当前内容与之前保存的版本 (previous-content.txt) 进行比较。
如果检测到更改，它将截取屏幕截图并将其保存到带有时间戳的文件名中，确保每个屏幕截图都是唯一的。
新内容将保存到 previous-content.txt 中以供将来比较。

定期安排抓取程序运行

您可以使用 Node.js 来安排此脚本使用 node-cron 包按间隔运行。

首先，安装 node-cron：

bash 复制代码

npm install node-cron

现在，修改您的脚本以便按设定的间隔（例如，每 5 分钟）运行：

javascript 复制代码

const puppeteer = require('puppeteer');
const fs = require('fs');
const cron = require('node-cron');

cron.schedule('*/5 * * * *', async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();

    await page.goto('https://example.com');

    const currentContent = await page.evaluate(() => {
        return document.querySelector('h1').innerText;
    });

    const previousContentPath = 'previous-content.txt';
    let previousContent = '';

    if (fs.existsSync(previousContentPath)) {
        previousContent = fs.readFileSync(previousContentPath, 'utf8');
    }

    if (currentContent !== previousContent) {
        console.log('内容已更改！');
        fs.writeFileSync(previousContentPath, currentContent);
        await page.screenshot({ path: `screenshot-${Date.now()}.png`, fullPage: true });
        console.log('屏幕截图已保存！');
    } else {
        console.log('未检测到更改。');
    }

    await browser.close();
});

此脚本将每 5 分钟 (*/5 * * * *) 运行一次，并检查网站是否存在更改。如果检测到更改，它将截取屏幕截图并记录更新。

附加代码

在 CapSolver 获取顶级验证码解决方案的奖励代码：scrape。兑换后，您每次充值后都会获得额外 5% 的奖励，无限次。

结论

Puppeteer 是一个用于网页抓取和自动化浏览器任务的强大工具。在这篇文章中，我们演示了如何使用 Puppeteer 进行基本的网页抓取、检测网站变化以及捕获这些变化的屏幕截图。使用这些技术，您可以自动监控网站并跟踪更新。请务必检查网站抓取政策，避免违反服务条款。

复制代码

合规声明：本博客提供的信息仅供参考。CapSolver 致力于遵守所有适用的法律和法规。严禁以非法、欺诈或滥用活动使用 CapSolver 网络，任何此类行为将受到调查。我们的验证码解决方案在确保 100% 合规的同时，帮助解决公共数据爬取过程中的验证码难题。我们鼓励负责任地使用我们的服务。如需更多信息，请访问我们的服务条款和隐私政策。