ドキュメントブラウザーと CrawlAgent BrowserCAPTCHA の解決

CAPTCHAの解決

reCaptcha

ScrapelessクローラーブラウザはreCaptchaV2の自動解決を支援するのみであり、その後の操作はご自身で実装する必要があります。

Cloudflare

  • Cloudflare Turnstile
  • Cloudflare Challenge

ScrapelessクローラーブラウザはTurnstileまたはChallengeの自動解決を支援するだけであり、それ以降の操作はご自身で実装する必要があります。Cloudflareチャレンジの処理に関する詳細な実践方法( cf_clearanceの取得を含む)については、以下のリンクを参照してください: https://www.scrapeless.com/en/blog/cloudflare-challenge-bypass

解決例

ブラウザに接続して対象サイトにアクセスすると、ScrapelessがCAPTCHAを自動的に解決します。ただし、CAPTCHAが正常に解決されたことを確認する必要があります。以下は簡単な例です。対象サイトにアクセスし、CAPTCHAが正常に解決されたことを、 Captcha.solveFinished というCDPイベントを監視して確認します。最後に、検証用のページのスクリーンショットを撮影します。

この例では、2つの主要なメソッドを定義しています:

  • addCaptchaListener: ブラウザセッション内でCAPTCHAイベントをリッスンするために使用
  • onCaptchaFinished: CAPTCHAの解決完了を待機するために使用

サポートされているCAPTCHA一覧

  • reCaptcha v2
  • Cloudflare Turnstile
  • Cloudflare 5s Challenge
  • AWS Challenge
import puppeteer from "puppeteer-core";
import EventEmitter from 'events';
const emitter = new EventEmitter()
const scrapelessUrl = 'wss://browser.scrapeless.com/api/v2/browser?token=your_api_key&sessionTTL=180&proxyCountry=ANY';
 
export async function example(url) {
  const browser = await puppeteer.connect({
    browserWSEndpoint: scrapelessUrl,
    defaultViewport: null
  });
  console.log("Verbonden met Scrapeless browser");
  try {
    const page = await browser.newPage();
    // Listen for captcha events
    console.debug("addCaptchaListener: Start listening for captcha events");
    await addCaptchaListener(page);
    console.log("Navigated to URL:", url);
    await page.goto(url, { waitUntil: "domcontentloaded", timeout: 30000 });
    console.log("onCaptchaFinished: Waiting for captcha solving to finish...");
    await onCaptchaFinished()
    // Screenshot for debugging
    console.debug("Taking screenshot of the final page...");
    await page.screenshot({ path: 'screenshot.png', fullPage: true });
  } catch (error) {
    console.error(error);
  } finally {
    await browser.close();
    console.log("Browser closed");
  }
}
 
async function addCaptchaListener(page) {
  const client = await page.createCDPSession();
  client.on("Captcha.detected", (msg) => {
    console.debug("Captcha.detected: ", msg);
  });
  client.on("Captcha.solveFinished", async (msg) => {
    console.debug("Captcha.solveFinished: ", msg);
    emitter.emit("Captcha.solveFinished", msg);
    client.removeAllListeners()
  });
}
 
async function onCaptchaFinished(timeout = 60_000) {
  return Promise.race([
    new Promise((resolve) => {
      emitter.on("Captcha.solveFinished", (msg) => {
        resolve(msg);
      });
    }),
    new Promise((_, reject) => setTimeout(() => reject('Timeout'), timeout))
  ])
}

reCaptchaの例

例コードのメソッドを呼び出して、reCaptchaの自動解決を確認します。

 example('https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox-explicit.php');

Cloudflare Turnstileの例

例コードのメソッドを呼び出して、Cloudflare Turnstileの自動解決を確認します。

 example('https://www.scrapingcourse.com/login/cf-turnstile');

CloudflareTurnstileの正常な解決は、 Captcha.solveFinished CDPイベントをリッスンするだけでなく、 window.turnstile.getResponse()をリッスンすることでも確認できます。以下は完全な例です:

import puppeteer from "puppeteer-core";
const scrapelessUrl = 'wss://browser.scrapeless.com/api/v2/browser?token=your_api_key&sessionTTL=180&proxyCountry=ANY';
 
export async function turnstileExample(url) {
  const browser = await puppeteer.connect({
    browserWSEndpoint: scrapelessUrl,
    defaultViewport: null
  });
  console.log("Verbonden met Scrapeless browser");
  try {
    const page = await browser.newPage();
    console.log("Navigated to URL:", url);
    await page.goto(url, { waitUntil: "domcontentloaded", timeout: 30000 });
    console.log("onCaptchaFinished: Waiting for captcha solving to finish...");
    await waitTurnstile(page)
    // Screenshot for debugging
    console.debug("Taking screenshot of the final page...");
    await page.screenshot({ path: 'screenshot.png', fullPage: true });
  } catch (error) {
    console.error(error);
  } finally {
    await browser.close();
    console.log("Browser closed");
  }
}
 
async function waitTurnstile(page) {
    await page.waitForFunction(() => {
        return window.turnstile && window.turnstile.getResponse();
    });
    const token = await page.evaluate(() => {
        return window.turnstile.getResponse();
    });
    console.log("Cloudflare Turnstile token:", token);
}
 
turnstileExample('https://www.scrapingcourse.com/login/cf-turnstile');

Cloudflare Challengeの例

Cloudflare Challengeは特殊で、場合によってはCloudflare Challengeがトリガーされないことがあります。そのため、CDPイベントをリッスンして解決の成功を確認する方法ではタイムアウトする可能性があります。したがって、解決後にページ上に出現する要素を待つことがより安定した方法です。これは完全な例です:

import puppeteer from "puppeteer-core";
const scrapelessUrl = 'wss://browser.scrapeless.com/api/v2/browser?token=your_api_key&sessionTTL=180&proxyCountry=ANY';
 
export async function challengeExample(url) {
  const browser = await puppeteer.connect({
    browserWSEndpoint: scrapelessUrl,
    defaultViewport: null
  });
  console.log("Verbonden met Scrapeless browser");
  try {
    const page = await browser.newPage();
    console.log("Navigated to URL:", url);
    await page.goto(url, { waitUntil: "domcontentloaded", timeout: 30000 });
    console.log("onCaptchaFinished: Waiting for captcha solving to finish...");
    await waitChallenge(page, 'main.page-content .challenge-info')
    // Screenshot for debugging
    console.debug("Taking screenshot of the final page...");
    await page.screenshot({ path: 'screenshot.png', fullPage: true });
  } catch (error) {
    console.error(error);
  } finally {
    await browser.close();
    console.log("Browser closed");
  }
}
 
async function waitChallenge(page, selector) {
    await page.waitForSelector(selector);
    console.log("Cloudflare Challenge completed");
}
 
challengeExample('https://www.scrapingcourse.com/cloudflare-challenge');