セッションの記録と再生
ブラウザセッションの記録と再生は、デバッグ、監査、またはトレーニングの目的で包括的なオブザーバビリティを提供します。セッション記録を有効にしてブラウザを作成すると、Amazon Bedrock AgentCore はブラウザインタラクションを自動的にキャプチャし、後で分析できるように指定した Amazon S3 バケットに保存します。
セッションリプレイは、リプレイを表示し、ブラウザセッション中に発生したアクションを理解できる包括的なブラウザインタラクションデータをキャプチャします。この機能は、ブラウザの動作に関する詳細なインサイトを提供することで、エラーを解決し、将来の呼び出しを改善するのに役立ちます。
セッションの再生中に収集される情報は次のとおりです。
-
セッション DOM の変更とミューテーション
-
クリック、スクロール、フォームインタラクションを含むユーザーアクション
-
コンソールログとエラーメッセージ
-
Chrome DevTools プロトコル (CDP) イベント
-
ネットワークイベントと HTTP リクエスト
セッション記録の前提条件
セッション記録を有効にするには、以下が必要です。
-
記録データを保存する Amazon S3 バケット
-
Amazon S3 バケットに書き込むアクセス許可を持つ IAM 実行ロール
-
記録を有効にして設定されたカスタムブラウザツール
記録用の IAM ロールを設定する
セッション録画を有効にするには、Amazon S3 に録画データを書き込み、CloudWatch にアクティビティをログに記録するアクセス許可を持つ IAM 実行ロールが必要です。 CloudWatch アクセス許可の設定方法の詳細については、「 アクセス許可」を参照してください。
実行ロールには、標準のブラウザアクセス許可を超える追加のアクセス許可が必要です。
{ "Sid": "S3Permissions", "Effect": "Allow", "Action": [ "s3:PutObject", "s3:GetObject", "s3:ListBucket", "s3:ListMultipartUploadParts", "s3:AbortMultipartUpload" ], "Resource": [ "arn:aws:s3:::your-recording-bucket", "arn:aws:s3:::your-recording-bucket/*" ] }, { "Sid": "CloudWatchLogsPermissions", "Effect": "Allow", "Action": [ "logs:CreateLogGroup", "logs:CreateLogStream", "logs:PutLogEvents", "logs:DescribeLogStreams" ], "Resource": "*" }
を実際の Amazon S3 バケット名your-recording-bucketに置き換えます。
ステップ 1: 記録を使用してブラウザツールを作成する
記録を有効にしてカスタムブラウザツールを作成します。ブラウザツールの作成手順の詳細については、AgentCore ブラウザの作成」を参照してください。
ブラウザツールを作成するときは、次の点を確認してください。
-
設定でセッション記録を有効にする
-
録画を保存するための Amazon S3 バケットとプレフィックスを指定する
-
ステップ 1 の IAM 実行ロールを使用する
Python SDK の使用例:
import boto3 import uuid region = "us-west-2" bucket = "your-recording-bucket" client = boto3.client("bedrock-agentcore-control", region_name=region) response = client.create_browser( name="MyRecordingBrowser", description="Browser with session recording enabled", networkConfiguration={"networkMode": "PUBLIC"}, executionRoleArn="arn:aws:iam::123456789012:role/AgentCoreBrowserRecordingRole", clientToken=str(uuid.uuid4()), recording={ "enabled": True, "s3Location": { "bucket": bucket, "prefix": "browser-recordings" } } ) browser_identifier = response.get("browserId") or response.get("browserIdentifier") print(f"Created browser with recording: {browser_identifier}") print(f"Recordings will be stored at: s3://{bucket}/browser-recordings/")
ステップ 2: 録音が有効なブラウザを使用する
任意のオートメーションフレームワークで、録音が有効なブラウザを使用します。すべてのブラウザインタラクションが自動的に記録されます。ストランドの使用例:
from strands import Agent from strands_tools.browser import AgentCoreBrowser # Use the browser created with recording browser_identifier = "your-browser-identifier" region = "us-west-2" browser_tool = AgentCoreBrowser(region=region, identifier=browser_identifier) agent = Agent(tools=[browser_tool.browser]) prompt = ( "Navigate to https://docs.aws.amazon.com/bedrock-agentcore/latest/devguide/what-is-bedrock-agentcore.html " "and summarize the key features of AgentCore." ) response = agent(prompt) print("Agent Response:") print(response.message["content"][0]["text"])
このセッション中のすべてのインタラクションは、セッションが終了すると自動的に記録され、Amazon S3 バケットにアップロードされます。
ステップ 3: ライブセッションをモニタリングし、録画を再生する
AWS コンソールには、リアルタイムモニタリングと記録されたセッション分析の両方のための包括的なツールが用意されています。
ライブビューのモニタリング
ブラウザセッションをリアルタイムでモニタリングし、アクティブなセッションとやり取りします。
コンソールでライブビューにアクセスするには
-
Amazon Bedrock AgentCore コンソールを開き、組み込みツールに移動します。
-
リストからブラウザツールを選択する (例:
MyRecordingBrowser) -
ブラウザセッションセクションで、ステータスが準備完了または進行中であるアクティブなセッションを見つけます。
-
ライブビュー/録画列で、指定された「ライブセッションを表示」 URL をクリックします。
-
ライブビューが新しいブラウザウィンドウで開き、リアルタイムのブラウザセッションが表示されます。
ライブビューインターフェイスは以下を提供します。
-
ブラウザセッションのリアルタイムビデオストリーム
-
自動化からコントロールを引き継いだり解放したりするインタラクティブなコントロール
-
セッションステータスインジケータと接続情報
-
コントロールが有効になっている場合にブラウザと直接やり取りする機能
セッションの再生と分析
コンソールの再生インターフェイスから詳細なセッション記録と分析にアクセスします。
コンソールでセッションの再生にアクセスするには
-
ブラウザツールに移動し、終了したステータスで完了したセッションを選択します。
-
分析するセッションの記録の表示をクリックします。
-
セッション再生ページが包括的な分析ツールとともに表示される
セッション分析機能
コンソールには、複数の分析ツールが用意されています。
-
ビデオプレイヤー: ナビゲーション用のタイムラインスクラバーによるインタラクティブ再生
-
ページナビゲーション: すべてのアクセスページと時間範囲を示すパネル
-
ユーザーアクション: タイムスタンプ、メソッド、詳細を使用したすべてのユーザーインタラクション
-
Page DOM: 各ページの DOM 構造と HTML コンテンツ
-
コンソールログ: ブラウザコンソールの出力、エラー、ログメッセージ
-
CDP イベント: パラメータと結果を含む Chrome DevTools プロトコルイベント
-
ネットワークイベント: HTTP リクエスト、レスポンス、ステータスコード、タイミング
録画をナビゲートする
記録内を移動するには、次の方法を使用します。
-
Pages パネルのページをクリックすると、特定の瞬間にジャンプします。
-
ユーザーアクションをクリックして、タイムラインで発生した場所を確認します。
-
ビデオタイムラインスクラバーを使用して正確なナビゲーションを行う
-
アクションテーブルの記録リンクを表示を選択して、特定のインタラクションにジャンプする
ステップ 4: プログラムで録画にアクセスする
Amazon Bedrock AgentCore SDK と APIsのためのライブビューと記録インサイトにプログラムでアクセスします。
プログラムによるライブビューへのアクセス
ブラウザクライアントとビューワーサーバーを使用してライブブラウザセッションに接続します。
import time from rich.console import Console from bedrock_agentcore.tools.browser_client import browser_session from browser_viewer import BrowserViewerServer console = Console() def main(): try: # Create browser session with browser_session('us-west-2') as client: print("✅ Browser ready!") ws_url, headers = client.generate_ws_headers() # Start viewer server console.print("[cyan]Starting viewer server...[/cyan]") viewer = BrowserViewerServer(client, port=8005) viewer_url = viewer.start(open_browser=True) # Keep running while True: time.sleep(1) except KeyboardInterrupt: console.print("[yellow]Shutting down...[/yellow]") if 'client' in locals(): client.stop() console.print("✅ Browser session terminated") if __name__ == "__main__": main()
プログラムによる記録アクセス
カスタム分析ワークフローのために Amazon S3 から直接データの記録にアクセスします。
import boto3 s3_client = boto3.client('s3', region_name='us-west-2') # List recordings in your bucket bucket_name = "your-recording-bucket" prefix = "browser-recordings/" response = s3_client.list_objects_v2(Bucket=bucket_name, Prefix=prefix) print(f"Recordings in s3://{bucket_name}/{prefix}:") for obj in response.get('Contents', []): print(f" {obj['Key']} ({obj['Size']} bytes)") print(f" Last Modified: {obj['LastModified']}") print()
データ構造の記録:
s3://your-recording-bucket/browser-recordings/ └── session-id/ ├── batch_1.ndjson.gz ├── batch_2.ndjson.gz └── batch_3.ndjson.gz
各セッションはセッション ID を持つフォルダを作成し、記録データはセッションの進行に伴ってチャンクでアップロードされます。
プログラムによるセッション再生の例
高度なユースケースでは、カスタムセッション再生ビューワーを構築し、記録データを独自の分析ワークフローに統合できます。
次の GitHub の例は、スタンドアロンのセッション再生ビューワーと、ブラウザセッション再生機能を使用する際のブラウザエクスペリエンス全体を示しています。
その他の例については、GitHub の AgentCore Browser の例
スタンドアロンセッション再生ビューワーは、新しいブラウザを作成せずにAmazon S3から直接記録されたブラウザセッションを表示するための別のツールです。
-
S3 に直接接続して録画を表示する
-
セッション ID を指定して過去の録画を表示する
-
S3 にアーティファクトがない場合に、セッション ID に固有のコンソール再生 URLsを使用してエラーメッセージを表示する
-
タイムラインナビゲーションを使用したインタラクティブな動画再生インターフェイス
-
フォームの塗りつぶし、クリック、ナビゲーションイベントを示すタイムライン上のアクションマーカー
-
所要時間と URL の詳細とともに移動されたページを表示するオブザーバビリティテーブル
-
各ページインタラクションのコンソールイベント、CDP ログ、ネットワークログ
-
ページレベルで統合されたセッション期間の追跡
-
ビデオデータとアクションデータの視覚的な相関関係によるリアルタイムのアクション検証
# View the latest recording in a bucket python view_recordings.py --bucket session-record-test-123456789012 --prefix replay-data # View a specific recording python view_recordings.py --bucket session-record-test-123456789012 --prefix replay-data --session 01JZVDG02M8MXZY2N7P3PKDQ74 # Use a specific AWS profile python view_recordings.py --bucket session-record-test-123456789012 --prefix replay-data --profile my-profile
詳細については、GitHub の「スタンドアロンセッション再生ビューワー
記録機能と高度な再生機能を備えたブラウザセッションを作成するための包括的なツールです。
-
S3 への自動録画を使用してブラウザセッションを作成する
-
インタラクティブコントロールを使用したライブビュー (テイク/リリース)
-
その場で表示解像度を調整する
-
S3 への自動セッション記録
-
ビデオプレイヤーインターフェイスと統合されたセッション再生ビューワー
-
正確なアクション位置追跡によるタイムラインスクラブ
-
ナビゲーションタイムラインと URL コピーを使用したPage-by-page分析
-
クリック場所の詳細を使用したフォーム入力アクションの検証
-
ページレベルで統合されたセッション期間の追跡
-
ビデオデータとアクションデータの視覚的な相関関係によるリアルタイムのアクション検証
# View the latest recording in a bucket python -m live_view_sessionreplay.browser_interactive_session
詳細については、GitHub の「インタラクティブブラウザセッション