日本語

简体中文
English

日本語

简体中文
English

browser_action ​

browser_action ツールは、Puppeteer で制御されるブラウザに基づいてウェブ自動化とインタラクション機能を実現し、VJSP がブラウザを起動したり、目標ウェブサイトにナビゲートしたり、ページ要素をクリックしたり、テキストを入力したり、ページをスクロールしたり、スクリーンショットを通じて可視化フィードバックを提供したりすることをサポートします。

パラメータ説明 ​

このツールは以下のパラメータを受け付けます。パラメータの制約と値の規則は次のとおりです：

  • action（必須）：実行する操作タイプ。取り得る値は次のとおり：
    • launch：新しいブラウザセッションを起動し、指定されたURLにナビゲートする
    • click：ページ上の指定されたX、Y座標位置でクリック操作を実行する
    • type：キーボードによるテキスト入力操作を実行する
    • scroll_down：1ページ分下にスクロールする
    • scroll_up：1ページ分上にスクロールする
    • close：現在のブラウザセッションを終了する
  • url（オプション）：launch操作を使用する場合、ブラウザのナビゲート先のURLを指定する
  • coordinate（オプション）：click操作を使用する場合、クリックするX、Y座標を指定する（例の形式："450,300"）
  • text（オプション）：type操作を使用する場合、入力するテキスト内容を指定する

機能位置付け ​

このツールは、VJSP が制御する自動化ブラウザセッションを作成し、ウェブサイトのナビゲーション、ページ要素とのインタラクション、およびブラウザ自動化をサポートする必要があるすべてのタスクの実行を実現します。各操作の後に現在のページ状態のスクリーンショットが生成され、プロセスの可視化検証をサポートします。

適用シナリオ ​

  • VJSP がウェブアプリケーションやウェブサイトとインタラクションする必要がある場合
  • ユーザーインターフェース（UI）やウェブ機能の自動化テストを実施する場合
  • ウェブページのスクリーンショットをキャプチャして保存または分析する場合
  • ウェブビジネスプロセスを可視化してデモンストレーションする場合

コア機能 ​

  • 各操作の後にスクリーンショットを生成し、コンソールログをキャプチャし、可視化フィードバックとデバッグの根拠を提供します
  • ブラウザの起動、ページとのインタラクション、セッションの終了までの全プロセスの自動化をサポートします
  • 座標ベースの精密なインタラクション、キーボード入力、ページスクロール操作をサポートします
  • ブラウザセッションの一貫性を保証するためのインテリジェントなページロード検出メカニズムが組み込まれています
  • 2つの動作モードをサポート：ローカルモード（独立した Puppeteer インスタンス）、リモートモード（既に起動している Chrome ブラウザに接続）
  • 優雅なエラー処理能力を備え、セッションの自動クリーンアップと詳細なエラー情報の出力を実現します
  • 複数のスクリーンショット形式と品質設定をサポートし、可視化出力効果を最適化します
  • 位置識別と操作履歴記録を通じて、インタラクション状態の全リンク追跡を実現します

ブラウザの動作モード ​

このツールは、異なる自動化シナリオの要件に適応するために、2つの独立した動作モードを提供します：

ローカルブラウザモード（デフォルト） ​

  • Puppeteer を介してローカルの Chromium インスタンスを自動的にダウンロードして管理します
  • 各起動操作ごとに完全に新しいブラウザ実行環境を作成します
  • ローカルの既存のユーザー設定、Cookie、およびブラウザ拡張機能にアクセスすることはできません
  • サンドボックス環境で一貫性のある予測可能な動作を実現します
  • セッションが終了すると、ブラウザプロセスが自動的かつ完全に閉じられます

リモートブラウザモード ​

  • リモートデバッグ機能が有効になっている Chrome/Chromium ブラウザインスタンスに接続します
  • ブラウザの既存の実行状態、Cookie、およびインストールされた拡張機能にアクセスできます
  • 既存のブラウザプロセスを再利用し、起動速度を最適化します
  • Docker コンテナ内またはリモートサーバー上のブラウザインスタンスへの接続をサポートします
  • セッションが終了すると、接続のみが切断され、ターゲットブラウザは閉じられません
  • リモートデバッグポートが有効になっている Chrome ブラウザに依存します（デフォルトポート：9222）

機能制限 ​

  • ブラウザセッションがアクティブな間は、browser_action ツールのみが呼び出されて操作を実行できます
  • ブラウザ座標はビューポート相対座標であり、ページ絶対座標ではありません
  • クリック操作はビューポート内の可視要素への位置決めのみをサポートします
  • 他のツールに切り替える前に、現在のブラウザセッションを明示的に閉じる必要があります
  • ブラウザウィンドウサイズはカスタム設定をサポートします（デフォルトサイズ：900x600）
  • ブラウザの開発者ツール（DevTools）と直接インタラクションすることはサポートされていません
  • ブラウザセッションは一時的な状態であり、VJSP を再起動すると永続化することはできません
  • Chrome/Chromium ブラウザのみに対応し、Firefox や Safari はまだサポートされていません
  • ローカルモードでは既存の Cookie にアクセスできません。リモートモードはデバッグ機能が有効になっている Chrome ブラウザに依存します

実行原理 ​

browser_action ツールが呼び出されると、以下のフローに従って操作が実行されます：

  1. 操作検証とブラウザ管理

    • 要求された操作の必須パラメータの合法性を検証します
    • launch 操作を実行：ブラウザセッションを初期化します（ローカル Puppeteer インスタンス/リモート Chrome 接続）
    • インタラクション操作を実行：既に確立されたブラウザセッションを再利用します
    • close 操作を実行：対応するモードに従ってブラウザ接続を終了または切断します

  2. ページインタラクションと安定性保証

    • waitTillHTMLStable アルゴリズムに基づいて DOM の安定性を検出し、ページが完全にロードされたことを確認します
    • ナビゲーション、クリック、入力、スクロールなどの要求された操作を合理的な順序で実行します
    • クリック後のネットワークアクティビティを監視し、必要に応じてページのナビゲーションが完了するまで待機します

  3. 可視化フィードバック生成

    • WebP 形式を優先的に使用して最適化されたスクリーンショットをキャプチャします（PNG 形式をフォールバックソリューションとして使用）
    • ブラウザのコンソールログを記録し、問題のデバッグの根拠を提供します
    • マウスの位置を追跡し、ページ分割された操作履歴記録を維持します

  4. セッションライフサイクル管理

    • 複数の操作間でブラウザの実行状態を維持します
    • 実行中のエラーをキャプチャし、システムリソースを自動的にクリーンアップします
    • コンプライアンスのワークフロー実行順序を強制します：起動 → インタラクション → 終了

ワークフローの実行順序 ​

ブラウザ自動化インタラクションは、以下の実行順序に厳密に従う必要があります：

  1. セッションの初期化：すべてのブラウザ自動化ワークフローは、launch 操作から始める必要があります
  2. インタラクション実行フェーズ：click、type、およびスクロール操作を複数回連続して実行できます
  3. セッションの終了：すべてのブラウザ自動化ワークフローは、close 操作で終了する必要があります
  4. ツールの切り替え：ブラウザセッションを閉じた後、他のツールを呼び出して操作を実行できます

典型的な応用例 ​

  • ウェブフォームの送信プロセス：VJSP はブラウザを起動してフォームページにナビゲートし、type 操作で各フィールドに入力し、クリック操作でフォームを送信します
  • レスポンシブウェブサイトのテスト：VJSP は目標サイトにナビゲートし、スクロール操作でページの異なる領域の適合効果をチェックします
  • Webアプリケーションのスクリーンショットキャプチャ：VJSP はアプリケーションの異なるページにナビゲートし、各ノードでスクリーンショット操作を実行して保存します
  • 電子商取引のチェックアウトプロセスのデモンストレーション：VJSP は商品選択から支払い確認までの全プロセス操作をシミュレートします

呼び出し例 ​

ブラウザを起動して指定されたウェブサイトにナビゲート：

<browser_action>
<action>launch</action>
<url>https://example.com</url>
</browser_action>

指定された座標でクリック操作を実行（ページボタンのクリックなど）：

<browser_action>
<action>click</action>
<coordinate>450,300</coordinate>
</browser_action>

フォーカスされた入力ボックスにテキストを入力：

<browser_action>
<action>type</action>
<text>Hello, World!</text>
</browser_action>

ページを下にスクロールしてより多くのコンテンツを表示：

<browser_action>
<action>scroll_down</action>
</browser_action>

現在のブラウザセッションを閉じる：

<browser_action>
<action>close</action>
</browser_action>