Come ottenere l'elenco delle richieste di rete fatte da HTML

Question

Come posso ottenere l'elenco delle richieste di rete usando Javascript fatto dall'HTML, come si vede in chrome devtools.

Ad esempio:

Questa è la DevTools per google.com. Voglio, usando javascript ottenere tutte queste richieste in una lista. È possibile? se sì come?

Answer 1

Alcuni browser hanno implementato una versione di not-yet-standard, Resource Timing API in cui è possibile raccogliere alcune di queste informazioni.

Alcuni browser potrebbero avere alcune di queste informazioni disponibili per le estensioni del browser come parte del supporto per gli strumenti di sviluppo, ma ciò richiederebbe l'installazione di un'estensione personalizzata, non qualcosa che potrebbe essere eseguita da una normale pagina Web.

Per operazioni molto specifiche in cui si controlla il codice di chiamata o si conosce il codice di chiamata, è possibile strumentare alcune cose. Ad esempio, se sai che tutte le chiamate ajax passano attraverso una particolare funzione, puoi agganciare quella funzione e sono i gestori di completamento e monitorare tutte le chiamate ajax.

Answer 2

È possibile ottenere gli URL delle richieste da effettuare al caricamento della pagina, ma non è realistico recuperare un qualsiasi tipo di statistica sui tempi di caricamento. Elementi di query che rendono questo tipo di richieste di risorse come script, link o img.

Ad esempio:

var urls = Array.prototype.map.call(
    document.querySelectorAll("link, img, script, iframe"), // Elements which request external resources 
    function(e) { // Loop over and return their href/src 
     return e.href || e.src; 
    } 
); 

Answer 3

È possibile utilizzare Resource Timing API per ottenere tutte le informazioni rilevanti (le ricerche a dominio, colpi di cache, redirect, ecc) su ogni risorsa essere caricate a bordo tuo sito web.

Si può leggere su di esso here. C'è anche un bookmarklet che genera una cascata di caricamento della pagina usando questa API.

API Resource Timing è disponibile in Chrome, Chromium, Chrome Mobile e IE10. Il team di Firefox seems to be working on it.