Skip to content

Instantly share code, notes, and snippets.

@jatubio
Created March 5, 2021 11:58
Show Gist options
  • Save jatubio/34a176fdbbb7a7d5a920c8698a7661bd to your computer and use it in GitHub Desktop.
Save jatubio/34a176fdbbb7a7d5a920c8698a7661bd to your computer and use it in GitHub Desktop.
Download Google Drive protected/view only document
let jspdf = document.createElement("script");
jspdf.onload = function () {
let pdf = new jsPDF();
let elements = document.getElementsByTagName("img");
for (let i in elements) {
let img = elements[i];
console.log("add img ", img);
if (!/^blob:/.test(img.src)) {
console.log("invalid src");
continue;
}
let can = document.createElement('canvas');
let con = can.getContext("2d");
can.width = img.width;
can.height = img.height;
con.drawImage(img, 0, 0, img.width, img.height);
let imgData = can.toDataURL("image/jpeg", 1.0);
pdf.addImage(imgData, 'JPEG', 0, 0);
pdf.addPage();
}
pdf.save("Exported_File.pdf");
};
jspdf.src = 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js';
document.body.appendChild(jspdf);
@5nax
Copy link

5nax commented Aug 21, 2023

// Created by Snax :)
let trustedURL;
if (window.trustedTypes && trustedTypes.createPolicy) {
const policy = trustedTypes.createPolicy('myPolicy', {
createScriptURL: (input) => {
return input;
}
});
trustedURL = policy.createScriptURL('https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js');
} else {
trustedURL = 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js';
}

// Load the jsPDF library using the trusted URL.
let jspdf = document.createElement("script");
jspdf.onload = function() {
// Generate a PDF from images with "blob:" sources.
let pdf = new jsPDF();
let elements = document.getElementsByTagName("img");
for (let i = 0; i < elements.length; i++) {
let img = elements[i];
if (!/^blob:/.test(img.src)) {
continue;
}
let canvasElement = document.createElement('canvas');
let con = canvasElement.getContext("2d");
canvasElement.width = img.width;
canvasElement.height = img.height;
con.drawImage(img, 0, 0, img.width, img.height);
let imgData = canvasElement.toDataURL("image/jpeg", 1.0);
pdf.addImage(imgData, 'JPEG', 0, 0);
if (i !== elements.length - 1) {
pdf.addPage();
}
}

// Download the generated PDF.
pdf.save("download.pdf");

};
jspdf.src = trustedURL;
document.body.appendChild(jspdf);
use this code :)

@ilhamfiles
Copy link

// Created by Snax :) let trustedURL; if (window.trustedTypes && trustedTypes.createPolicy) { const policy = trustedTypes.createPolicy('myPolicy', { createScriptURL: (input) => { return input; } }); trustedURL = policy.createScriptURL('https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js'); } else { trustedURL = 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js'; }

// Load the jsPDF library using the trusted URL. let jspdf = document.createElement("script"); jspdf.onload = function() { // Generate a PDF from images with "blob:" sources. let pdf = new jsPDF(); let elements = document.getElementsByTagName("img"); for (let i = 0; i < elements.length; i++) { let img = elements[i]; if (!/^blob:/.test(img.src)) { continue; } let canvasElement = document.createElement('canvas'); let con = canvasElement.getContext("2d"); canvasElement.width = img.width; canvasElement.height = img.height; con.drawImage(img, 0, 0, img.width, img.height); let imgData = canvasElement.toDataURL("image/jpeg", 1.0); pdf.addImage(imgData, 'JPEG', 0, 0); if (i !== elements.length - 1) { pdf.addPage(); } }

// Download the generated PDF.
pdf.save("download.pdf");

}; jspdf.src = trustedURL; document.body.appendChild(jspdf); use this code :)

How to make the PDF at Finest Quality?

@Kylzeroth
Copy link

Kylzeroth commented Oct 4, 2023

// Created by Snax :) let trustedURL; if (window.trustedTypes && trustedTypes.createPolicy) { const policy = trustedTypes.createPolicy('myPolicy', { createScriptURL: (input) => { return input; } }); trustedURL = policy.createScriptURL('https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js'); } else { trustedURL = 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js'; }

// Load the jsPDF library using the trusted URL. let jspdf = document.createElement("script"); jspdf.onload = function() { // Generate a PDF from images with "blob:" sources. let pdf = new jsPDF(); let elements = document.getElementsByTagName("img"); for (let i = 0; i < elements.length; i++) { let img = elements[i]; if (!/^blob:/.test(img.src)) { continue; } let canvasElement = document.createElement('canvas'); let con = canvasElement.getContext("2d"); canvasElement.width = img.width; canvasElement.height = img.height; con.drawImage(img, 0, 0, img.width, img.height); let imgData = canvasElement.toDataURL("image/jpeg", 1.0); pdf.addImage(imgData, 'JPEG', 0, 0); if (i !== elements.length - 1) { pdf.addPage(); } }

// Download the generated PDF.
pdf.save("download.pdf");

}; jspdf.src = trustedURL; document.body.appendChild(jspdf); use this code :)

this is working like a charm, thanks dude, but not like how the old script since it only give one type of size and resolution,
@5nax ,how can we change the resolution for this code so we can get zoom and get the better quality for the pdf specially small text heavy view only pdfs?
the old one resolution automatically changes as you zoom,

I wish someone could update it or have another code for the 1 tap zoom resolution so that the file was not croppped when zoomed

@cirippo
Copy link

cirippo commented Dec 29, 2023

@ilhamfiles

How to make the PDF at Finest Quality?

@Kylzeroth

this is working like a charm, thanks dude, but not like how the old script since it only give one type of size and resolution, @5nax ,how can we change the resolution for this code so we can get zoom and get the better quality for the pdf specially small text heavy view only pdfs? the old one resolution automatically changes as you zoom,

I wish someone could update it or have another code for the 1 tap zoom resolution so that the file was not croppped when zoomed

See this updated and upgraded script: https://gist.github.com/cirippo/86edfbddc3125eb64ee4b2d8faa52caa

@gjlmotea
Copy link

gjlmotea commented Apr 9, 2024

Working fine in "google drive".
ex: https://drive.google.com/drive/folders/oooooo...
In this folder and right click the file and "preview".

But doesn't work in "google slides".
ex: https://docs.google.com/presentation/d/xxxxxx...
this will download a empty page.

If someone want to download (print) the presentation, you can try to enter "preview" mode.
ex: https://docs.google.com/presentation/d/xxxxxx.../preview
in the Lower Left corner "options > more > download as PDF" (if this file Doesn't Allow "download, print, and copy", then this optnions will be hidden).

@00joel59
Copy link

00joel59 commented May 1, 2024

And how can I download the images?, the screenshots lower their quality a lot.

@LucasToledo88
Copy link

// Created by Snax :) let trustedURL; if (window.trustedTypes && trustedTypes.createPolicy) { const policy = trustedTypes.createPolicy('myPolicy', { createScriptURL: (input) => { return input; } }); trustedURL = policy.createScriptURL('https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js'); } else { trustedURL = 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js'; }

// Load the jsPDF library using the trusted URL. let jspdf = document.createElement("script"); jspdf.onload = function() { // Generate a PDF from images with "blob:" sources. let pdf = new jsPDF(); let elements = document.getElementsByTagName("img"); for (let i = 0; i < elements.length; i++) { let img = elements[i]; if (!/^blob:/.test(img.src)) { continue; } let canvasElement = document.createElement('canvas'); let con = canvasElement.getContext("2d"); canvasElement.width = img.width; canvasElement.height = img.height; con.drawImage(img, 0, 0, img.width, img.height); let imgData = canvasElement.toDataURL("image/jpeg", 1.0); pdf.addImage(imgData, 'JPEG', 0, 0); if (i !== elements.length - 1) { pdf.addPage(); } }

// Download the generated PDF.
pdf.save("download.pdf");

}; jspdf.src = trustedURL; document.body.appendChild(jspdf); use this code :)

download its ok, but the file is empty :(

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment