browser.devtools.network

說明

使用 chrome.devtools.network API 擷取開發人員工具在「網路」面板中顯示的網路要求相關資訊。

網路要求資訊會以 HTTP 封存格式 (HAR) 表示。HAR 的說明不在本文件範圍內，請參閱 HAR v1.2 規格。

就 HAR 而言，browser.devtools.network.getHAR() 方法會傳回整個 HAR 記錄，而 browser.devtools.network.onRequestFinished 事件則會提供 HAR 項目做為事件回呼的引數。

請注意，基於效率考量，HAR 不會提供要求內容。您可以呼叫要求的 getContent() 方法來擷取內容。

如果在頁面載入後開啟「開發人員工具」視窗，getHAR() 傳回的項目陣列可能會缺少部分要求。重新載入頁面即可取得所有要求。一般來說，getHAR() 傳回的要求清單應與「網路」面板中顯示的清單相符。

如需開發人員工具 API 的一般使用簡介，請參閱「開發人員工具 API 摘要」。

資訊清單

您必須在資訊清單中宣告下列金鑰，才能使用這個 API。

"devtools_page"

範例

下列程式碼會在載入時，記錄所有大於 40 KB 的圖片網址：

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

如要試用這個 API，請從 chrome-extension-samples 存放區安裝 devtools API 範例。

類型

Request

代表文件資源 (指令碼、圖片等) 的網路要求。請參閱 HAR 規格。

屬性

  • getContent

    void

    傳回回應主體的內容。

    getContent 函式如下所示： 

    () => {...}

    • returns

      Promise<object>

      Chrome 151 以上版本 瀏覽器。*自 Chrome 152 起

      要求完成時接收回應主體的函式。

方法

getHAR()

browser.devtools.network.getHAR(): Promise<object>

傳回包含所有已知網路要求的 HAR 記錄。

傳回

  • Promise<object>

    Chrome 151 以上版本 瀏覽器。*自 Chrome 152 起

    要求完成時接收 HAR 記錄的函式。

事件

onNavigated

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

當檢查的視窗導覽至新頁面時觸發。

參數

  • callback

    函式

    callback 參數如下： 

    (url: string) => void

    • 網址

      字串

onRequestFinished

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

網路要求完成且所有要求資料都可用時，就會觸發。

參數

  • callback

    函式

    callback 參數如下： 

    (request: Request) => void