chrome.devtools.network

Descrizione

Utilizza l'API chrome.devtools.network per recuperare le informazioni sulle richieste di rete visualizzate dagli Strumenti per sviluppatori nel riquadro Rete.

Manifest

Per utilizzare questa API, è necessario dichiarare le seguenti chiavi nel manifest.

"devtools_page"

Per un'introduzione generale all'utilizzo delle API degli Strumenti per sviluppatori, consulta il riepilogo delle API degli Strumenti per sviluppatori.

Panoramica

Le informazioni sulle richieste di rete sono rappresentate nel formato HTTP Archive (HAR). La descrizione di HAR non rientra nell'ambito di questo documento. Per maggiori informazioni, consulta la specifica HAR v1.2.

In termini di HAR, il metodo chrome.devtools.network.getHAR() restituisce l'intero log HAR, mentre l'evento chrome.devtools.network.onRequestFinished fornisce HAR entry come argomento al callback dell'evento.

Tieni presente che i contenuti delle richieste non vengono forniti come parte di HAR per motivi di efficienza. Puoi chiamare il metodo getContent() della richiesta per recuperare i contenuti.

Se la finestra degli Strumenti per sviluppatori viene aperta dopo il caricamento della pagina, alcune richieste potrebbero mancare nell'array di voci restituito da getHAR(). Ricarica la pagina per visualizzare tutte le richieste. In generale, l'elenco delle richieste restituito da getHAR() deve corrispondere a quello visualizzato nel riquadro Rete.

Esempi

Il seguente codice registra gli URL di tutte le immagini di dimensioni superiori a 40 KB durante il caricamento:

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

Per provare questa API, installa gli esempi di API degli Strumenti per sviluppatori dal repository chrome-extension-samples.

Tipi

Request

Rappresenta una richiesta di rete per una risorsa di documento (script, immagine e così via). Per riferimento, consulta la specifica HAR.

Proprietà

  • getContent

    void

    Promise

    Restituisce i contenuti del corpo della risposta.

    La funzione getContent ha il seguente aspetto: 

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

    • callback

      function optional

      Il parametro callback ha il seguente aspetto: 

      (response: object) => void

      • response

        oggetto

        Chrome 151+

        Un oggetto contenente il corpo della risposta e la relativa codifica.

        • content

          stringa

          Contenuti del corpo della risposta (potenzialmente codificati).

        • encoding

          stringa

          Vuoto se i contenuti non sono codificati, altrimenti nome della codifica. Al momento è supportata solo la codifica base64.

    • returns

      Promise<object>

      Chrome 151+

      Una funzione che riceve il corpo della risposta al completamento della richiesta.

      Le promesse sono supportate solo per Manifest V3 e versioni successive, le altre piattaforme devono utilizzare i callback.

Metodi

getHAR()

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

Restituisce il log HAR contenente tutte le richieste di rete note.

Parametri

  • callback

    function optional

    Il parametro callback ha il seguente aspetto: 

    (harLog: object) => void

    • harLog

      oggetto

      Un log HAR. Per maggiori dettagli, consulta la specifica HAR.

Resi

  • Promise<object>

    Chrome 151+

    Una funzione che riceve il log HAR al completamento della richiesta.

    Le promesse sono supportate solo per Manifest V3 e versioni successive, le altre piattaforme devono utilizzare i callback.

Eventi

onNavigated

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

Attivato quando la finestra ispezionata passa a una nuova pagina.

Parametri

  • callback

    funzione

    Il parametro callback ha il seguente aspetto: 

    (url: string) => void

    • url

      stringa

onRequestFinished

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

Attivato quando una richiesta di rete è terminata e tutti i dati della richiesta sono disponibili.

Parametri

  • callback

    funzione

    Il parametro callback ha il seguente aspetto: 

    (request: Request) => void