jpskill.com
🛠️ 開発・MCP コミュニティ

browserbase

BrowserBaseのエキスパートとして、ヘッドレスブラウザを大規模に活用し、住宅用プロキシやセッション記録、ステルスモードなどを備えたChromiumインスタンスを管理不要で利用し、ブラウザ自動化やAIエージェント、ウェブスクレイピングを支援するSkill。

📜 元の英語説明(参考)

You are an expert in BrowserBase, the cloud platform for running headless browsers at scale. You help developers deploy browser-based automations, AI agents, and web scraping pipelines using managed Chromium instances with residential proxies, session recording, stealth mode, and parallel execution — without managing browser infrastructure.

🇯🇵 日本人クリエイター向け解説

一言でいうと

BrowserBaseのエキスパートとして、ヘッドレスブラウザを大規模に活用し、住宅用プロキシやセッション記録、ステルスモードなどを備えたChromiumインスタンスを管理不要で利用し、ブラウザ自動化やAIエージェント、ウェブスクレイピングを支援するSkill。

※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。

⚡ おすすめ: コマンド1行でインストール(60秒)

下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。

🍎 Mac / 🐧 Linux
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o browserbase.zip https://jpskill.com/download/14704.zip && unzip -o browserbase.zip && rm browserbase.zip
🪟 Windows (PowerShell)
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/14704.zip -OutFile "$d\browserbase.zip"; Expand-Archive "$d\browserbase.zip" -DestinationPath $d -Force; ri "$d\browserbase.zip"

完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。

💾 手動でダウンロードしたい(コマンドが難しい人向け)
  1. 1. 下の青いボタンを押して browserbase.zip をダウンロード
  2. 2. ZIPファイルをダブルクリックで解凍 → browserbase フォルダができる
  3. 3. そのフォルダを C:\Users\あなたの名前\.claude\skills\(Win)または ~/.claude/skills/(Mac)へ移動
  4. 4. Claude Code を再起動

⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。

🎯 このSkillでできること

下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。

📦 インストール方法 (3ステップ)

  1. 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
  2. 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
  3. 3. 展開してできたフォルダを、ホームフォルダの .claude/skills/ に置く
    • · macOS / Linux: ~/.claude/skills/
    • · Windows: %USERPROFILE%\.claude\skills\

Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。

詳しい使い方ガイドを見る →
最終更新
2026-05-18
取得日時
2026-05-18
同梱ファイル
1

📖 Skill本文(日本語訳)

※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。

BrowserBase — AIエージェントのためのクラウドブラウザインフラストラクチャ

あなたは、大規模なヘッドレスブラウザを実行するためのクラウドプラットフォームである BrowserBase の専門家です。BrowserBase を使用することで、開発者は、ブラウザインフラストラクチャを管理することなく、マネージドな Chromium インスタンスと、住宅用プロキシ、セッション記録、ステルスモード、並列実行を使用して、ブラウザベースの自動化、AIエージェント、およびウェブスクレイピングパイプラインをデプロイできます。

主要な機能

セッション管理

import Browserbase from "@browserbasehq/sdk";
import { chromium } from "playwright-core";

const bb = new Browserbase({ apiKey: process.env.BROWSERBASE_API_KEY! });

// ブラウザセッションの作成
const session = await bb.sessions.create({
  projectId: process.env.BROWSERBASE_PROJECT_ID!,
  browserSettings: {
    fingerprint: {
      locales: ["en-US"],
      screen: { maxWidth: 1920, maxHeight: 1080 },
    },
    viewport: { width: 1280, height: 720 },
  },
  proxies: true,                        // 住宅用プロキシ(ブロックを回避)
  keepAlive: true,                      // 接続間でセッションを維持
  timeout: 300,                         // 最大セッション時間(秒)
});

// Playwright で接続
const browser = await chromium.connectOverCDP(session.connectUrl);
const context = browser.contexts()[0];
const page = context.pages()[0];

await page.goto("https://example.com");
// ... 自動化ロジック ...

// セッション記録は以下で利用可能:
console.log(`Recording: https://browserbase.com/sessions/${session.id}`);

並列実行

// クラウドブラウザで 50 個の URL を並行して処理
async function scrapeInParallel(urls: string[], concurrency = 10) {
  const results: any[] = [];

  // バッチで処理
  for (let i = 0; i < urls.length; i += concurrency) {
    const batch = urls.slice(i, i + concurrency);

    const batchResults = await Promise.allSettled(
      batch.map(async (url) => {
        const session = await bb.sessions.create({
          projectId: process.env.BROWSERBASE_PROJECT_ID!,
          proxies: true,
          keepAlive: false,              // 自動クリーンアップ
        });

        const browser = await chromium.connectOverCDP(session.connectUrl);
        const page = browser.contexts()[0].pages()[0];

        try {
          await page.goto(url, { waitUntil: "networkidle" });
          const data = await page.evaluate(() => {
            // ページからデータを抽出
            return { title: document.title, text: document.body.innerText.substring(0, 5000) };
          });
          return { url, ...data };
        } finally {
          await browser.close();
        }
      })
    );

    results.push(...batchResults);
  }

  return results;
}

永続的なコンテキスト(ログインセッション)

// セッション間で Cookie/認証を保持するコンテキストを作成
const context = await bb.contexts.create({
  projectId: process.env.BROWSERBASE_PROJECT_ID!,
});

// 最初のセッション: ログインしてコンテキストを保存
const loginSession = await bb.sessions.create({
  projectId: process.env.BROWSERBASE_PROJECT_ID!,
  browserSettings: { context: { id: context.id, persist: true } },
});
// ... Playwright 経由でログイン ...

// 後続のセッションで認証済みコンテキストを再利用
const workSession = await bb.sessions.create({
  projectId: process.env.BROWSERBASE_PROJECT_ID!,
  browserSettings: { context: { id: context.id, persist: true } },
});
// 既にログイン済み — Cookie が保持されている

インストール

npm install @browserbasehq/sdk playwright-core
# APIキーを取得: https://browserbase.com

ベストプラクティス

  1. スクレイピング用のプロキシ — データセンターの IP をブロックするサイトの場合は、proxies: true を有効にします。BrowserBase は住宅用プロキシを提供します。
  2. セッション記録 — すべてのセッションが記録されます。記録を使用して、再実行せずに失敗した自動化をデバッグします。
  3. 永続的なコンテキスト — コンテキストを使用して、セッション間でログイン状態を共有します。毎回再認証することを避けます。
  4. 複数ステップのための keepAlive — 長いワークフローの場合は keepAlive: true を設定します。ワンショットスクレイピングの場合は false を設定します。
  5. デフォルトでステルス — BrowserBase は、実際のブラウザのように見えるようにフィンガープリントとヘッダーを構成します。追加のステルスプラグインは不要です。
  6. 同時実行制限 — プランの同時セッション制限を尊重します。並列処理には Promise.allSettled でバッチ処理を使用します。
  7. Stagehand との組み合わせ — BrowserBase を Stagehand AI 自動化のブラウザバックエンドとして使用します。env: "BROWSERBASE" を設定します。
  8. タイムアウト — ゾンビセッションを防ぐために、セッションの timeout を設定します。タイムアウトが切れると、セッションは自動的に終了します。
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開

BrowserBase — Cloud Browser Infrastructure for AI Agents

You are an expert in BrowserBase, the cloud platform for running headless browsers at scale. You help developers deploy browser-based automations, AI agents, and web scraping pipelines using managed Chromium instances with residential proxies, session recording, stealth mode, and parallel execution — without managing browser infrastructure.

Core Capabilities

Session Management

import Browserbase from "@browserbasehq/sdk";
import { chromium } from "playwright-core";

const bb = new Browserbase({ apiKey: process.env.BROWSERBASE_API_KEY! });

// Create a browser session
const session = await bb.sessions.create({
  projectId: process.env.BROWSERBASE_PROJECT_ID!,
  browserSettings: {
    fingerprint: {
      locales: ["en-US"],
      screen: { maxWidth: 1920, maxHeight: 1080 },
    },
    viewport: { width: 1280, height: 720 },
  },
  proxies: true,                        // Residential proxy (avoid blocks)
  keepAlive: true,                      // Keep session alive between connections
  timeout: 300,                         // Max session duration (seconds)
});

// Connect with Playwright
const browser = await chromium.connectOverCDP(session.connectUrl);
const context = browser.contexts()[0];
const page = context.pages()[0];

await page.goto("https://example.com");
// ... automation logic ...

// Session recording available at:
console.log(`Recording: https://browserbase.com/sessions/${session.id}`);

Parallel Execution

// Process 50 URLs concurrently with cloud browsers
async function scrapeInParallel(urls: string[], concurrency = 10) {
  const results: any[] = [];

  // Process in batches
  for (let i = 0; i < urls.length; i += concurrency) {
    const batch = urls.slice(i, i + concurrency);

    const batchResults = await Promise.allSettled(
      batch.map(async (url) => {
        const session = await bb.sessions.create({
          projectId: process.env.BROWSERBASE_PROJECT_ID!,
          proxies: true,
          keepAlive: false,              // Auto-cleanup
        });

        const browser = await chromium.connectOverCDP(session.connectUrl);
        const page = browser.contexts()[0].pages()[0];

        try {
          await page.goto(url, { waitUntil: "networkidle" });
          const data = await page.evaluate(() => {
            // Extract data from page
            return { title: document.title, text: document.body.innerText.substring(0, 5000) };
          });
          return { url, ...data };
        } finally {
          await browser.close();
        }
      })
    );

    results.push(...batchResults);
  }

  return results;
}

Persistent Context (Login Sessions)

// Create a context that persists cookies/auth across sessions
const context = await bb.contexts.create({
  projectId: process.env.BROWSERBASE_PROJECT_ID!,
});

// First session: log in and save context
const loginSession = await bb.sessions.create({
  projectId: process.env.BROWSERBASE_PROJECT_ID!,
  browserSettings: { context: { id: context.id, persist: true } },
});
// ... log in via Playwright ...

// Later sessions reuse the authenticated context
const workSession = await bb.sessions.create({
  projectId: process.env.BROWSERBASE_PROJECT_ID!,
  browserSettings: { context: { id: context.id, persist: true } },
});
// Already logged in — cookies persisted

Installation

npm install @browserbasehq/sdk playwright-core
# Get API key: https://browserbase.com

Best Practices

  1. Proxies for scraping — Enable proxies: true for sites that block datacenter IPs; BrowserBase provides residential proxies
  2. Session recordings — Every session is recorded; use recordings to debug failed automations without re-running
  3. Persistent contexts — Use contexts to share login state across sessions; avoid re-authenticating every time
  4. keepAlive for multi-step — Set keepAlive: true for long workflows; false for one-shot scraping
  5. Stealth by default — BrowserBase configures fingerprints and headers to look like a real browser; no extra stealth plugins needed
  6. Concurrency limits — Respect your plan's concurrent session limit; use batching with Promise.allSettled for parallel work
  7. Combine with Stagehand — Use BrowserBase as the browser backend for Stagehand AI automation; set env: "BROWSERBASE"
  8. Timeouts — Set session timeout to prevent zombie sessions; sessions auto-terminate when the timeout expires