Con tutto questo lavoro svolto al di fuori di window, potresti pensare che sia possibile accedere a Cache istanze solo nell'ambito del service worker. Il fatto è che puoi accedere alle istanze Cache sia nell'ambito del service worker e nel codice tradizionale della tua app web, in esecuzione nell'window. In questo modo è più semplice per l'utente interagire direttamente con la cache di un service worker o aggiornare l'interfaccia utente in base allo stato della cache.
Un possibile caso d'uso è offrire una funzione di salvataggio per le pagine che l'utente potrebbe voler leggere in un secondo momento, pur sapendo che in quel momento potrebbero essere offline. L'incorporamento Glitch di seguito mostra come eseguire questa operazione con Workbox.
Nell'incorporamento riportato sopra, puoi vedere che lo script app.js viene scritto nella cache offline dal contesto window quando fai clic sul pulsante "Salva per offline". Nel service worker, le risorse statiche della pagina vengono pre-memorizzate nella cache per l'accesso offline. Una strategia NetworkOnly viene utilizzata con un gestore speciale che gestisce l'accesso offline per le pagine memorizzate nella cache e viene trasmessa a un NavigationRoute.
Per testare la funzionalità nell'incorporamento di Glitch:
- Apri una nuova finestra del browser e vai all'indirizzo https://save-for-offline-test.glitch.me/
- Fai clic sul pulsante Aggiungi all'elenco di lettura offline.
- Apri gli strumenti per sviluppatori del tuo browser in Firefox o Chrome. Se utilizzi Chrome, vai al riquadro dell'applicazione. In Firefox, vai al riquadro di archiviazione.
- Negli strumenti per sviluppatori di entrambi i browser, nel riquadro a sinistra è presente l'elemento Memoria cache. Fai clic per espanderla. Nella voce offline-cache dovresti vedere l'URL della pagina appena aggiunto nel riquadro a destra.
- Fai clic sul link a qualsiasi altra pagina nella parte inferiore della pagina.
- Attiva/disattiva la modalità offline in uno dei browser per simulare una connessione offline.
- Fai clic sul link della pagina aggiunta alla cache offline. Dovrebbe essere visualizzato anche se sei offline.
- Fai clic sul link di una pagina che non hai aggiunto alla cache offline. La richiesta avrà esito negativo.
Questo non è l'unico caso d'uso per lavorare con istanze Cache in window. Ad esempio, potresti precaricare e memorizzare nella cache in modo predittivo gli asset che sai che l'utente dovrà eseguire un'azione specifica. Ciò ridurrebbe o eviterà la latenza del download di questi asset on demand.
Esistono altri casi d'uso potenzialmente utili e, poiché puoi interagire con le istanze Cache in assenza di un service worker, non è necessario installarne tutti per tutti.