Justice47
Justice47

Reputation: 712

Convert PDF to PNG inside browser

I'm using Vue.js and trying to convert PDF to PNG (or another image format) inside browser. Right now I'm able to read PDF from URL with PDF.js and Vue.js component pdfvuer like this:

var self = this;
self.pdfdata = pdfvuer.createLoadingTask(
  "https://any-pdf-link"
);
self.pdfdata.then(pdf => {
  console.log(pdf.numPages)
})

What should I do next to convert it to image?

Upvotes: 6

Views: 4271

Answers (1)

Gaurav Koley
Gaurav Koley

Reputation: 146

Pdfvuer author here.

Pdfvuer/PDF.js renders PDFs as canvas elements. You can use the following code to generate a thumbnail from the first page.

let s = document.querySelectorAll('canvas')[0]
let imageDataUrl = s.toDataURL('img/png')

This will give you a base64 representation of the page.

Upvotes: 4

Related Questions