chrome.devtools.network

説明

デベロッパー ツールの [Network] パネルに表示されるネットワーク リクエストに関する情報を取得するには、chrome.devtools.network API を使用します。

マニフェスト

この API を使用するには、次のキーをマニフェストで宣言する必要があります。

"devtools_page"

デベロッパー ツール API の使用方法の概要については、DevTools API の概要をご覧ください。

概要

ネットワーク リクエスト情報は、HTTP アーカイブ形式(HAR)で表されます。説明 HAR はこのドキュメントの対象外です。HAR v1.2 の仕様をご覧ください。

HAR に関しては、chrome.devtools.network.getHAR() メソッドは HAR ログ全体を返しますが、 chrome.devtools.network.onRequestFinished イベントは、イベントの引数として HAR エントリを提供します。 呼び出すことができます。

効率上の理由から、リクエストのコンテンツは HAR の一部としては提供されません。電話番号 リクエストの getContent() メソッドを使用してコンテンツを取得します。

ページの読み込み後にデベロッパー ツール ウィンドウを開くと、一部のリクエストが getHAR() から返されたエントリの配列。すべてのリクエストを取得するには、ページを再読み込みしてください。一般的に、 getHAR() から返されたリクエストのリストが、[Network] パネルに表示されているリストと一致する必要があります。

次のコードは、40 KB を超えるすべての画像の URL を、読み込み時にログに記録します。

chrome.devtools.network.onRequestFinished.addListener(
  function(request) {
    if (request.response.bodySize > 40*1024) {
      chrome.devtools.inspectedWindow.eval(
          'console.log("Large image: " + unescape("' +
          escape(request.request.url) + '"))');
    }
  }
);

この API を試すには、chrome-extension-samples から devtools API の例をインストールします。 できます。

Request

ドキュメント リソース(スクリプト、画像など)に対するネットワーク リクエストを表します。参考として、HAR 仕様をご覧ください。

プロパティ

  • getContent

    void

    レスポンス本文の内容を返します。

    getContent 関数は次のようになります。

    (callback: function) => {...}

    • callback

      関数

      callback パラメータは次のようになります。

      (content: string, encoding: string) => void

      • コンテンツ

        文字列

        レスポンス本文の内容(エンコードされる場合があります)。

      • encoding

        文字列

        コンテンツがエンコードされていない場合は空になり、それ以外の場合はエンコード名になります。現在サポートされているのは base64 のみです。

メソッド

getHAR()

chrome.devtools.network.getHAR(
  callback: function,
)

既知のすべてのネットワーク リクエストを含む HAR ログを返します。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (harLog: object) => void

    • harLog

      オブジェクト

      HAR ログ。詳しくは、HAR の仕様をご覧ください。

イベント

onNavigated

chrome.devtools.network.onNavigated.addListener(
  callback: function,
)

検査対象のウィンドウが新しいページに移動したときに呼び出されます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (url: string) => void

    • URL

      文字列

onRequestFinished

chrome.devtools.network.onRequestFinished.addListener(
  callback: function,
)

ネットワーク リクエストが終了し、すべてのリクエスト データが利用可能になったときに呼び出されます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (request: Request) => void