Playwright

Scraping Browserは、動的なウェブサイトからのデータ抽出プロセスを簡素化するために設計された、高性能なサーバーレスプラットフォームを提供します。Playwrightとのシームレスな統合により、開発者は、専用のサーバーリソースを必要とすることなく、ヘッドレスブラウザを実行、管理、監視でき、効率的なウェブ自動化とデータ収集を実現できます。

必要なライブラリのインストール

まず、既存のブラウザインスタンスに接続するために使用されるPlaywrightの軽量バージョンであるplaywright-coreをインストールします。

npm install playwright-core

Scraping Browserに接続するためのコードの記述

Playwrightコードで、次のようにScraping Browserに接続します。

const { Playwright } = require('@scrapeless-ai/sdk');
 
(async () => {
    const browser = await Playwright.connect({
        session_name: 'sdk_test',
        session_ttl: 180,
        proxy_country: 'US',
        session_recording: true,
        defaultViewport: null
    });
 
    const context = browser.contexts()[0];
    const page = await context.newPage();
 
    await page.goto('https://www.scrapeless.com');
    console.log(await page.title());
    await browser.close();
})();

これにより、スケーラビリティ、IPローテーション、グローバルアクセスなど、Scraping Browserのインフラストラクチャを活用できます。

実践例

Scraping Browserを統合した後の一般的なPlaywright操作をいくつか示します。

ナビゲーションとページコンテンツの抽出

const page = await browser.newPage();
await page.goto('https://www.example.com');
console.log(await page.title());
const html = await page.content();
console.log(html);
await browser.close();

スクリーンショットの撮影

const context = browser.contexts()[0];
const page = await context.newPage();
await page.goto('https://www.example.com');
await page.screenshot({ path: 'example.png' });
console.log('Screenshot saved as example.png');
await browser.close();

カスタムコードの実行

const context = browser.contexts()[0];
const page = await context.newPage();
await page.goto('https://www.example.com');
const result = await page.evaluate(() => document.title);
console.log('Page title:', result);
await browser.close();

マウスクリックのシミュレート

const { createPlaywrightCDPSession } = require('@scrapeless-ai/sdk');
// ... connect to Scraping Browser as shown above
const cdpSession = await createPlaywrightCDPSession(page);
await cdpSession.realClick('button[type="submit"]');

キーボード入力のシミュレート

const { createPlaywrightCDPSession } = require('@scrapeless-ai/sdk');
// ... connect to Scraping Browser as shown above
const cdpSession = await createPlaywrightCDPSession(page);
await cdpSession.realFill('#login-email', 'scrapeless@gmail.com');

Scrapeless Agentを使用して現在のページURLを取得

const { createPlaywrightCDPSession } = require('@scrapeless-ai/sdk');
// ... connect to Scraping Browser as shown above
const cdpSession = await createPlaywrightCDPSession(page);
const { error, liveURL } = await cdpSession.liveURL();

画像キャプチャの解決

const { createPlaywrightCDPSession } = require('@scrapeless-ai/sdk');
// ... connect to Scraping Browser as shown above
const cdpSession = await createPlaywrightCDPSession(page);
await cdpSession.imageToText({
  imageSelector: '.captcha__image',
  inputSelector: 'input[name="captcha"]',
  timeout: 30000,
});

自動キャプチャ解決の無効化

const { createPlaywrightCDPSession } = require('@scrapeless-ai/sdk');
// ... connect to Scraping Browser as shown above
const cdpSession = await createPlaywrightCDPSession(page);
await cdpSession.disableCaptchaAutoSolve();

指定されたオプションでキャプチャを手動で解決

const { createPlaywrightCDPSession } = require('@scrapeless-ai/sdk');
// ... connect to Scraping Browser as shown above
const cdpSession = await createPlaywrightCDPSession(page);
await cdpSession.solveCaptcha();

ページでキャプチャが検出されるのを待つ

const { createPlaywrightCDPSession } = require('@scrapeless-ai/sdk');
// ... connect to Scraping Browser as shown above
const cdpSession = await createPlaywrightCDPSession(page);
await cdpSession.waitCaptchaDetected({ timeout: 30000 });

キャプチャが解決されるのを待つ（成功または失敗のどちらか）

const { createPlaywrightCDPSession } = require('@scrapeless-ai/sdk');
// ... connect to Scraping Browser as shown above
const cdpSession = await createPlaywrightCDPSession(page);
await cdpSession.waitCaptchaSolved({ timeout: 30000 });

Puppeteer ライブセッション