爬虫利器Puppeteer实战

Puppeteer 实战攻略

Puppeteer 是一个 Node.js 库，它提供了一个高级 API，用于控制 headless Chrome 或 Chromium 浏览器。Puppeteer 通过模拟人类的操作来完成自动化任务，因此可以用于构建各种各样的爬虫。

安装 Puppeteer

安装 Puppeteer 十分简单，只需执行以下命令即可：

npm install puppeteer

由于 Puppeteer 是使用 Chromium 浏览器，因此在安装 Puppeteer 时，将同时将最新版本的 Chromium 浏览器下载到您的系统中。

使用 Puppeteer 完成自动化操作

接下来将重点介绍如何使用 Puppeteer 完成自动化操作的流程。

1. 打开浏览器

要使用 Puppeteer，首先必须打开一个浏览器实例。可以像以下方式启动 Chrome 浏览器：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  // 这里开始编写代码，完成爬虫任务
  await browser.close();
})();

2. 访问网页

打开浏览器浏览到网页是爬虫的第一步。要执行此操作，请使用 page.goto() 函数：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.example.com');
  // 这里开始编写代码，完成爬虫任务
  await browser.close();
})();

3. 等待元素加载

在页面加载后，可能需要等待一些元素才能执行下一步操作。正确等待某个元素可见或存在的方法是使用 page.waitForSelector() 函数。

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.example.com');
  // 等待元素加载完成
  await page.waitForSelector('#my-element');
  // 这里开始编写代码，完成爬虫任务
  await browser.close();
})();

4. 提取元素内容

有多种方法可以提取网页中的文本、属性或其他类型的元素。最常用的方法是使用 page.evaluate() 函数。

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.example.com');
  const title = await page.evaluate(() => {
    return document.title;
  });
  console.log(title);
  await browser.close();
})();

5. 执行用户操作

有时需要模拟用户在页面上的交互，例如点击按钮、填写表单、上传文件等。在 Puppeteer 中，这可以通过您通常在浏览器中执行的 JavaScript 代码完成。

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.example.com');
  // 点击第一个链接
  await page.click('a:first-of-type');
  // 填写表单
  await page.type('#my-form input[name="username"]', 'my-username');
  await page.type('#my-form input[name="password"]', 'my-password');
  // 提交表单
  await page.click('#my-form button[type="submit"]');
  await browser.close();
})();

示例1：爬取 Bing 搜索结果

下面是一个使用 Puppeteer 爬取 Bing 搜索结果的示例：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://cn.bing.com/');
  await page.type('#sb_form_q', 'puppeteer');
  await page.click('#sb_form_go');
  await page.waitForSelector('#b_content', { timeout: 10000 });
  const links = await page.evaluate(() => {
    const anchors = Array.from(document.querySelectorAll('#b_results h2 a'));
    return anchors.map(a => a.href);
  });
  console.log(links);
  await browser.close();
})();

示例2：自动化测试

下面是一个使用 Puppeteer 实现自动化测试的示例：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.example.com/');
  await page.waitForSelector('h1');
  const title = await page.evaluate(() => {
    return document.querySelector('h1').textContent.trim();
  });
  if (title === 'Welcome to Example.com') {
    console.log('Test passed');
  } else {
    console.log('Test failed');
  }
  await browser.close();
})();

通过以上示例，您可以了解如何使用 Puppeteer 实现自动化爬虫和测试的过程。对于更加复杂的任务，您可能需要更深入地了解 Puppeteer 的 API 文档和其他知识。