Communityコーディング&開発github.com

x402

Browser Use Cloud の支払いを x402 でセットアップ — 暗号ウォレット(Base メインネット上の USDC)からリクエストごとに支払い、サインアップや API キーは不要。

x402 とは?

このスキルは、Coinbase の x402 プロトコルを使用して Browser Use Cloud の支払いを設定する方法をユーザーにガイドします。x402 は、従来の API キーの代わりに、米ドルステーブルコイン USDC(Base メインネット上)を暗号ウォレットから直接支払うことを可能にし、サインアップやクレジットカードは不要です。このスキルは、「そのまま使う」(Claude Code が端末でブラウザタスクを実行するために使い捨てスクリプトを書いたり実行したりする)セットアップと、「組み込む」(開発者が SDK を自身のプロジェクトにインストールし、コード内で x402 支払いを使用する)セットアップの両方をカバーします。ウォレットのセットアップ、資金調達、秘密鍵の `.env` ファイルへの安全な保存、x402 ライブラリを使った約 1 ドルのテスト実行を段階的に説明します。このスキルは、ユーザーが x402、従量課金、USDC 支払い、または API キーなしでの Browser Use Cloud の使用について尋ねたときに使用します。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/browser-use/browser-use/tree/main/skills/x402

Installed? Explore more コーディング&開発 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

Browser Use Cloud — x402(暗号ウォレット)で支払う

これはスクリプト化されたフローです。手順に従って順番に進めてください。x402 は SDK(Python 用 browser-use-sdk、TS 用 browser-use npm パッケージ)を介してのみ機能します — これに対応する browser-use CLI コマンドはないため、すべてのステップで短い SDK スクリプトを実行します。

このスクリプトの使用方法

  • Say: の下にある行は、ユーザーに 一字一句そのまま 話しかけてください。言い換えたり、追加したり、削除したりしないでください。
  • Say ブロック内の <このように> はプレースホルダーです — 実際の値に置き換え、それ以外は正確にそのままにしてください。
  • Ask: の下にある行は、AskUserQuestion ツールを使用します。質問と選択肢のテキストは、書かれている通り正確に使用してください。
  • 質問の前に説明を表示するには、その説明を AskUserQuestion の question フィールド内に入れてください(説明は選択肢の上に表示されます)。ツールを呼び出す前に別のチャットテキストとして送信しないでください — 質問 UI が開くとそのテキストは破棄されます。つまり、説明と実際の質問の両方を、1 回のツール呼び出しで question フィールドに入れてください。
  • Do: の下にある行は、あなたのアクションです。読み上げないでください。
  • 進めながら 2 つの情報を追跡してください: SETUP(ステップ 1 の A または B)と MODE(ステップ 2 の A または B)。
  • SETUP、MODE、およびパス A/B/C の名前は、あなただけが使用する内部ラベルです。ユーザーに決して言わないでください。 代わりに、選択肢を平易な言葉で説明してください(例:「アカウントにチャージ」 / 「アカウントなしウォレット」)。「モード B」や「パス A」とは決して言わないでください。

ステップ 1 — セットアップを開いて選択する

Ask:(ヘッダー: x402 を使う)— 説明と質問の両方を question フィールドに正確に入れてください:

x402 は Coinbase のプロトコルで、API キーを提示する代わりに、暗号通貨を使って API リクエストの支払いができるようにするものです。x402 を使うと、暗号ウォレットから Base 上の USDC で Browser Use にリクエストごとに支払うことができます — サインアップも、API キーも、クレジットカードも不要で、ウォレットだけが必要です。セットアップには数分かかります: ウォレットを入手または作成し、資金を追加し、キーを .env に保存し、テストします。

x402 をどのように使いたいですか?

  • そのまま使う — 私に頼めば、ここ端末でウォレットから支払って Browser Use タスクを実行できます。ウォレットとキーのセットアップは私が行います。
  • 組み込む — あなたはアプリをコーディングしていて、その中で x402 を使いたい。SDK のインストール、キーのプロジェクトの .env への保存、コードの追加を手伝います。

Do:「そのまま使う」→ SETUP = A。 「組み込む」→ SETUP = B。


ステップ 2 — アカウントを見つける(質問する前に確認する)

Do: 既存の Browser Use API キーを、次の順序で探します。まだ何も言わないでください。

  1. 環境変数 BROWSER_USE_API_KEY
  2. ./.env 内の BROWSER_USE_API_KEY= の行
  3. ~/.browser-use/config.json(browser-use cloud login / signup で保存されたもの)
  4. browser-use doctor の出力(CLI がインストールされている場合)

キーが見つからなかった場合:

Say:

Browser Use キーが見つからなかったので、アカウントなしでセットアップします: ウォレットがあなたの ID となり、最初の支払いでウォレット名にちなんだプロジェクトが作成されます。

Do: MODE = A。 ステップ 3 へ進む。

キーが見つかった場合:

Ask:(ヘッダー: アカウント)— 質問: <場所> で Browser Use API キーを見つけました。USDC クレジットはどこに振り向けるべきですか?

  • そのアカウントにチャージする — クレジットは既存の API キーのプロジェクトに追加されます。無料クレジットが切れた場合や、クレジットカードではなく暗号通貨で支払いたい場合に便利です。
  • アカウントなしウォレット — ウォレットは別の ID として扱われます。最初の支払いで、既存のアカウントとは別に、ウォレット名にちなんだ新しいプロジェクトが作成されます。

Do:「そのアカウントにチャージする」→ MODE = B。 「アカウントなしウォレット」→ MODE = A。


ステップ 3 — ウォレット

Ask:(ヘッダー: ウォレット)— 質問: 準備のできたウォレットはありますか?それとも、私がセットアップをお手伝いしましょうか?

  • 資金のあるウォレットを持っている — Base メインネット上に USDC がある EVM ウォレット(MetaMask、Rabby、Coinbase Wallet、Frame、Phantom など)。
  • 手順を教えてほしい — ウォレットの作成、Base の追加、USDC の購入をガイドします。
  • 新しいものを作成する — 自動化用の使い捨てウォレットを生成します。資金を追加する必要があります。

回答に応じて分岐します。

パス A — 「資金のあるウォレットを持っている」

Do: .env が .gitignore にあるか確認し、なければ追加します。

Ask:(ヘッダー: キーを追加)— 注意事項と質問の両方を question フィールドに入れてください:

ウォレットの秘密鍵を .env に入れる必要があります。ここに貼り付けて私に追加させるか、ご自身で追加することができます。注意: チャットに貼り付けられたものはすべてトランスクリプトに保存されるため、価値の高いウォレットの場合は、ご自身で追加する方が少し安全です。どのようにしますか?

  • ここに貼り付ける — 秘密鍵をチャットに貼り付けてください。私が .env に書き込みます。
  • 自分で追加する — ご自身で .env に追加し、公開アドレスだけを私に送ってください。

「ここに貼り付ける」の場合:

Do: BROWSER_USE_X402_PRIVATE_KEY=<貼り付けられたキー> を .env に書き込みます(ファイルが必要なら作成し、.env が gitignore されていることを確認します)。キーを決してエコーバックしたり、どこかに出力したりしないでください。

Say:

キーを .env に保存しました — キーを出力することはしません。

Do: ステップ 4 へ進む。

「自分で追加する」の場合:

Say:

以下の行をあなたの .env に追加し、ウォレットの公開アドレス(0x… のもの — 共有しても安全です)を私に送ってください:

BROWSER_USE_X402_PRIVATE_KEY=<あなたの秘密鍵>

Do: ユーザーがアドレスを送信したら、それが ^0x[0-9a-fA-F]{40}$ に一致するか確認します。

Say:

受け取りました: <アドレス>。有効なアドレスです。

Do: ステップ 4 へ進む。

パス B — 「手順を教えてほしい」

Say:

  1. MetaMask(または Rabby、Coinbase Wallet、Frame、Trust Wallet、Phantom など)を公式サイト https://metamask.io からのみインストールします。ウォレットを作成し、シードフレーズをオフラインで保存し、パスワードを設定します。
  2. ネットワークとして Base を追加します。https://chainlist.org/chain/8453 を開き、「Connect Wallet」→「Add to MetaMask」をクリックし、ウォレットで承認します。
  3. ウォレットで「Buy」をクリックします。USDC、ネットワーク Base を選択し、カード / Apple Pay / 銀行で支払います。USDC はウォレットに直接入金されます。
  4. 秘密鍵を取得します: アカウントメニュー → アカウント詳細 → 秘密鍵を表示 → パスワードを入力 → コピー。
  5. あなたの .env に追加します(.env が gitignore されていることを確認してください):
BROWSER_USE_X402_PRIVATE_KEY=<あなたの秘密鍵>
  1. ウォレットの公開アドレス(0x… のもの)を私に送ってください。確認します。

Do: その後、アドレス確認以降はパス A に従います。

パス C — 「新しいものを作成する」

Do: ウォレットを生成します。キーを .env に保存します。アドレスのみを表示します。

Python:

pip install eth-account
from eth_account import Account
acc = Account.create()
print("Address:", acc.address)
print("Private key:", acc.key.hex())

TypeScript:

npm install viem
import { generatePrivateKey, privateKeyToAccount } from "viem/accounts";
const key = generatePrivateKey();
console.log("Address:", privateKeyToAccount(key).address);
console.log("Private key:", key);

Say:

新しいウォレットを作成しました。あなたの公開アドレスは <アドレス> で、秘密鍵は .env に保存しました。これに資金が必要です。

Do: ステップ 4(資金調達)へ進む。


ステップ 4 — 資金を追加する

パス A または B(すでに資金がある場合):

Say:

ウォレットにはすでに資金があるので、テストに飛びます。

Do: ステップ 5 へ進む。

パス C の場合:

Say:

Base 上のウォレットに USDC を入れる方法は 2 つあります:

  • ウォレット内の Buy ボタン(最も簡単): 「Buy」をクリックし、USDC を選び、ネットワークを Base に設定し、カードで支払います。取引所は不要です。
  • 取引所から: USDC を <アドレス> に送金し、ネットワークとして「Base」を選択します — 手数料が 5〜20 ドルかかる Ethereum は避けてください。

最低 20 ドル追加してください: 1 ドルのテストと、いくつかの実際のタスクに十分です。残高を監視し、入金されたらお知らせします。

Do: Base のパブリック RPC を使用して、5 秒ごとにオンチェーン残高を確認します:

PADDED=$(printf "%064s" "${WALLET_ADDR:2}" | tr ' ' '0')
curl -s https://mainnet.base.org \
  -H "Content-Type: application/json" \
  -d "{\"jsonrpc\":\"2.0\",\"method\":\"eth_call\",\"params\":[{\"to\":\"0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913\",\"data\":\"0x70a08231${PADDED}\"},\"latest\"],\"id\":1}"

result を 16 進数として読み取り、1_000_000 で割ります(USDC は 6 桁の小数)。20 ドル以上になったら停止します。

Say:

入金されました。Base 上に $<金額> を確認しました。次に、簡単なテストを行います。


ステップ 5 — テスト実行(約 1 ドル)

Do: SETUP = A の場合、スクリプトを実行する場所に SDK がインストールされていることを確認します(デフォルトは Python)。 SETUP = B の場合、プロジェクトの言語に応じてプロジェクトに SDK をインストールします — 言語は cwd から判断します(package.json/tsconfig.json → TypeScript; pyproject.toml/requirements.txt/*.py → Python; 判断できない場合のみ質問します):

# Python(x402 エクストラには 3.10+ が必要)
pip install "browser-use-sdk[x402]"
# TypeScript
npm install browser-use-sdk @x402/fetch @x402/evm viem

Ask:(ヘッダー: テスト実行)— 質問: テストの準備はできましたか?これにより、ウォレットからちょうど 1 ドルの USDC が消費され、支払いと処理がエンドツーエンドでテストされます。

  • デフォルトのタスクを使う — 「example.com にアクセスして、見出しのテキストを教えてください。」(約 5 秒、低コスト)
  • 自分でタスクを指定する — 代わりに実行する短いタスクを教えてください。
  • テストをスキップする — テストをスキップして、すぐに x402 の使用を開始します。

Do:

  • 「自分でタスクを指定する」→ Say: タスクは何ですか?短くしてください。 入力を待ちます。
  • 「テストをスキップする」→ ステップ 6 へ進む。
  • それ以外の場合はデフォルトのタスクを使用します。

Do: テストを実行します。SDK がデフォルトで使用する 5 ドルではなく、1 ドルを支払うように、max_value を 1.50 ドルに設定した生の x402 クライアントを使用します:

import asyncio, os
from decimal import Decimal
from x402 import x402Client
from x402.http.clients import x402HttpxClient
from x402.mechanisms.evm import EthAccountSigner
from x402.mechanisms.evm.exact.register import register_exact_evm_client
from eth_account import Account

async def main():
    client = x402Client()
    register_exact_evm_client(
        client,
        EthAccountSigner(Account.from_key(os.environ["BROWSER_USE_X402_PRIVATE_KEY"])),
    )
    # max_value はリクエストごとの支出を制限 — デフォルトの 5 ドルではなく 1 ドルのオプションを選択します。
    async with x402HttpxClient(client, max_value=Decimal("1.5"), timeout=180.0) as http:
        resp = await http.post(
            "https://x402.api.browser-use.com/api/v3/sessions",
            json={"task": "<タスク>"},
        )
        print(resp.status_code, resp.json())

asyncio.run(main())

MODE = B の場合、API キーヘッダーを追加します。そうしないと、1 ドルはチャージ対象のプロジェクトではなく、新しいウォレットプロジェクトに使われてしまいます:

async with x402HttpxClient(
    client, max_value=Decimal("1.5"), timeout=180.0,
    headers={"X-Browser-Use-API-Key": os.environ["BROWSER_USE_API_KEY"]},
) as http:
    ...

インストールされている x402 ライブラリに max_value がない場合、Say: その x402 バージョンでは 1 ドルの課金を強制できないため、テストには代わりに 5 ドルかかります。続行してもよろしいですか? — 実行する前に「はい」を待ちます。

Say:

支払い完了。オンチェーン証明: https://basescan.org/address/<アドレス>#tokentxns — ちょうど 1.000000 ドルの USDC 送金を探してください。

Do: 残高を読み取ります。MODE = A の場合(browser-use-sdk ≥ 3.8.0 が必要; 古い場合は、pip install -U "browser-use-sdk[x402]" を実行するように伝えるか、これをスキップします):

import asyncio, os
from browser_use_sdk.v3 import get_wallet_balance

async def main():
    bal = await get_wallet_balance(os.environ["BROWSER_USE_X402_PRIVATE_KEY"])
    print(bal['total_credits_usd'])

asyncio.run(main())

MODE = B の場合、get_wallet_balance はスキップします(404 が返ります — クレジットは API キーのプロジェクトにあり、これは正常で、エラーとして表示しないでください)代わりに通常の方法で読み取ります:

from browser_use_sdk.v3 import AsyncBrowserUse
client = AsyncBrowserUse(api_key=os.environ["BROWSER_USE_API_KEY"])
acct = await client.billing.account()
print(acct.total_credits_balance_usd)

Say:

完了。Browser Use の残高は $<残高> になりました(テストには約 $<コスト> かかりました)。タスクはこの残高から消費され、残高がなくなると SDK がさらに 5 ドルを追加します。


ステップ 6 — まとめ

SETUP = A の場合:

Say:

準備完了です。ブラウザタスクを実行してほしいと頼めば、SDK を通じてウォレットから支払って実行します。

Do: ユーザーがタスクを依頼したら、使い捨てスクリプトを(/tmp に、長時間タスクの場合はバックグラウンドジョブとして)書き、実行し、結果を報告し、削除します — ファイルを cwd に残さないでください。SDK は BROWSER_USE_X402_PRIVATE_KEY を読み取り、x402 エンドポイントを自動的に見つけます:

import asyncio, os
from browser_use_sdk.v3 import AsyncBrowserUse

async def main():
    client = AsyncBrowserUse()  # Mode B: AsyncBrowserUse(api_key=os.environ["BROWSER_USE_API_KEY"])
    result = await client.run(task="<タスク>")
    print(result.output)

asyncio.run(main())

SETUP = B の場合:

Say:

準備完了です。あなたのコードで使用するクライアントはこちら — .env からキーとエンドポイントを読み取ります:

Do: プロジェクトの言語でクライアントを追加し、残りの部分については cloud スキル / SDK ドキュメントを参照するように促します:

from browser_use_sdk.v3 import AsyncBrowserUse

client = AsyncBrowserUse()                                  # Mode A(アカウントなし)
# client = AsyncBrowserUse(api_key="bu_...")                # Mode B(既存アカウントにチャージ)

(x402 は 非同期 クライアントが必要です — 同期 BrowserUse は x402 環境変数が設定されていると動作しません。)


TypeScript 相当表

PythonTypeScript
from browser_use_sdk.v3 import AsyncBrowserUseimport { BrowserUse } from "browser-use-sdk/v3"
AsyncBrowserUse()new BrowserUse()
await client.run(task=...) → .outputawait client.run({ task }) → .output
get_wallet_balance(key)getWalletBalance(key)(from "browser-use-sdk/v3")
pip install "browser-use-sdk[x402]"npm install browser-use-sdk @x402/fetch @x402/evm viem

両方の SDK は環境変数 BROWSER_USE_X402_PRIVATE_KEY を読み取ります。

ルール

  • スクリプトに従って順番に進めてください。Say ブロックは一字一句そのまま話してください。
  • 明確な「はい」なしにユーザーの USDC を使ってはいけません(ステップ 5 の質問がその「はい」です)。
  • キーを追加する方法は常に両方提供してください: チャットに貼り付ける(あなたが .env に書き込む)か、ユーザーが自分で追加するか。貼り付けられた場合、すぐに .env に書き込み、決してエコーバックしたり他の場所に保存したりしないでください。
  • キーを保存する前に、.env を .gitignore に追加してください。
  • ウォレットには実際のお金が入っています。 キーをソース管理、ログ、スクリーンショットの外に保管し、漏洩しても失っても構わない金額だけを入れてください。

参考

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

browser-use

Automates browser interactions for web testing, form filling, screenshots, and data extraction. Use when the user needs to navigate websites, interact with web pages, fill forms, take screenshots, or extract information from web pages.

browser-use/cloud

Documentation reference for using Browser Use Cloud — the hosted API and SDK for browser automation. Use this skill whenever the user needs help with the Cloud REST API (v2 or v3), browser-use-sdk (Python or TypeScript), X-Browser-Use-API-Key authentication, cloud sessions, browser profiles, profile sync, CDP WebSocket connections, stealth browsers, residential proxies, CAPTCHA handling, webhooks, workspaces, skills marketplace, liveUrl streaming, pricing, or integration patterns (chat UI, subagent, adding browser tools to existing agents). Also trigger for questions about n8n/Make/Zapier integration, Playwright/ Puppeteer/Selenium on cloud infrastructure, or 1Password vault integration. Do NOT use this for the open-source Python library (Agent, Browser, Tools config) — use the open-source skill instead.

browser-use/open-source

Documentation reference for writing Python code using the browser-use open-source library. Use this skill whenever the user needs help with Agent, Browser, or Tools configuration, is writing code that imports from browser_use, asks about @sandbox deployment, supported LLM models, Actor API, custom tools, lifecycle hooks, MCP server setup, or monitoring/observability with Laminar or OpenLIT. Also trigger for questions about browser-use installation, prompting strategies, or sensitive data handling. Do NOT use this for Cloud API/SDK usage or pricing — use the cloud skill instead. Do NOT use this for directly automating a browser via CLI commands — use the browser-use skill instead.

browser-use/remote-browser

Controls a local browser from a sandboxed remote machine. Use when the agent is running in a sandbox (no GUI) and needs to navigate websites, interact with web pages, fill forms, take screenshots, or expose local dev servers via tunnels.

関連スキル