chrome.devtools.network

说明

您可以使用 chrome.devtools.network API 检索开发者工具在“网络”面板中显示的网络请求的相关信息。

清单

如需使用此 API，您必须在清单中声明以下键。

"devtools_page"

如需大致了解如何使用开发者工具 API，请参阅开发者工具 API 摘要。

概览

网络请求信息以 HTTP 归档格式 (HAR) 表示。本文档不介绍 HAR，如需了解相关信息，请参阅HAR v1.2 规范。

就 HAR 而言，chrome.devtools.network.getHAR() 方法会返回整个 HAR 日志，而 chrome.devtools.network.onRequestFinished 事件会将 HAR 条目 作为实参提供给事件 回调。

请注意，出于效率方面的考虑，请求内容不作为 HAR 的一部分提供。您可以调用请求的 getContent() 方法来检索内容。

如果开发者工具窗口是在页面加载后打开的，则 getHAR() 返回的条目数组中可能会缺少一些请求。请重新加载页面以获取所有请求。一般来说，getHAR() 返回的请求列表应与“网络”面板中显示的列表一致。

示例

以下代码会在加载所有大于 40KB 的图片时记录其网址：

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 代码库安装开发者工具 API 示例。

类型

Request

表示对文档资源（脚本、图片等）的网络请求。如需了解详情，请参阅 HAR 规范。

属性

• getContent

  void

  Promise

  返回响应正文的内容。

  getContent 函数如下所示：

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

  • callback

    function optional

    callback 形参如下所示：

    (response: object) => void

    • response

      object

      Pending

      一个包含响应正文及其编码的对象。

      • content

        string

        响应正文的内容（可能已编码）。

      • encoding

        string

        如果内容未编码，则为空；否则为编码名称。目前只支持 base64。

  • returns

    Promise<object>

    Pending

    一个在请求完成时接收响应正文的函数。

    Promise 仅适用于 Manifest V3 及更高版本，其他平台需要使用回调。

方法

getHAR()

Promise

chrome.devtools.network.getHAR(
  callback?: function,
): Promise<object>

返回包含所有已知网络请求的 HAR 日志。

形参

• callback

  function optional

  callback 形参如下所示：

  (harLog: object) => void

  • harLog

    object

    HAR 日志。如需了解详情，请参阅 HAR 规范。

返回

• Promise<object>

  Pending

  一个在请求完成时接收 HAR 日志的函数。

  Promise 仅适用于 Manifest V3 及更高版本，其他平台需要使用回调。

事件

onNavigated

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

在受检窗口导航到新页面时触发。

形参

• callback

  function

  callback 形参如下所示：

  (url: string) => void

  • url

    string

onRequestFinished

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

在网络请求完成且所有请求数据都可用时触发。

形参

• callback

  function

  callback 形参如下所示：

  (request: Request) => void

  • request

    Request