Print PDF directly from JavaScript Print PDF directly from JavaScript javascript javascript

Print PDF directly from JavaScript


Based on comments below, it no longer works in modern browsers
This question demonstrates an approach that might be helpful to you: Silent print an embedded PDF

It uses the <embed> tag to embed the PDF in the document:

<embed    type="application/pdf"    src="path_to_pdf_document.pdf"    id="pdfDocument"    width="100%"    height="100%" />

Then you call the .print() method on the element in Javascript when the PDF is loaded:

function printDocument(documentId) {    var doc = document.getElementById(documentId);    //Wait until PDF is ready to print        if (typeof doc.print === 'undefined') {            setTimeout(function(){printDocument(documentId);}, 1000);    } else {        doc.print();    }}

You could place the embed in a hidden iframe and print it from there, giving you a seamless experience.


Here is a function to print a PDF from an iframe.

You just need to pass the URL of the PDF to the function. It will create an iframe and trigger print once the PDF is load.

Note that the function doesn't destroy the iframe. Instead, it reuses it each time the function is call. It's hard to destroy the iframe because it is needed until the printing is done, and the print method doesn't has callback support (as far as I know).

printPdf = function (url) {  var iframe = this._printIframe;  if (!this._printIframe) {    iframe = this._printIframe = document.createElement('iframe');    document.body.appendChild(iframe);    iframe.style.display = 'none';    iframe.onload = function() {      setTimeout(function() {        iframe.focus();        iframe.contentWindow.print();      }, 1);    };  }  iframe.src = url;}


You can use Print.js (npm install print-js). It's 128kB unpacked and you can find the docs at http://printjs.crabbly.com/.

It doesn't print on IE though, in those cases you'll have to download the PDF instead.

$http({    url: "",    method: "GET",    headers: {        "Content-type": "application/pdf"    },    responseType: "arraybuffer"}).success(function (data, status, headers, config) {    var pdfFile = new Blob([data], {        type: "application/pdf"    });    var pdfUrl = URL.createObjectURL(pdfFile);    //window.open(pdfUrl);    printJS(pdfUrl);    //var printwWindow = $window.open(pdfUrl);    //printwWindow.print();}).error(function (data, status, headers, config) {    alert("Sorry, something went wrong")});