chrome.devtools.network

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"

Pour obtenir une introduction générale à l'utilisation des API DevTools, consultez Résumé des API DevTools.

Présentation

Les informations sur les requêtes réseau sont représentées au format HTTP Archive (HAR). La description du format HAR ne fait pas partie du champ d'application de ce document. Veuillez consulter la spécification HAR v1.2.

En termes de HAR, la méthode chrome.devtools.network.getHAR() renvoie un journal HAR complet, tandis que l'événement chrome.devtools.network.onRequestFinished fournit une entrée HAR comme argument au 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 est possible que certaines requêtes manquent 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 enregistre les URL de toutes les images de plus de 40 Ko à mesure qu'elles sont chargées :

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

        En attente

        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. Pour le moment, seul le format base64 est accepté.

    • Renvoie

      Promise<object>

      En attente

      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 le 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 les spécifications HAR.

Renvoie

  • Promise<object>

    En attente

    Fonction qui reçoit le journal HAR 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.

Événements

onNavigated

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

Déclenché 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