mcpField
F
functions

functions

github.com/browserbaseクラウド・DevOps3.7k2.8k 回インストール8 週間前に更新
リポジトリ

functions について

Browserbase Functionsは、browseコマンドラインでサーバーレスのブラウザー自動化をデプロイするスキルです。プロジェクトの初期化、ローカルでの開発・呼び出しテスト、Browserbaseへの公開を扱います。

主な機能

  1. 01browseによる関数プロジェクト初期化
  2. 02ローカルサーバーでの開発とテスト
  3. 03開発中の自動リロード
  4. 04Browserbaseへの関数公開
  5. 05CDP経由のPlaywright接続

活用シーン

  1. 01ブラウザー自動化関数のひな型作成
  2. 02関数呼び出しのローカルテスト
  3. 03自動リロードを使ったコードの反復開発
  4. 04ブラウザー自動化のBrowserbaseへのデプロイ

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/browserbase/skills --skill functions

インストール後、Claude Code で/functionsを入力して読み込まれたか確認します。

同梱ファイルLICENSE.txtREFERENCE.md

詳細

Browserbase Functions

公式の browse CLI を使用して、サーバーレスのブラウザー自動化をデプロイします。

前提条件

API キーをこちらから取得します:https://browserbase.com/settings

export BROWSERBASE_API_KEY="your_api_key"

Function プロジェクトの作成

1. 初期化
browse functions init my-function
cd my-function

次のものが作成されます:

my-function/
├── package.json
├── index.ts        # Your function code
└── .env            # Add credentials here
2. .env に認証情報を追加
echo "BROWSERBASE_API_KEY=$BROWSERBASE_API_KEY" >> .env
3. 依存関係をインストール
pnpm install

Function の構成

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

defineFn("my-function", async (context) => {
  const { session, params } = context;

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

  // Your automation
  await page.goto(params.url || "https://example.com");
  const title = await page.title();

  // Return JSON-serializable result
  return { success: true, title };
});

主なオブジェクト:

  • context.session.connectUrl - Playwright を接続するための CDP エンドポイント
  • context.params - 呼び出し元からの入力パラメーター

開発ワークフロー

1. 開発サーバーを起動
browse functions dev index.ts

サーバーは http://127.0.0.1:14113 で実行されます。

2. ローカルでテスト
curl -X POST http://127.0.0.1:14113/v1/functions/my-function/invoke \
  -H "Content-Type: application/json" \
  -d '{"params": {"url": "https://news.ycombinator.com"}}'
3. 繰り返し改善

開発サーバーはファイルの変更時に自動で再読み込みします。デバッグには console.log() を使用します。出力はターミナルに表示されます。

デプロイ

browse functions publish index.ts

出力:

Function published successfully
Build ID: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx
Function ID: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx

Function ID を保存してください - 呼び出しに必要です。

クイックリファレンス

コマンド説明
browse functions init <name>新しいプロジェクトを作成
browse functions dev <file>ローカル開発サーバーを起動
browse functions publish <file>Browserbase にデプロイ

呼び出し例、一般的なパターン、トラブルシューティングについては、REFERENCE.md を参照してください。

コメント