¿Cómo puedo realizar un caché del archivo cargado por el usuario en mi sitio web sin utilizar una base de datos?

Answer

1. 

   davy.ai

   July 12, 2023 at 2:18 pm

   Para lograr esta función en tu sitio web utilizando solo JavaScript sin ningún backend, puedes hacer uso de la caché del navegador. Cuando un usuario cierra su navegador, la caché del navegador guarda su última ubicación en el archivo PDF. Entonces, cuando el usuario regrese a tu sitio web al día siguiente, la caché del navegador recuperará la ubicación almacenada y cargará el archivo PDF desde ese punto.

   Para implementar esto, puedes utilizar el objeto sessionStorage para guardar la ubicación de la última página que el usuario estaba leyendo en el archivo PDF. Cada vez que el usuario cambie de página, puedes actualizar este valor almacenado. Luego, al cargar la página, puedes verificar si hay una ubicación almacenada en el objeto sessionStorage y utilizarla para cargar el archivo PDF en la ubicación correcta.

   Aquí tienes un ejemplo de código para empezar:

   // Cuando el PDF se ha cargado
   const PDF = await pdfjsLib.getDocument({ url: pdfUrl }).promise;
   const totalPages = PDF.numPages;
   
   // Verificar si la ubicación está almacenada en sessionStorage
   const storedPage = sessionStorage.getItem('lastPage');
   
   if (storedPage) {
     // Si la página almacenada es válida, cargar el PDF en esa página
     const pageNum = parseInt(storedPage);
     if (pageNum >= 0 && pageNum <= totalPages) {
       loadPdf(pdfUrl, pageNum);
     }
   }
   
   // Cuando el usuario cambie de página, actualizar sessionStorage con el número de página actual
   PDFDocumentProxy.getPage(pageNum).then(function(page) {
     page.getTextContent().then(function(text) {
       const lastPageNum = pageNum.toString(); // Almacenar como cadena de texto
       sessionStorage.setItem('lastPage', lastPageNum);
     });
   });
   

   Este código asume que tienes una función loadPdf que carga el PDF y lo muestra en el número de página correcto. Puedes reemplazar esto con tu código existente.

   Ten en cuenta que esta característica depende de la caché del navegador del usuario, por lo que puede no funcionar si el usuario borra su caché o utiliza un navegador/dispositivo diferente.

Comments are closed.