chrome.devtools.network

refresh date: 2026-09-25 robots: noindex

Descripción

Usa la API de chrome.devtools.network para recuperar la información sobre las solicitudes de red que muestran las Herramientas para desarrolladores en el panel de redes.

Manifiesto

Las siguientes claves se deben declarar en el manifiesto para usar esta API.

"devtools_page"

Consulta el resumen de las APIs de Herramientas para desarrolladores para obtener una introducción general al uso de las APIs de Herramientas para desarrolladores.

Descripción general

La información de las solicitudes de red se representa en el formato de archivo HTTP (HAR). La descripción de HAR está fuera del alcance de este documento. Consulta la especificación de HAR v1.2.

En términos de HAR, el método chrome.devtools.network.getHAR() devuelve todo el registro de HAR, mientras que el evento chrome.devtools.network.onRequestFinished proporciona la entrada de HAR como argumento para la devolución de llamada del evento.

Ten en cuenta que, por motivos de eficiencia, el contenido de la solicitud no se proporciona como parte del HAR. Puedes llamar al método getContent() de la solicitud para recuperar el contenido.

Si la ventana de Herramientas para desarrolladores se abre después de que se carga la página, es posible que falten algunas solicitudes en el array de entradas que devuelve getHAR(). Vuelve a cargar la página para obtener todas las solicitudes. En general, la lista de solicitudes que devuelve getHAR() debería coincidir con la que se muestra en el panel de Red.

Ejemplos

El siguiente código registra las URLs de todas las imágenes de más de 40 KB a medida que se cargan:

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) + '"))');
    }
  }
);

Para probar esta API, instala los ejemplos de la API de Herramientas para desarrolladores desde el repositorio chrome-extension-samples.

Tipos

Request

Representa una solicitud de red para un recurso de documento (secuencia de comandos, imagen, etcétera). Consulta la especificación de HAR para obtener más información.

Propiedades

  • getContent

    void

    Promise

    Devuelve el contenido del cuerpo de la respuesta.

    La función getContent se ve de la siguiente manera: 

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

    • callback

      función opcional

      El parámetro callback se ve de la siguiente manera: 

      (response: object) => void

      • respuesta

        objeto

        Chrome 151 y versiones posteriores

        Es un objeto que contiene el cuerpo de la respuesta y su codificación.

        • contenido

          string

          Contenido del cuerpo de la respuesta (potencialmente codificado).

        • encoding

          string

          Está vacío si el contenido no está codificado; de lo contrario, contiene el nombre de la codificación. Actualmente, solo se admite base64.

    • muestra

      Promise<object>

      Chrome 151 y versiones posteriores

      Es una función que recibe el cuerpo de la respuesta cuando se completa la solicitud.

      Las promesas solo se admiten en Manifest V3 y versiones posteriores. Otras plataformas deben usar devoluciones de llamada.

Métodos

getHAR()

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

Muestra el registro HAR que contiene todas las solicitudes de red conocidas.

Parámetros

  • callback

    función opcional

    El parámetro callback se ve de la siguiente manera: 

    (harLog: object) => void

    • harLog

      objeto

      Un registro HAR Consulta la especificación de HAR para obtener más detalles.

Muestra

  • Promise<object>

    Chrome 151 y versiones posteriores

    Es una función que recibe el registro HAR cuando se completa la solicitud.

    Las promesas solo se admiten en Manifest V3 y versiones posteriores. Otras plataformas deben usar devoluciones de llamada.

Eventos

onNavigated

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

Se activa cuando la ventana inspeccionada navega a una página nueva.

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    (url: string) => void

    • url

      string

onRequestFinished

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

Se activa cuando finaliza una solicitud de red y todos los datos de la solicitud están disponibles.

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    (request: Request) => void