How to send a pdf file directly to the printer using JavaScript?

173,554

Solution 1

I think this Library of JavaScript might Help you:

It's called Print.js

First Include

<script src="print.js"></script>
<link rel="stylesheet" type="text/css" href="print.css">

It's basic usage is to call printJS() and just pass in a PDF document url: printJS('docs/PrintJS.pdf')

What I did was something like this, this will also show "Loading...." if PDF document is too large.

<button type="button" onclick="printJS({printable:'docs/xx_large_printjs.pdf', type:'pdf', showModal:true})">
    Print PDF with Message
</button>

However keep in mind that:

Firefox currently doesn't allow printing PDF documents using iframes. There is an open bug in Mozilla's website about this. When using Firefox, Print.js will open the PDF file into a new tab.

Solution 2

There are two steps you need to take.

First, you need to put the PDF in an iframe.

  <iframe id="pdf" name="pdf" src="document.pdf"></iframe>

To print the iframe you can look at the answers here:

Javascript Print iframe contents only

If you want to print the iframe automatically after the PDF has loaded, you can add an onload handler to the <iframe>:

  <iframe onload="isLoaded()" id="pdf" name="pdf" src="document.pdf"></iframe>

the loader can look like this:

function isLoaded()
{
  var pdfFrame = window.frames["pdf"];
  pdfFrame.focus();
  pdfFrame.print();
}

This will display the browser's print dialog, and then print just the PDF document itself. (I personally use the onload handler to enable a "print" button so the user can decide to print the document, or not).

I'm using this code pretty much verbatim in Safari and Chrome, but am yet to try it on IE or Firefox.

Solution 3

This is actually a lot easier using a dataURI, because you can just call print on the returned window object.

// file is a File object, this will also take a blob
const dataUrl = window.URL.createObjectURL(file);

// Open the window
const pdfWindow = window.open(dataUrl);

// Call print on it
pdfWindow.print();

This opens the pdf in a new tab and then pops the print dialog up.

Solution 4

Try this: Have a button/link which opens a webpage (in a new window) with just the pdf file embedded in it, and print the webpage.

In head of the main page:

<script type="text/javascript">
function printpdf() 
{
myWindow=window.open("pdfwebpage.html");
myWindow.close;  //optional, to close the new window as soon as it opens
//this ensures user doesn't have to close the pop-up manually
}
</script>

And in body of the main page:

<a href="printpdf()">Click to Print the PDF</a>

Inside pdfwebpage.html:

<html>
<head>    
</head>

<body onload="window.print()">
<embed src="pdfhere.pdf"/>

</body>
</html>
Share:
173,554

Related videos on Youtube

Jignesh Manek
Author by

Jignesh Manek

Updated on June 05, 2020

Comments

  • Jignesh Manek
    Jignesh Manek almost 4 years

    How to send a PDF file directly to the printer using JavaScript?

    I found two answers in a forum:

    <embed src="vehinvc.pdf" id = "Pdf1" name="Pdf1" hidden>
    <a onClick="document.getElementById('Pdf1').printWithDialog()" style="cursor:hand;">Print file</a>
    

    and

    <OBJECT id = "Pdf2" name="Pdf2" CLASSID="clsid:CA8A9780-280D-11CF-A24D-444553540000" WIDTH="364" HEIGHT="290">
         <PARAM NAME='SRC' VALUE="file.pdf">
    </OBJECT>
    <a onClick="document.Pdf2.printWithDialog()">Print file</a> 
    

    But my problem is that it just works on IE, and doesnt work in Firefox or Chrome.

    Is there any solution for this?

    • Álvaro González
      Álvaro González over 12 years
      Is this question about Adobe Reader's plug-in API?
    • Jignesh Manek
      Jignesh Manek over 12 years
      i don't think it is about adobe reader's plugin.. because i have the same version of adobe reader in all the browsers.. still this code of JavaScript does not working in just Internet Explorer..
    • Sparky
      Sparky over 12 years
      @Jignesh Manek: I do not believe you are going to find a solution for all browsers. The best you can expect is to bring up the print dialog box and honestly, that should really be good enough. As a user, the last thing I want is to have my printer just start printing something without a chance to check my settings, paper size, tray, etc. Think about it... even most of your various applications, word processors, spreadsheets, etc. simply invoke the print dialog box too.
    • Jignesh Manek
      Jignesh Manek over 12 years
      @Sparky672: yes you are true. but using this code, firefox does not even show the print dialog box..
    • Sparky
      Sparky over 12 years
      @Jignesh Manek: What exactly do you want then? Is it acceptable to just open the Print Dialog box in all browsers? This thread has more info: stackoverflow.com/questions/687675/…
    • Jignesh Manek
      Jignesh Manek over 12 years
      Yes. It is acceptable to just open the Print Dialog box in all browsers.. I tried all the answers in the thread you gave.. but none of them are working with my browser !
    • Sparky
      Sparky over 12 years
  • Jignesh Manek
    Jignesh Manek over 12 years
    again it does nothing in Firefox and Chrome.. and while testing in IE, the main html file contents are sent to printer !!
  • Sparky
    Sparky over 12 years
    The OP did not ask for a PHP solution.
  • Jignesh Manek
    Jignesh Manek over 12 years
    code in my question already works with IE.. i want a fix for firefox and chrome !
  • Jacob Ensor
    Jacob Ensor about 7 years
    I tried this method in Chrome, IE and Firefox but it isn't working as expected. In Chrome I get "pdfFrame.print is not a function". In FF I get "Error: Permission denied to access property "print"". IE gives no error but does not trigger the print dialog. The PDF is on the same origin and X-Frame-Options is set to SAMEORIGIN. Is this method just outdated?
  • Jacob Ensor
    Jacob Ensor about 7 years
    This method doesn't seem to work at all for me. Chrome, IE, and FireFox all act the same way - a print dialog appears but it simply prints the webpage with a small/invisible embedded PDF on it. I need to trigger the PDF print, not the webpage print. Am I missing something?
  • W.M.
    W.M. about 6 years
    Can this library be used to print a PDF bypassing the print dialogue?
  • zsubzwary
    zsubzwary about 6 years
    You should give it a shot, check it out...! I am not certain about that @W.M. !
  • Franz
    Franz almost 4 years
    is this working with other file types like xlsx or docx ?
  • habib
    habib almost 3 years
    @W.M. is print dialogue bypass work for you with this library?