Feature de caching y prevención de navegación offline - gonzalopoch/UNLP GitHub Wiki

Almacenamiento de páginas candidatas en sessionStorage

Función saveCandidates() en initializeEdition().

Al cargarse el sitio con el script en ejecución, se muestra un popup de confirmación donde se puede seleccionar si el usuario desea almacenar las páginas candidatas en el sessionStorage, de modo que luego pueda navegar en caso de perder la conexión. Si se selecciona la opción positiva, se realizan los pasos listados a continuación:

  • Obtengo las URL de destino de los elementos con tag <a>.
  • Filtro las URL que se correspondan con el dominio actual y que no sean enlaces internos.
  • Mediante una AJAX request de tipo GET, almaceno en el sessionStorage el código HTML de cada una de las páginas correspondientes con las URL obtenidas en el paso anterior. Esto se produce de manera asincrónica, de modo que se detenga la navegación hasta el correcto almacenamiento de los datos.
  • Almaceno en sessionStorage el contenido de la página actual, de forma que también pueda volver a la misma en una hipotética navegación offline.
  • Se notifica al usuario la cantidad de páginas que fueron almacenadas en el sessionStorage y se permite una navegación normal.

Prevención de navegación sin conexión

Función checkStatus() en initializeEdition().

Puesto que la experiencia del usuario debe ser optimizada, se detecta mediante el script si hubo una pérdida de conexión. En ese caso, se interceptan las acciones relacionadas con clicks a los diferentes elementos de tipo <a> de la página actual y los submits en los distintos elementos de tipo <form>. En el primer caso, al hacer click sin conexión se muestra una alerta que dice lo siguiente: 'Error de conexión: desea continuar la navegación?'. Si el usuario decide aceptar, se comprueba si la página de destino href se encuentra almacenada en el sessionStorage. De ser así, se carga el contenido previamente almacenado y se muestra al usuario, con las limitaciones correspondientes al estilo (las hojas de estilos no podrán ser importadas) y sin modificarse la ruta en la barra de direcciones. Para el segundo caso, se muestra una alerta con la siguiente leyenda: 'Submit interceptado: No hay conexión a internet.'.

⚠️ **GitHub.com Fallback** ⚠️