Devtools
DevTools を使用すると、ライブセッション中やセッション履歴において、ブラウザセッションをリアルタイムで監視およびデバッグできます。DevTools は、以下の3つの主要なイベントカテゴリを含む豊富なコンテンツを備えています。
コンソール
コンソールパネルには、ページからのリアルタイムログ出力が表示されます。プレイグラウンドでは、 console.log のような文を追加することで、変数の値をすばやく確認したり、関数の実行を追跡したり、論理エラーを特定したりできます。これは、自動化スクリプトや複雑なワークフローのデバッグ時に特に役立ちます。
- リアルタイムログとエラー監視: ページのJavaScriptによって生成されたリアルタイムのログ、警告、エラーメッセージを表示し、コードの問題をすばやく特定します。
- 自動化スクリプトのデバッグ: コンソールは自動化スクリプトのデバッグに欠かせないツールです。主要な情報を出力し、スクリプトの実行フローを追跡し、潜在的なサーバーサイドのエラーを確認することで、デバッグ効率を大幅に向上させます。

ネットワーク
ネットワークパネルは、各リクエストの基本的な詳細を明確に表示し、個々のエントリをクリックして展開することで、レスポンスヘッダーなど、リクエストの完全な情報を確認できます。
- パフォーマンス分析: ネットワークリクエストのタイムラインや読み込み時間を分析することで、大きな画像や遅いAPIの応答など、ページ読み込みを遅くするボトルネックを特定します。
- リクエストとレスポンスの検査: 個々のリソースのプロパティ(例如:HTTPヘッダー、コンテンツ、サイズなど)を確認し、期待通りに読み込まれているかを検証できます。また、すべてのリソースのヘッダーやレスポンスを検索して、キャッシュポリシーなどの設定が正しく適用されているかを確認することも可能です。

要素
要素パネルを使用すると、現在のページの HTML 構造と関連する CSS スタイルを直接確認できます。

ライブセッションをさらに活用したいですか?Scrapelessブラウザコンソールを使用すると、要素の検査、リアルタイムでのスクリプト実行、クラウド上での直接デバッグが可能になります。開発やトラブルシューティングを高速化するための使い方を学びましょう👉新登場!リアルタイムブラウザコンソールがリリース