- Open the document in Google Docs
- Scroll to the bottom of the document, so all the pages are present
- Open Developer Tools on separate window and choose the Console tab
- Paste the code
- Have fun!
-
-
Save dpaluy/74258794f7930401cc27262e0ea794dd to your computer and use it in GitHub Desktop.
| 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); | |
| let imgData = can.toDataURL("image/jpeg", 1.0); | |
| pdf.addImage(imgData, 'JPEG', 0, 0); | |
| pdf.addPage(); | |
| } | |
| pdf.save("download.pdf"); | |
| }; | |
| jspdf.src = 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js'; | |
| document.body.appendChild(jspdf); |
Script Overview
This script dynamically loads the jsPDF library and generates a PDF document from all elements on the page that use blob: URLs (typically rendered slide images in a viewer).
For each image:
- It waits until the image is fully loaded.
- Draws it onto a temporary .
- Converts the canvas to an image (JPEG/PNG).
- Inserts the image into a PDF.
- Adds a new page for each slide.
- Automatically downloads the generated download.pdf.
Improvements Made
-
Landscape Orientation Support
The PDF is now created in landscape mode when the slide width is greater than its height. -
Dynamic Page Size Matching
Each PDF page is generated using the exact dimensions of the slide image, preventing cropping, distortion, or incorrect scaling. -
Correct Page Handling
Page creation is based on the filtered list of relevant images (not alltags in the DOM), ensuring accurate page breaks.
-
Image Load Safety
The script now waits for each image to fully load before processing, preventing blank or incomplete pages. -
Updated jsPDF Version
The script uses a modern jsPDF version (2.5.1) instead of the outdated 1.3.2 release. -
Optional A4 Landscape Scaling Variant
An alternative version supports fixed A4 landscape format with proportional scaling to fit slides within standard paper dimensions.
Code
(async () => {
let trustedURL;
if (window.trustedTypes && trustedTypes.createPolicy) {
const policy = trustedTypes.createPolicy('myPolicy', { createScriptURL: (input) => input });
trustedURL = policy.createScriptURL('https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js');
} else {
trustedURL = 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js';
}
const loadScript = (src) =>
new Promise((resolve, reject) => {
const s = document.createElement("script");
s.onload = resolve;
s.onerror = reject;
s.src = src;
document.body.appendChild(s);
});
await loadScript(trustedURL);
const { jsPDF } = window.jspdf;
const imgs = Array.from(document.getElementsByTagName("img"))
.filter(img => /^blob:/.test(img.src));
if (!imgs.length) return;
const pdf = new jsPDF({ orientation: "landscape", unit: "pt", format: "a4", compress: true });
const pageW = pdf.internal.pageSize.getWidth();
const pageH = pdf.internal.pageSize.getHeight();
let pageIndex = 0;
for (const img of imgs) {
if (!img.complete || img.naturalWidth === 0) {
await new Promise((r) => img.addEventListener("load", r, { once: true }));
}
const w = img.naturalWidth || img.width;
const h = img.naturalHeight || img.height;
const canvas = document.createElement("canvas");
canvas.width = w;
canvas.height = h;
const ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, w, h);
const imgData = canvas.toDataURL("image/jpeg", 0.92);
if (pageIndex > 0) pdf.addPage();
// Вписываем в A4 landscape без искажений (с полями, если нужно)
const ratio = Math.min(pageW / w, pageH / h);
const drawW = w * ratio;
const drawH = h * ratio;
const x = (pageW - drawW) / 2;
const y = (pageH - drawH) / 2;
pdf.addImage(imgData, "JPEG", x, y, drawW, drawH);
pageIndex++;
}
pdf.save("download.pdf");
})();
amazing!!! worked well for me!
amazing, it completely worked very awesome! Many thank bro!!1
I've created a script that better handles orientation and is fully documented. I tested it and it works perfectly. Just make sure to render all pages in full resolution before downloading. You can do that by zooming in and scrolling through each page until they all load at full resolution. The PDF is downloaded as a set of images so text and table recognition and autofill will not work. If your PDF viewer has OCR, copying text may work but it will probably be buggy. And obviously this is for educational purposes only and should not be used to infringe on any copyright or do anything illegal.
https://github.com/karimelmasry42/google-drive-view-only-pdf-downloader
Not working, unfortunately