独书先生 Menu

如何在 Puppeteer 中使用 2captcha-solver 插件

背景

在之前的文章中,小编给大家介绍了一款好用的验证码服务 2Captcha,并且撰写了一篇干货教程和一篇测评。对 2Captcha 不了解的朋友,可以先阅读这两篇文章。

干货:Nodejs Playwright 2Captcha 验证码识别实现自动登陆

测评:验证码服务 2Captcha 测评 2022 | 原理 用途 入门

2Captcha 官网

在本文中,我们将介绍如何将 2captcha-solver 插件与 Puppeteer 结合使用。

Puppeteer 是一个 Nodejs 库,可让您启动浏览器并在其中执行各种操作,这里 描述了使用示例。Puppeteer 非常适合各种自动化、编写解析器和其他需要在浏览器中实现自动化的任务。 Puppeteer 的优势在于其简单性和在headless模式下工作的能力。 Puppeteer 有现成的解决方案,可让您隐藏自动化的事实。在开发解析器时隐藏自动化的事实很重要,因为这将使浏览器看起来更像一个人而不被暴露。

在这里,我们将使用 Puppeteerpuppeteer-extrapuppeteer-extra-plugin-stealth 来完成我们的自动化任务。 其中,puppeteer-extraPuppeteer 的轻量级包装器,puppeteer-extra-plugin-stealth 是对 puppeteer-extra 的补充,旨在隐藏自动化的痕迹。

在下面的分步描述中,我们将在 https://cn.2captcha.com/demo/recaptcha-v2 页面上描述如何自动处理验证码。

原文 如何在 Puppeteer 中使用 2captcha-solver 插件

解决步骤

1. 安装组件

安装 Puppeteer 和其他所需的软件包:

npm i puppeteer puppeteer-extra puppeteer-extra-plugin-stealth

2. 设置插件

下载带有插件的archive,解压到项目根目录下的"/2captcha-solver"文件夹。

该插件有很多设置,包括自动解决指定类型的验证码,支持proxy等设置。这些设置在文件 /common/config.js 中可用。要为自动 reCAPTCHA V2 解决方案添加设置,您需要打开文件 /common/config.js 并将 autoSolveRecaptchaV2 字段的值更改为 true

接下来,您需要配置插件:

  1. 在插件设置文件 ./common/config.js 中输入您的 API 密钥。您的密钥必须写入 apiKey 字段的值。您可以在 2Captcha 设置页面 上查看并复制您的 API 密钥。
    示例:apiKey: "8080629c1221fdd82m8080000ff0c99c"

  2. 设置安装后禁止打开扩展设置页面,在文件 ./manifest.json 中删除以下行:

    "options_ui": {
        "page": "options/options.html",
        "open_in_tab": true
    },
    

3. 浏览器自动化

在 Puppeteer 中启动和初始化插件:

const puppeteer = require('puppeteer-extra');
const StealthPlugin = require('puppeteer-extra-plugin-stealth');

(async () => {
  const pathToExtension = require('path').join(__dirname, '2captcha-solver');
  puppeteer.use(StealthPlugin())
  const browser = await puppeteer.launch({
    headless: false,
    args: [
      `--disable-extensions-except=${pathToExtension}`,
      `--load-extension=${pathToExtension}`,
    ],
  });

  const [page] = await browser.pages()
})();

3.1 打开页面

打开页面 https://cn.2captcha.com/demo/recaptcha-v2, 并发送验证码。

使用 page.goto() 我们转到页面 https://cn.2captcha.com/demo/recaptcha-v2。 接下来,您需要发送验证码以获得解决方案,这可以手动或自动完成。

在我们的示例中,我们将手动发送验证码,为此我们等到带有 CSS 选择器 .captcha-solver 的插件按钮可用,然后单击此按钮。单击按钮后,验证码将转到服务寻求解决方案。

// 打开一个页面
await page.goto('https://cn.2captcha.com/demo/recaptcha-v2')

// 等待带有 CSS 选择器“.captcha-solver”的元素可用
await page.waitForSelector('.captcha-solver')

// 点击指定选择器的元素
await page.click('.captcha-solver')

3.2 检查验证码状态

在收到服务的响应后,插件按钮 .captcha-solver 将更改数据属性 data-state 的值。通过观察这个 data-state 属性的值,你可以监控插件的状态。解决验证码后,该属性的值将变为 "solved"

2Captcha 解决中
2Captcha 解决中

2Captcha 已解决
2Captcha 已解决

data-state 属性的值说明:

属性 说明
data-state="ready" 插件已准备好解决验证码。要发送验证码,您需要单击按钮。
data-state="solving" 正在解决验证码。
data-state="solved" 验证码已成功破解
data-state="error" 接收响应或验证码时出错未成功解决。

这一步需要等到验证码被破解,之后属性值会变为"solved",这表示验证码破解成功。在此步骤之后,您可以执行必要的操作。

// 默认情况下,waitForSelector 等待 30 秒,但是这个时间通常是不够的,所以我们用第二个参数手动指定超时值。超时值以“ms”为单位指定。
await page.waitForSelector(`.captcha-solver[data-state="solved"]`, {timeout: 180000})

4. 做动作

解决验证码后,我们就可以开始在页面上进行必要的操作了。在我们的示例中,我们将单击“检查”按钮来检查接收到的验证码解决方案的正确性。检查成功后,您会看到“验证码通过成功!”的信息。

// 点击“检查”按钮,检查验证码是否成功解决。
await page.click("button[type='submit']")

恭喜,验证码成功通过! 该示例的完整源代码在这里:openHacking/2captcha

当然,如果是直接拉取我的源代码来运行,步骤会更简单。

# 拉取代码
git clone https://github.com/openHacking/2captcha
cd 2captcha
# 安装依赖
npm i
# 添加API KEY
# 直接运行
node index.js

有用的信息

  • 插件有很多设置,例如自动解决指定类型的验证码或支持proxy,所有这些设置都可以在文件/common/config.js中找到,在解压插件的文件夹中。要自动发送 reCAPTCHA V2,请在文件 /common/config.js 中将 autoSolveRecaptchaV2 字段的值更改为 true

  • 您可以使用 sandbox 模式进行测试。在沙盒模式下,发送的验证码将发送给您。了解更多关于 sandbox 你可以阅读 这里

  • headless 模式下运行的 Puppeteer 不支持加载插件,您可以使用 xvfb 来解决此问题。

参考