browser.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.

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. Reportez-vous à la spécification HAR v1.2.

En termes de HAR, la méthode browser.devtools.network.getHAR() renvoie l'intégralité du journal HAR, tandis que l'événement browser.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".

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

Fichier manifeste

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

"devtools_page"

Exemples

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

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

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

    Renvoie le contenu du corps de la réponse.

    La fonction getContent se présente comme suit : 

    () => {...}

    • Renvoie

      Promise<object>

      Navigateur Chrome 151+ * depuis Chrome 152

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

Méthodes

getHAR()

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

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

Renvoie

  • Promise<object>

    Navigateur Chrome 151+ * depuis Chrome 152

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

Événements

onNavigated

browser.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

browser.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