chrome.devtools.network

refresh date: 2026-09-25 robots: noindex

Description

Utilisez l'API chrome.devtools.network pour récupérer les informations sur les requêtes réseau affichées par les outils pour les développeurs dans le panneau Réseau.

Fichier manifeste

Les clés suivantes doivent être déclarées dans le fichier manifeste pour utiliser cette API.

"devtools_page"

Consultez Résumé des API DevTools pour une présentation générale de l'utilisation des API des outils pour les développeurs.

Présentation

Les informations sur les requêtes réseau sont représentées au format HTTP Archive (HAR). La description de HAR n'entre pas dans le cadre de ce document. Veuillez vous reporter à la spécification HAR v1.2.

En termes de HAR, la méthode chrome.devtools.network.getHAR() renvoie l'intégralité du journal HAR, tandis que l'événement chrome.devtools.network.onRequestFinished fournit l'entrée HAR en tant qu'argument du rappel d'événement.

Notez que le contenu de la requête n'est pas fourni dans le fichier HAR pour des raisons d'efficacité. Vous pouvez appeler la méthode getContent() de la requête pour récupérer le contenu.

Si la fenêtre "Outils de développement" est ouverte après le chargement de la page, il se peut que certaines requêtes soient manquantes dans le tableau des entrées renvoyées par getHAR(). Actualisez la page pour obtenir toutes les requêtes. En général, la liste des requêtes renvoyées par getHAR() doit correspondre à celle affichée dans le panneau "Réseau".

Exemples

Le code suivant consigne les URL de toutes les images de plus de 40 Ko au fur et à mesure de leur chargement :

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

Pour essayer cette API, installez les exemples d'API devtools à partir du dépôt chrome-extension-samples.

Types

Request

Représente une requête réseau pour une ressource de document (script, image, etc.). Pour en savoir plus, consultez la spécification HAR.

Propriétés

  • getContent

    vide

    Promise

    Renvoie le contenu du corps de la réponse.

    La fonction getContent se présente comme suit : 

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

    • callback

      function facultatif

      Le paramètre callback se présente comme suit : 

      (response: object) => void

      • réponse

        objet

        Chrome 151 ou version ultérieure

        Objet contenant le corps de la réponse et son encodage.

        • contenu

          chaîne

          Contenu du corps de la réponse (potentiellement encodé).

        • encoding

          chaîne

          Vide si le contenu n'est pas encodé, nom de l'encodage dans le cas contraire. Actuellement, seul le format base64 est accepté.

    • Renvoie

      Promise<object>

      Chrome 151 ou version ultérieure

      Fonction qui reçoit le corps de la réponse lorsque la requête est terminée.

      Les promesses ne sont compatibles qu'avec Manifest V3 et les versions ultérieures. Les autres plates-formes doivent utiliser des rappels.

Méthodes

getHAR()

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

Renvoie un journal HAR contenant toutes les requêtes réseau connues.

Paramètres

  • callback

    function facultatif

    Le paramètre callback se présente comme suit : 

    (harLog: object) => void

    • harLog

      objet

      Un journal HAR. Pour en savoir plus, consultez la spécification HAR.

Renvoie

  • Promise<object>

    Chrome 151 ou version ultérieure

    Fonction qui reçoit le journal HAR une fois la requête terminée.

    Les promesses ne sont compatibles qu'avec Manifest V3 et les versions ultérieures. Les autres plates-formes doivent utiliser des rappels.

Événements

onNavigated

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

Se déclenche lorsque la fenêtre inspectée accède à une nouvelle page.

Paramètres

  • callback

    fonction

    Le paramètre callback se présente comme suit : 

    (url: string) => void

    • url

      chaîne

onRequestFinished

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

Déclenché lorsqu'une requête réseau est terminée et que toutes les données de la requête sont disponibles.

Paramètres

  • callback

    fonction

    Le paramètre callback se présente comme suit : 

    (request: Request) => void