Probarlo
¡Su aplicación está ahora sin conexión capaz! Vamos a probarlo.
Recarga tu página y luego ir al panel de Cache Storage en el panel Application del DevTools. Ampliar la sección y usted debería ver el nombre de su caché de shell de la aplicación aparece en el lado izquierdo. Al hacer clic en su caché de shell de la aplicación puedes ver todos los recursos que ha almacenado en caché en la actualidad.
Ahora, vamos a probar el modo sin conexión. Volver al panel Service Worker de DevTools y activar la casilla de verificación Offline. Después de activar la casilla, usted debe ver unpequeño icono de ADVERTENCIA de color amarillo , junto a la ficha del panel de Network. Esto indica que usted está fuera de línea.
Recarga tu página y... ¡funciona! Tipo de, al menos. Observe cómo carga los datos iniciales (falso).
Si deseas la cláusula else en app.getForecast() entender por qué la aplicación es capaz de cargar los datos falsos.
El siguiente paso es modificar la lógica de trabajador de la aplicación y servicio para poder datos de tiempo de caché y devolver losdatos más recientes de la caché cuando la aplicación está sin conexión.
Consejo: Para comenzar de nuevo y borrar los datos guardados de todo (localStoarge, datos indexedDB, archivos de caché) y quitar los trabajadores de servicio, utilice el panel de almacenamiento claroen la ficha de aplicación.
Try it
Fuente: https://codelabs.developers.google.com/codelabs/your-first-pwapp/#5
No hay comentarios:
Publicar un comentario