H. public / sw.js

1
/* Este archivo debe estar colocado en la carpeta raíz del sitio.
2
 * 
3
 * Cualquier cambio en el contenido de este archivo hace que el service
4
 * worker se reinstale. */
5
6
/**
7
 * Cambia el número de la versión cuando cambia el contenido de los
8
 * archivos.
9
 * 
10
 * El número a la izquierda del punto (.), en este caso <q>1</q>, se
11
 * conoce como número mayor y se cambia cuando se realizan
12
 * modificaciones grandes o importantes.
13
 * 
14
 * El número a la derecha del punto (.), en este caso <q>00</q>, se
15
 * conoce como número menor y se cambia cuando se realizan
16
 * modificaciones menores.
17
 */
18
const VERSION = "1.0"
19
20
/**
21
 * Nombre de la carpeta de caché.
22
 */
23
const CACHE = "pwamd"
24
25
/**
26
 * Archivos requeridos para que la aplicación funcione fuera de
27
 * línea.
28
 */
29
const ARCHIVOS = [
30
 "ayuda.html",
31
 "css/estilos.css",
32
 "css/material-symbols-outlined.css",
33
 "css/transicion_pestanas.css",
34
 "favicon.ico",
35
 "fonts/MaterialSymbolsOutlined[FILL,GRAD,opsz,wght].codepoints",
36
 "fonts/MaterialSymbolsOutlined[FILL,GRAD,opsz,wght].ttf",
37
 "fonts/MaterialSymbolsOutlined[FILL,GRAD,opsz,wght].woff2",
38
 "fonts/Roboto-Italic-VariableFont_wdth,wght.ttf",
39
 "fonts/Roboto-VariableFont_wdth,wght.ttf",
40
 "img/icono2048.png",
41
 "img/maskable_icon.png",
42
 "img/maskable_icon_x128.png",
43
 "img/maskable_icon_x192.png",
44
 "img/maskable_icon_x384.png",
45
 "img/maskable_icon_x48.png",
46
 "img/maskable_icon_x512.png",
47
 "img/maskable_icon_x72.png",
48
 "img/maskable_icon_x96.png",
49
 "img/screenshot_horizontal.png",
50
 "img/screenshot_vertical.png",
51
 "index.html",
52
 "js/nav-tab-fixed.js",
53
 "js/registraServiceWorker.js",
54
 "libclienteweb/abreElementoHtml.js",
55
 "libclienteweb/cierraElementoHtmo.js",
56
 "libclienteweb/ES_APPLE.js",
57
 "libclienteweb/getAttribute.js",
58
 "libclienteweb/manejaErrores.js",
59
 "libclienteweb/muestraError.js",
60
 "libclienteweb/muestraTextoDeAyuda.js",
61
 "libclienteweb/ProblemDetailsError.js",
62
 "libclienteweb/querySelector.js",
63
 "libclienteweb/resaltaSiEstasEn.js",
64
 "libmde/md-app-bar.js",
65
 "libmde/md-filled-button.css",
66
 "libmde/md-filled-text-field.css",
67
 "libmde/md-list.css",
68
 "libmde/md-menu.css",
69
 "libmde/md-options-menu.js",
70
 "libmde/md-outline-button.css",
71
 "libmde/md-select-menu.js",
72
 "libmde/md-tab.css",
73
 "material-tokens/css/baseline.css",
74
 "material-tokens/css/colors.css",
75
 "material-tokens/css/elevation.css",
76
 "material-tokens/css/motion.css",
77
 "material-tokens/css/palette.css",
78
 "material-tokens/css/shape.css",
79
 "material-tokens/css/state.css",
80
 "material-tokens/css/theme/dark.css",
81
 "material-tokens/css/theme/light.css",
82
 "material-tokens/css/typography.css",
83
 "select.html",
84
 "site.webmanifest",
85
 "ungap/es.js",
86
 "/"
87
]
88
89
// Verifica si el código corre dentro de un service worker.
90
if (self instanceof ServiceWorkerGlobalScope) {
91
 // Evento al empezar a instalar el servide worker,
92
 self.addEventListener("install",
93
  (/** @type {ExtendableEvent} */ evt) => {
94
   console.log("El service worker se está instalando.")
95
   evt.waitUntil(llenaElCache())
96
  })
97
98
 // Evento al solicitar información a la red.
99
 self.addEventListener("fetch", (/** @type {FetchEvent} */ evt) => {
100
  if (evt.request.method === "GET") {
101
   evt.respondWith(buscaLaRespuestaEnElCache(evt))
102
  }
103
 })
104
105
 // Evento cuando el service worker se vuelve activo.
106
 self.addEventListener("activate",
107
  () => console.log("El service worker está activo."))
108
}
109
110
async function llenaElCache() {
111
 console.log("Intentando cargar caché:", CACHE)
112
 // Borra todos los cachés.
113
 const keys = await caches.keys()
114
 for (const key of keys) {
115
  await caches.delete(key)
116
 }
117
 // Abre el caché de este service worker.
118
 const cache = await caches.open(CACHE)
119
 // Carga el listado de ARCHIVOS.
120
 await cache.addAll(ARCHIVOS)
121
 console.log("Cache cargado:", CACHE)
122
 console.log("Versión:", VERSION)
123
}
124
125
/** @param {FetchEvent} evt */
126
async function buscaLaRespuestaEnElCache(evt) {
127
 // Abre el caché.
128
 const cache = await caches.open(CACHE)
129
 const request = evt.request
130
 /* Busca la respuesta a la solicitud en el contenido del caché, sin
131
  * tomar en cuenta la parte después del símbolo "?" en la URL. */
132
 const response = await cache.match(request, { ignoreSearch: true })
133
 if (response === undefined) {
134
  /* Si no la encuentra, empieza a descargar de la red y devuelve
135
   * la promesa. */
136
  return fetch(request)
137
 } else {
138
  // Si la encuentra, devuelve la respuesta encontrada en el caché.
139
  return response
140
 }
141
}
skip_previous skip_next