Hay ciertos libros o PDF que están en Google Drive y podemos leer pero que no podemos descargar para leer sin conexión.
Hoy estaba revisando un PDF compartido en Google Drive (de solo lectura) y me pregunté cómo descargarlo para tenerlo como PDF local sin internet.
Después de experimentar un poco con la forma en la que el PDF se muestra pude notar que al final es un conjunto de imágenes que podemos pintar en un canvas y luego unir en un PDF usando jsPDF
Así que hoy quiero compartirte un script de JavaScript para descargar un PDF de Google Drive que tiene el bloqueo de solo lectura. Haremos la descarga del lado del cliente aprovechando las imágenes que se descargan automáticamente al revisar el documento.
Está de más decirte que no deberías descargar PDF de Google Drive que no te pertenezcan o que sean piratería. Usa esta herramienta para descargar PDF solo lectura de Google Drive bajo tu propia responsabilidad.
Instrucciones
- Accede al enlace del PDF que debe ser algo como https://drive.google.com/file/d/AQUÍ_ALGUNAS_LETRAS_Y_NÚMEROS/view
- Ajusta el zoom a la calidad deseada
- Recorre todo el PDF y asegúrate de que todas sus páginas hayan cargado
- Abre la consola de depuración con F12.
- Pega el siguiente script y presiona Enter:
const jspdfModule = await import('https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js');
async function crearPDF(nombre) {
const { jsPDF } = window.jspdf;
/*Las imágenes del libro tienen el alt en "Página 1 de X" */
const imagenes = document.querySelectorAll('img[alt^="Página"]');
if (imagenes.length === 0) {
console.error("No se encontraron imágenes.");
return;
}
let doc;
const calidadJpeg = 0.95; // Número entre 0 y 1. Entre más grande mejor calidad y más peso
for (let i = 0; i < imagenes.length; i++) {
console.log("Añadiendo página %d de %d", i, imagenes.length);
const img = imagenes[i];
const canvas = document.createElement("canvas");
canvas.width = img.naturalWidth;
canvas.height = img.naturalHeight;
const ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
const imgData = canvas.toDataURL("image/jpeg", calidadJpeg);
const imgW = img.naturalWidth;
const imgH = img.naturalHeight;
const orientacion = imgW > imgH ? 'l' : 'p'; // 'l' landscape, 'p' portrait
if (i === 0) {
// Crear el documento con el tamaño de la primera imagen
doc = new jsPDF({
orientation: orientacion,
unit: 'px',
format: [imgW, imgH]
});
} else {
// Añadir nueva página con el tamaño exacto de la imagen actual
doc.addPage([imgW, imgH], orientacion);
}
doc.addImage(imgData, 'JPEG', 0, 0, imgW, imgH);
}
doc.save(nombre);
}
// Ejecutar
crearPDF("miLibro.pdf");
// Opcional nombre automático
//crearPDF(document.title.replace(" - Google Drive", ""));
En mis pruebas vi que el título de la página siempre es Nombre del archivo.pdf - Google Drive
así que se me ocurrió nombrar el PDF de salida basándome en ese título, simplemente
quitando el - Google Drive.
Como no sé si algún día cambiarán la forma de mostrar el título no lo he dejado en el código, pero si quieres puedes cambiar el código fuente para que el título del PDF se escriba automáticamente. Para ello en lugar de:
crearPdf("miLibro.pdf")
Usa:
crearPDF(document.title.replace(" - Google Drive", ""));
De hecho en el código original he dejado esto comentado