La sezione Servizi in background di Chrome DevTools è una raccolta di strumenti per le API JavaScript che consentono al tuo sito web di inviare e ricevere aggiornamenti anche quando un utente non ha aperto il tuo sito web. Un servizio in background è funzionalmente simile a un processo in background.
La sezione Servizi in background ti consente di eseguire il debug dei seguenti servizi in background:
- Recupero in background
- Sincronizzazione in background
- Notifiche
- Caricamenti speculativi
- Messaggi push
Chrome DevTools può registrare gli eventi di recupero, sincronizzazione e notifica per tre giorni, anche quando DevTools non è aperto. In questo modo, puoi assicurarti che gli eventi vengano inviati e ricevuti come previsto.
Oltre agli eventi del servizio in background, DevTools può:
- Mostrarti i report che Chrome ha già inviato o sta per inviare utilizzando l'API Reporting.
- Consente di eseguire il debug e testare la cache back-forward con un clic.
Recupero dello sfondo
L'API Background Fetch consente a un service worker di scaricare in modo affidabile risorse di grandi dimensioni, come film o podcast, come servizio in background. Per registrare gli eventi di recupero in background per tre giorni, anche quando DevTools non è aperto:
- Apri DevTools in una pagina che utilizza l'API Background Fetch.
Vai ad Applicazione > Servizi in background > Recupero in background e fai clic su
Registra.
Nella tua pagina, attiva alcune attività di recupero in background. DevTools registra gli eventi nella tabella.
Fai clic su un evento per visualizzarne i dettagli nello spazio sotto la tabella.
Puoi chiudere DevTools e lasciare in esecuzione la registrazione per un massimo di tre giorni. Per interrompere la registrazione, fai clic su
Interrompi.
Sincronizzazione in background
L'API Background Sync consente a un service worker offline di inviare dati a un server una volta che ha ristabilito una connessione a internet affidabile. Per registrare gli eventi di sincronizzazione in background per tre giorni, anche quando DevTools non è aperto:
- Apri DevTools, ad esempio in questa pagina dimostrativa.
Vai ad Applicazione > Servizi in background > Sincronizzazione in background e fai clic su
Registra.
Nella pagina demo, fai clic su Registra sincronizzazione in background per registrare il service worker corrispondente e fai clic su Consenti quando richiesto.
La registrazione del service worker è un'attività di sincronizzazione in background. DevTools registra gli eventi nella tabella.
Fai clic su un evento per visualizzarne i dettagli nello spazio sotto la tabella.
Puoi chiudere DevTools e lasciare in esecuzione la registrazione per un massimo di tre giorni. Per interrompere la registrazione, fai clic su
Interrompi.
(Sperimentale) Mitigazioni del monitoraggio del rimbalzo
L'esperimento Mitigazioni del monitoraggio del rimbalzo in Chrome ti consente di identificare ed eliminare lo stato dei siti che sembrano eseguire il monitoraggio tra siti utilizzando la tecnica di monitoraggio del rimbalzo. Puoi forzare manualmente le mitigazioni del monitoraggio e visualizzare un elenco dei siti i cui stati sono stati eliminati.
Per forzare le mitigazioni del monitoraggio:
- Blocca i cookie di terze parti in Chrome. Vai a
> Impostazioni > 
Privacy e sicurezza > Cookie e altri dati dei siti > 
Blocca cookie di terze parti e attivala. - In
chrome://flags, imposta l'esperimento Mitigazioni del monitoraggio del rimbalzo su Attivato con eliminazione. - Apri DevTools e vai a Applicazione > Servizi in background > Mitigazioni del monitoraggio del rimbalzo.
- Fai clic su un link di rimbalzo e attendi 10 secondi che Chrome registri il rimbalzo. La scheda Problemi ti avvisa dell'imminente eliminazione dello stato.
- Fai clic su Forza esecuzione per eliminare immediatamente lo stato.
Notifiche
Dopo che un service worker ha ricevuto un messaggio push da un server, il service worker utilizza l'API Notifications per mostrare i dati a un utente. Per registrare le notifiche per tre giorni, anche quando DevTools non è aperto:
- Apri DevTools
Vai ad Applicazione > Servizi in background > Notifiche e fai clic su
Registra.
Fai clic su Programma notifica e Consenti quando richiesto.
Attendi che venga visualizzata la notifica. DevTools registra gli eventi di notifica nella tabella.
Fai clic su un evento per visualizzarne i dettagli nello spazio sotto la tabella.
Puoi chiudere DevTools e lasciare in esecuzione la registrazione per un massimo di tre giorni. Per interrompere la registrazione, fai clic su
Interrompi.
Caricamenti speculativi
I caricamenti speculativi consentono un caricamento della pagina quasi istantaneo in base alle regole di speculazione che definisci. In questo modo, il tuo sito web può precaricare e prerenderizzare la maggior parte delle pagine visitate.
Il prefetch recupera una risorsa in anticipo, mentre il prerendering va oltre e esegue il rendering dell'intera pagina in un processo di rendering in background nascosto.
Puoi eseguire il debug dei caricamenti speculativi nella sezione Applicazione > Servizi in background > Caricamenti speculativi. La sezione contiene tre visualizzazioni:
- Caricamenti speculativi. Contiene lo stato speculativo per la pagina corrente, l'URL corrente, le pagine che la pagina corrente tenta di caricare in modo speculativo e i relativi stati.
- Regole. Contiene i set di regole nella pagina corrente nel riquadro Elementi e lo stato generale delle speculazioni.
- Speculazioni. Contiene una tabella con informazioni sui tentativi di caricamento speculativo e i relativi stati. Se un tentativo non è riuscito, puoi fare clic sulla riga corrispondente nella tabella per visualizzare informazioni dettagliate e il motivo dell'errore.
Prova a eseguire il debug dei caricamenti speculativi in questa pagina demo di prerendering:
Apri DevTools nella pagina e vai a Applicazione > Servizi in background > Caricamenti speculativi. Se non riesci a visualizzare alcun caricamento speculativo avviato dalla pagina, ricaricala.
La pagina iniziale della demo esegue il prerendering di due pagine e non riesce a eseguire il prerendering di una. Fai clic su Visualizza tutte le speculazioni.
In Speculazioni, seleziona la speculazione con lo stato Errore per visualizzare la Motivazione dell'errore nella sezione con informazioni dettagliate in basso.
In questo caso, il prerendering non è riuscito perché non è presente una pagina
/next3.htmlsul sito web.Se vuoi, per filtrare la tabella nella scheda Speculazioni, digita liberamente un valore nella barra dei filtri in alto o utilizza uno dei filtri con chiave:
url:VALUE,action:VALUEoaction:VALUE.
Apri la sezione Regole e fai clic su Stato per visualizzare l'insieme di regole in basso. Se fai clic sul link Set di regole, si apre il riquadro Elementi e viene mostrato dove è definita la regola di speculazione.
Per una procedura più dettagliata, vedi Debug delle regole di speculazione.
Messaggi push
Per mostrare una notifica push a un utente, un service worker deve prima utilizzare l'API Push Message per ricevere dati da un server. Quando il service worker è pronto a visualizzare la notifica, utilizza l'API Notifications. Per registrare i messaggi push per tre giorni, anche quando DevTools non è aperto:
- Apri DevTools, ad esempio in questa pagina dimostrativa.
Vai ad Applicazione > Servizi in background > Messaggistica push e fai clic su
Registra.
Nella pagina demo, attiva/disattiva l'opzione Attiva notifiche push, fai clic su Consenti quando ti viene chiesto, digita un messaggio e invialo. DevTools registra gli eventi di notifica push nella tabella.
Fai clic su un evento per visualizzarne i dettagli nello spazio sotto la tabella.
Puoi chiudere DevTools e lasciare in esecuzione la registrazione per un massimo di tre giorni. Per interrompere la registrazione, fai clic su
Interrompi.
API di reporting
Alcuni errori si verificano solo in produzione. Non li vedi mai localmente o durante lo sviluppo perché utenti, reti e dispositivi reali cambiano le regole del gioco.
Ad esempio, supponiamo che il tuo nuovo sito si basi su software di terze parti che utilizza document.write() per caricare script critici. I nuovi utenti di tutto il mondo aprono il tuo sito, ma potrebbero avere connessioni più lente rispetto a quelle con cui hai eseguito i test. A tua insaputa, il tuo sito inizia a non funzionare per loro perché Chrome interviene contro document.write() sulle reti lente. In alternativa, potresti tenere d'occhio le API deprecate o che verranno presto ritirate che il tuo codebase potrebbe utilizzare.
L'API Reporting è progettata per aiutarti a monitorare le chiamate API ritirate, le violazioni della sicurezza della tua pagina e altro ancora. Puoi configurare i report come descritto in Monitorare l'applicazione web con l'API Reporting.
Per visualizzare i report generati da una pagina:
Apri DevTools e vai ad Applicazione > Servizi in background > API Reporting.
La scheda API di reporting è suddivisa in tre parti:
- La tabella Report con le seguenti informazioni su ogni report:
- URL che ha causato la generazione del report
- Tipo di violazione
- Statoreport
- Endpoint Destinazione
- Timestamp Generato il giorno
- Corpo della segnalazione
- La sezione di anteprima Corpo del report. Per visualizzare l'anteprima del corpo di un report, fai clic su un report nella tabella dei report.
- La sezione Endpoint con una panoramica di tutti gli endpoint configurati nell'intestazione
Reporting-Endpoints.
Stato del report
La colonna Stato indica se Chrome ha inviato il report correttamente, sta per inviarlo o non è riuscito a inviarlo.
| Stato | Descrizione |
|---|---|
Success |
Il browser ha inviato il report e l'endpoint ha risposto con un codice di esito positivo (200 o un altro codice di risposta di esito positivo 2xx). |
Pending |
Il browser sta tentando di inviare il report. |
Queued |
Il report è stato generato e il browser non sta ancora tentando di inviarlo. Un report viene visualizzato come Queued in uno di questi due casi:
|
MarkedForRemoval |
Dopo aver riprovato per un po' (Queued), il browser ha smesso di tentare di inviare il report e lo rimuoverà presto dall'elenco dei report da inviare. |
I report vengono rimossi dopo un po' di tempo, indipendentemente dal fatto che siano stati inviati correttamente o meno.
Contesto del report sugli arresti anomali
Con l'API Reporting, puoi configurare il tuo sito web in modo che segnali gli arresti anomali a un endpoint server crash-reporting o default. Un report sugli arresti anomali può includere un'interfaccia CrashReportContext che ti consente di registrare dati arbitrari relativi agli arresti anomali in coppie chiave-valore per il contesto di navigazione di primo livello corrente.
Nella scheda Applicazione > Servizi in background > API di reporting > Contesto report arresti anomali, puoi esaminare i dati di contesto degli arresti anomali e filtrare per chiave o valore nella barra dei filtri in alto.
Sessioni associate al dispositivo
Le credenziali di sessione associate al dispositivo (DBSC) sono un'API web e un protocollo tra user agent e server che mirano a impedire il furto di cookie consentendo a un user agent di rivendicare il possesso di una chiave privata archiviata in modo sicuro.
Per visualizzare le sessioni associate al dispositivo, le relative definizioni e gli eventi:
- Apri DevTools in una pagina che utilizza le credenziali di sessione associate al dispositivo.
- Vai ad Applicazione > Servizi in background > Sessioni associate al dispositivo.
Nella barra laterale a sinistra, espandi un sito per visualizzarne le sessioni attive. Seleziona una sessione per visualizzarne la definizione.
La tabella Eventi registra gli eventi di credenziali di sessione associate al dispositivo: creazione, aggiornamento, verifica e terminazione. Per mantenere l'elenco degli eventi durante la navigazione nelle pagine, seleziona check_box Conserva log.
Nella tabella Eventi, seleziona un evento per visualizzarne i dettagli.
Se un evento non va a buon fine, vedrai il messaggio
Errornella colonna Risultato. Seleziona l'evento non riuscito per visualizzarne i dettagli, il codice di errore della risposta e la causa dell'errore.
La sezione Sessioni associate al dispositivo nella barra laterale potrebbe evidenziare i seguenti problemi:
- Sessioni terminate: indicate da una linea orizzontale e da un'icona di database disattivato nella barra laterale.
- Eventi non riusciti: evidenziati con un'icona di avviso. L'elemento Nessuna sessione acquisisce gli eventi non riusciti collegati a un sito, ma non a una sessione nota.