🥳Scrapeless Communityに参加して、強力なWebスクレイピングツールキットにアクセスするために無料トライアルを取得してください!
ブログに戻ります

製品更新:新しいリアルタイムブラウザコンソールがライブです

Emily Chen
Emily Chen

Advanced Data Extraction Specialist

15-Jul-2025

以前、ユーザーがPlaygroundやSessionsでブラウザを実行する際には、ブラウザのコンソール、ネットワークアクティビティ、DOMの変更、またはイベントトレースといった重要なデバッグ情報にアクセスできませんでした。たとえば:

  • エラーメッセージを見たいですか?手動でDevToolsを開く必要がありました。
  • コンソールログを確認したいですか?不可能でした。
  • 以前のセッションを再現する必要がありますか?視認性は非常に限られていました。

これらのデバッグニーズに応えるために、ブラウザコンソールログ再生機能を紹介できることを嬉しく思います。これにより、Scrapeless Playgroundを使用したり、セッションリプレイをレビューしたりする際に、ローカル開発のようにブラウザの状態をリアルタイムで監視できます。コンソールログ、ネットワークイベント、DOMの更新を含め、ブラウザの挙動を完全かつ直感的に把握できます。


この機能の目的は?

Playgroundでのリアルタイムコンソール

スクリプトが実行中にページ内でコンソール出力、デバッグログ、エラーメッセージを表示できます。ブラウザのDevToolsを別に開く必要はありません。

セッションリプレイでのコンソールビュー

過去のセッションをレビューする際には、ページやアクションごとにコンソール、ネットワーク、要素パネルを検査できます。

各セッションの終わりに新しいメッセージが表示されます:
「セッションが正常に保存されました。セッションを表示」

クリックすると、迅速なデバッグとレビューのためにセッションの詳細に直接移動します。

マルチタブデバッグビュー

単一のインターフェースがコンソール / ネットワーク / 要素タブをサポートし、シームレスに切り替え可能で、異なる視点からページの挙動を完全に把握できます。


あなたが以下のいずれかである場合:

  • スクリプトを初めてデバッグしている
  • プロダクションの問題をレビューおよび分析している
  • チームメンバーと問題を追跡するために協力している

今すぐ根本原因を迅速に特定し、コミュニケーションの負担を軽減できます。


このアップデートでの改善点は?

Playground:シームレスなデバッグのためのリアルタイムコンソール

このアップデートにより、Playgroundで実行をクリックするたびに、ブラウザインスタンスの立ち上げだけでなく、リアルタイムのコンソールモニタリングも有効になります。

ログ出力、エラーメッセージ、デバッグ情報など、すべてが今や一つの場所で明確に表示されます。

主な改善点:

  • セッションの永続性
    実行後すべてのログが保存され、セッション履歴にリンクされます。いつでも再生可能です。

  • 柔軟なレイアウト
    コンソールパネルはDOMネットワークイベントの横に表示され、完全なデバッグ体験のための簡単なタブ切り替えが可能です。

  • 自動更新ログ
    手動で更新する必要はありません。スクリプトが実行されると、ログがリアルタイムでスクロールして更新されます。


セッション:コンソール / DOM / ネットワーク / イベントのログ再生

Playgroundだけではなく、セッションリプレイもアップグレードされています。各セッション中にキャプチャされた重要なブラウザアクティビティを完全にレビューし、トレースできます:

  • コンソール: セッションプレイバック中に生成されたすべてのブラウザログ
  • DOM: 時間の経過とともにページの構造の変化
  • ネットワーク: すべてのリクエスト、レスポンス、リソース読み込みの詳細
  • イベント: ユーザーの相互作用およびシステムによってトリガーされたイベント

この改良により、ラン後の問題診断、オートメーションの振る舞いの監査、またはチームとの洞察の共有が容易になります。


機能のハイライト

  • マルチページのサポート
    セッション内で異なるURL間を簡単に切り替えて、対応するログを表示できます。

  • レイジーローディングの最適化
    対応するパネルにアクセスされたときのみログデータが読み込まれ、不必要なリクエストを減らし、パフォーマンスを向上させます。

  • フレンドリーな空の状態
    ログがキャプチャされていない場合は、ステータスを示す明確で情報に富んだメッセージが表示されます。


新機能:フルスクリーンプレビューとワンクリックライブURL共有

コラボレーションとデバッグを強化するための2つの主要な使いやすさの改善:

フルスクリーンモード

PlaygroundとSessionsは、フォーカスを保ちながらプレビュー、検査、デバッグするためのフルスクリーン表示をサポートするようになりました。

ワンクリックライブURL共有

今や、PlaygroundまたはライブセッションのライブURLを1クリックで簡単にコピーできるようになりました。チームメンバーやクライアントと簡単に共有でき、ログインや追加設定は不要です。


機能デモ

ネットワーク – ページロードとリクエストの問題を診断

ネットワークパネル(DevToolsに類似)では、各リクエストの読み込み時間とリソースタイプを明確に観察できます。一般的なパフォーマンスボトルネックには以下が含まれます:

  • 大きな画像ファイル: 圧縮されていない高解像度の画像は、ページの読み込み時間を大幅に遅延させる可能性があります。
  • サードパーティのスクリプトの失敗: 失敗したプラグインJSリクエストは、重要なページレンダリングをブロックする可能性があります。
  • 小さすぎるファイルが多すぎる: 数百の小さなリクエストがブラウザのリクエストキューを圧倒し、遅延を引き起こす可能性があります。

このデータを分析することで、重要なリソースを迅速に特定し、最適化して全体的なページパフォーマンスを大幅に改善できます。


レスポンスステータスコードの監視は、問題の根本原因を迅速に特定するのに役立ちます:

  • 404 Not Found: APIエンドポイントが不正です — おそらくパスの間違いやスペルミスによるものです。
  • 500 Internal Server Error: バックエンドでエラーが発生しました — 詳細はサーバーログを確認してください。
  • 400 Bad Request: リクエストパラメータがAPIの予期される形式または構造に合っていません。

Networkパネルはリクエストペイロード、レスポンスボディ、およびエラーメッセージに対する明確な可視性を提供し、API関連の問題を診断するための重要なツールとなります。

Scrapelessでは、適用される法律、規制、およびWebサイトのプライバシーポリシーを厳密に遵守しながら、公開されているデータのみにアクセスします。 このブログのコンテンツは、デモンストレーションのみを目的としており、違法または侵害の活動は含まれません。 このブログまたはサードパーティのリンクからの情報の使用に対するすべての責任を保証せず、放棄します。 スクレイピング活動に従事する前に、法律顧問に相談し、ターゲットウェブサイトの利用規約を確認するか、必要な許可を取得してください。

最も人気のある記事

カタログ