
Sora Fujimoto
AI Solutions Architect
BrowserCloudは、スケーラブルで分散されたWeb自動化のために設計された、高性能なクラウドベースのブラウザ自動化プラットフォームです。開発者は、Webスクレイピング、自動テスト、SEOモニタリング、データ抽出、コンテンツ生成などのユースケースのために、数百ものヘッドレスChromeブラウザを並列で実行できます。Puppeteer、Selenium、Playwrightを組み込みでサポートしているBrowserCloudは、プロキシローテーション、セッション管理、リアルタイムモニタリングを提供することで、複雑な自動化ワークフローを簡素化します。
しかし、CAPTCHA、ボット検出システム、高度な反自動化対策は、認証を検証するために人間らしいインタラクションを要求することで、これらのブラウザ自動化タスクを妨害することがよくあります。このような障壁は、スクレイピングスクリプトをブロックし、テストパイプラインを遅らせ、自動フォーム送信を中断し、時間の無駄と効率の低下につながります。
CapSolverは、AIを搭載したCAPTCHA解決およびボット検出バイパスサービスであり、信頼できるソリューションを提供します。reCAPTCHA v2/v3、Cloudflare Turnstile、画像ベースのパズルなど、幅広いCAPTCHAの種類をプログラムで検出して解決し、ブラウザ自動化ワークフローの中断を防ぎます。
この記事では、Puppeteerを使用してCapSolverとBrowserCloudを接続するためのステップバイステップの統合ガイドと、完全に動作するコード例を紹介します。このガイドに従うことで、CAPTCHAの課題をシームレスに回避し、反ボット対策を無効にし、自動化スクリプトの効率を最大限に高めることができます。
BrowserCloudは、高性能なインフラストラクチャ上でフル機能のChromeブラウザのグリッドを管理する多用途プラットフォームであり、ローカルブラウザの依存関係、メモリリーク、インフラストラクチャのメンテナンスを処理する必要がなくなります。主な機能は以下のとおりです。
BrowserCloudは、以下を含むさまざまな自動化タスクをサポートします。
これらのユースケースでは、多くの場合CAPTCHAが発生するため、中断のない自動化にはCapSolverの統合が不可欠です。
Webサイトは、自動アクセス、スパム、悪意のあるアクティビティから保護するために、CAPTCHAと反ボット対策を展開しており、Webスクレイピングなどの自動化タスクにとって大きな課題となっています。CAPTCHAは、チェックボックスをクリックしたり、画像パズルを解いたりするようなインタラクションを必要とし、対処されない場合、BrowserCloudスクリプトを停止する可能性があります。一般的なCAPTCHAの種類は以下のとおりです。
| CAPTCHAの種類 | 説明 |
|---|---|
| reCAPTCHA v2 | ユーザーは、ボックスにチェックを入れるか、プロンプトに基づいて画像を選択する必要があります。 |
| reCAPTCHA v3 | ユーザーの行動を評価するスコアリングシステムを使用し、多くの場合ユーザーには見えません。 |
| Cloudflare Turnstile | ユーザーインタラクションを最小限に抑えたプライバシー重視のCAPTCHA代替手段です。 |
Webスクレイピングやその他の自動化タスクでは、CAPTCHAによって重要なデータへのアクセスが妨げられる可能性があり、自動化の目的を無効にする手動による介入が必要になります。BrowserCloudのプロキシローテーションはCAPTCHAのトリガーを減らすのに役立ちますが、完全に排除できるわけではありません。CapSolverのAPIは、CAPTCHAをプログラムで解決することで信頼できるソリューションを提供し、BrowserCloudスクリプトがこれらの障壁をバイパスして、データの抽出やタスクの実行をシームレスに継続できるようにします。
CapSolverのAPIは、Puppeteer/Playwright/Seleniumスクリプト内でBrowserCloudと統合して、CAPTCHAを効果的に処理できます。このプロセスには、次の手順が含まれます。
この統合は、BrowserCloudのスケーラブルなブラウザインフラストラクチャとCapSolverのAI駆動のCAPTCHA解決機能を活用して、堅牢な自動化ワークフローを実現します。
以下は、デモページでreCAPTCHA v2を解決するためにCapSolverとBrowserCloudを統合する方法を示す完全なコード例です。このコードは、提供されたスクリプトに基づいており、明確さと信頼性のためにわずかな改善が加えられています。
必要な依存関係をインストールします。
npm install puppeteer node-fetch@2 dotenv
APIキーを含む.envファイルを作成します。
BROWSER_CLOUD_TOKEN=your_browsercloud_token
CAPSOLVER_API_KEY=your_capsolver_api_key
import puppeteer from 'puppeteer';
import fetch from 'node-fetch';
import dotenv from 'dotenv';
dotenv.config();
const BROWSER_CLOUD_TOKEN = process.env.BROWSER_CLOUD_TOKEN;
const CAPSOLVER_API_KEY = process.env.CAPSOLVER_API_KEY;
async function solveCaptcha(sitekey, pageUrl) {
const createTaskRes = await fetch('https://api.capsolver.com/createTask', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
clientKey: CAPSOLVER_API_KEY,
task: {
type: 'ReCaptchaV2TaskProxyless',
websiteURL: pageUrl,
websiteKey: sitekey
}
})
});
const createTask = await createTaskRes.json();
if (!createTask.taskId) throw new Error(`CapSolver: Failed to create task: ${JSON.stringify(createTask)}`);
let solution = null;
while (true) {
await new Promise(resolve => setTimeout(resolve, 2000));
const resultRes = await fetch('https://api.capsolver.com/getTaskResult', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
clientKey: CAPSOLVER_API_KEY,
taskId: createTask.taskId
})
});
const result = await resultRes.json();
if (result.status === 'ready') {
solution = result.solution.gRecaptchaResponse;
break;
}
if (result.status === 'failed') throw new Error(`CapSolver: Failed to solve: ${JSON.stringify(result)}`);
}
if (!solution) throw new Error('CapSolver: Timeout waiting for solution');
return solution;
}
(async () => {
try {
const browser = await puppeteer.connect({
browserWSEndpoint: `wss://chrome-v2.browsercloud.io?token=${BROWSER_CLOUD_TOKEN}`
});
const page = await browser.newPage();
await page.goto('https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox.php', { waitUntil: 'networkidle2' });
const sitekey = await page.$eval('.g-recaptcha', el => el.getAttribute('data-sitekey'));
console.log('Sitekey:', sitekey);
const solution = await solveCaptcha(sitekey, page.url());
console.log('CAPTCHA solution:', solution);
await page.evaluate(token => {
const textarea = document.getElementById('g-recaptcha-response');
if (textarea) {
textarea.value = token;
textarea.innerHTML = token;
textarea.style.display = '';
textarea.dispatchEvent(new Event('input', { bubbles: true }));
}
}, solution);
const submitBtn = await page.$('body > main > form > fieldset > button');
if (submitBtn) {
await Promise.all([
page.waitForNavigation({ waitUntil: 'networkidle2' }),
submitBtn.click()
]);
console.log('Submit button clicked!');
} else {
console.log('Submit button not found!');
}
console.log('Page content after submission:', await page.content());
await browser.close();
} catch (error) {
console.error('Error:', error);
}
})();
| ステップ | 説明 |
|---|---|
| 1. 環境設定 | npmを使用してpuppeteer、node-fetch@2、dotenvをインストールします。BrowserCloudとCapSolverのAPIキーを含む.envファイルを作成します。 |
| 2. solveCaptcha関数の定義 | この関数は、サイトキーとページURLを受け取り、reCAPTCHA v2のCapSolverタスクを作成し、ソリューションをポーリングし(2秒間隔で最大30回)、ソリューショントークンを返します。 |
| 3. BrowserCloudへの接続 | APIトークンを含むBrowserCloud WebSocketエンドポイントを使用して、puppeteer.connectを使用します。BrowserCloudのリモートモードではcreateIncognitoBrowserContextはサポートされていないため、browser.newPage()を直接使用します。 |
| 4. ターゲットページへの移動 | 新しいページを開き、reCAPTCHA v2を含むデモページに移動し、ネットワークがアイドル状態になるのを待ちます。 |
| 5. サイトキーの抽出 | page.$evalを使用して、.g-recaptcha要素からdata-sitekey属性を取得します。 |
| 6. CAPTCHAの解決 | サイトキーとページURLを使用してsolveCaptchaを呼び出し、CapSolverからソリューショントークンを取得します。 |
| 7. ソリューションの挿入 | g-recaptcha-responseテキストエリアにソリューショントークンを挿入し、入力イベントをディスパッチしてユーザーインタラクションをシミュレートします。 |
| 8. フォームの送信 | 送信ボタンを探し、クリックして、フォーム送信が処理されるようにナビゲーションを待ちます。 |
| 9. 結果の検証 | ページの内容を出力して、送信が成功したことを確認します。 |
| 10. ブラウザの終了 | リソースを解放するために、ブラウザ接続を閉じます。 |
注記: 元のコードでは、送信ボタンをクリックした後にpage.waitForTimeout(3000)を使用していましたが、ナビゲーションを確実に待つとは限りません。この例では、送信後にページが完全に読み込まれるようにpage.waitForNavigation()を使用して改善されています。
このセクションでは、reCAPTCHA v2チェックボックスを含むデモページでのスクリプトの実行について説明します。
g-recaptcha-responseテキストエリアに挿入され、CAPTCHAの検証が成功したことをシミュレートします。実際には、ブラウザがデモページに移動し、reCAPTCHAチェックボックスが自動的にマークされ、フォームが正常に送信されるのを観察できます。すべて手動による介入なしで行われます。
| 質問 | 回答 |
|---|---|
| CapSolverはどのようなタイプのCAPTCHAをサポートしていますか? | CapSolverは、reCAPTCHA v2/v3、Cloudflare Turnstileなどをサポートしています。詳細はCapSolverのドキュメントを参照してください。 |
| BrowserCloudとCapSolverのAPIキーはどこで入手できますか? | BrowserCloudとCapSolverに登録して、登録後にAPIキーを取得します。 |
| この統合をSeleniumまたはPlaywrightで使用できますか? | はい、ブラウザのコントロールとページ操作のロジックをそれらのフレームワークのAPIに合わせて変更することで、SeleniumまたはPlaywrightに統合を適応させることができます。 |
| CapSolverがCAPTCHAを解決できない場合はどうなりますか? | スクリプトに再試行ロジックを実装するか、残高不足などのCapSolverアカウントの問題を確認します。デバッグのためにエラーを記録します。 |
| CapSolverでプロキシは必要ですか? | この例ではReCaptchaV2TaskProxylessを使用していますが、地域固有のCAPTCHAにはプロキシが必要になる場合があります。BrowserCloudの内蔵プロキシローテーションはこれと連携できます。 |
CapSolverとBrowserCloudを統合すると、CAPTCHAに遭遇するWebタスクを自動化するための強力な組み合わせが作成されます。CapSolverのAI駆動のCAPTCHA解決により、BrowserCloud上のPuppeteerスクリプトが反ボット対策をバイパスできるようになります。一方、BrowserCloudのスケーラブルなインフラストラクチャとプロキシサポートにより、自動化の信頼性が向上します。これは、CAPTCHAが一般的な障害となるWebスクレイピング、自動テスト、コンテンツ生成に特に役立ちます。
開始するには、BrowserCloudとCapSolverにサインアップし、APIキーを取得し、提供されたコード例を実装します。高度な機能と追加のタスクタイプについては、CapSolverのドキュメントとBrowserCloudのドキュメントを参照してください。次の自動化プロジェクトでこの統合を試してみて、シームレスで中断のないワークフローを体験してください!
BrowserCloudユーザー向けボーナス:CapSolverアカウントをチャージする際にプロモーションコードBROWSERCLOUDを使用すると、限定6%のボーナスクレジットを受け取ることができます—制限なし、有効期限なし。
CapSolverは、ChromeやFirefoxのブラウザ拡張子を含む、HTTP対応クライアントであれば何でも使用できます。
