How to Print a PDF from the Browser

How to print a PDF from the browser

The way google docs does it is by embedding JavaScript into the PDF that tells Acrobat Reader or any other compliant reader to print it.

You would need a PDF toolkit to do this with a random PDF.

Way to print pdf directly from web application

It was possible with some old version of Adobe Reader to automate printing of local PDF documents but it is not considered as good practice to print without user's consent. You should better consider displaying the instruction to print the PDF document as either separated page or as an iframe on the same page.

added from comments on March 25, 2016: Google Cloud Print may help to automate the printing by sending documents remotely to the previously configured printer(s). See the official API reference and open-source applications on Github

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.

How to send the PDF output to browser print option (CTRL+P)

You need something like the example below. You would need to intercept print request (print automatically on page load, print button click, etc.) and then call printTrigger function.

<html>
<head>
<title>Print PDF</title>
<script>
function printTrigger(elementId) {
var getMyFrame = document.getElementById(elementId);
getMyFrame.focus();
getMyFrame.contentWindow.print();
}
</script>
</head>

<body>
<iframe id="iFramePdf" src="http://pdfurl.com/sample.pdf"></iframe>
...
</body>
</html>

Print embedded PDF from browser with Javascript, HTML5, AngularJS

Also answered here: Print Pdf from javascript embed tag

I'm going to post what I learned here after a lot of research for anyone in the future who might find this.

PDF's are displayed differently based on browser, browser version, browser configuration, and Operating System. There are a lot of variables so I'll talk about the most common situations here.

  • On all browsers I was unable to call any sort of print() method through Javascript, I was only able to use PdfActions. The OPENACTION would call print. I embedded these into the PDF using iText.

  • Chrome uses Adobe's viewer, which doesn't give access to any sort of print() method but does execute PdfActions embedded in the PDF. So you can embed an 'OpenAction' in a PDF and have the PDF call print whenever it's opened from any application that looks at those actions.

  • Firefox (above a certain version, all recent versions though) uses the Adobe viewer in Windows, which also recognizes PdfActions. However, in OSX it loses support for the Adobe viewer and switches to the baked in Firefox viewer (pdf.js). Which does not support PdfActions.

  • IE: I didn't really test much on IE. Mostly because I gave up on printing PDF's from Javascript after Firefox didn't work on OSX (a req. for me).

My PDF's were being generated by a server that I control so I ended up making service changes in my server and adding a get PNG service that generated a PNG based on the same markup that the PDF generation uses. Browsers handle images much better than PDFs, which I knew going in, but hoped that I would just be able to re-use the PDF generation service since it's used elsewhere in my code.

It doesn't answer the question, but it's all the information I have. My suggestion to anyone who might find this in the future: ditch PDF if possible in this case and go simpler. Otherwise, please update this question if you know how to call print() through Javascript in FF preview pdf viewer in OSX.

-Phil

Automatic print pdf file on chrome or firefox (both lastest version) using javascript

I have found the solution to the problem

In Chrome:

  • step 1:

config run chrome silent printing on mode --kiosk-printing edit target on chrome shortcut properties
Ex:"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --kiosk-printing "http://localhost:8080/this"

  • step 2:

code

var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
iframe.style.display = 'none';
iframe.onload = function() {
setTimeout(function() {
iframe.focus();
iframe.contentWindow.print();
}, 0);
};
iframe.src = _blobUrl;

In Firefox:

  • step1: config printing silent

goto about:config create new Boolean preference name="print.always_print_silent" Value=true

  • step 2: code

    var myWindow = window.open(_blobUrl, '_blank', 'width=800,height=600');
    myWindow.focus();
    myWindow.print();
    myWindow.close();



Related Topics



Leave a reply



Submit