Automatically Print Image from Website

Question

A coworker and I were having a discussion about what is and isn't possible within the browser.

Then a question came up that neither of us could answer with certainty.

Can you create a webpage such that when you navigate to it, it engages the client-side printer and attempts to print a document. For instance, whenever you visit my personal website, you'll be treated to a print out of a picture of me, smiling.

Now, this is a hideous idea. I'm aware. But the discussion intrigued me as to if it could be done, and how. My friend insisted that the best you could do was pop up the print dialog for the user, they would have to click print themselves.

Would it be possible to bypass this step? Or just some fancy script to move the mouse over the print button and click on it? Or use an activeX control to interface with a Printer API directly?

Solution 1

You have to prompt the user to print the current page, there's no way to bypass this step (possibly in activeX for IE). That said, there's two different ways you could prompt the user to print images of you smiling when the page is loaded.

Here's how to do it in JavaScript.

window.onload = function() {
  var img = window.open("me-smiling.png");
  img.print();
}

And here's how to do it in css/javascript/html (assuming your picture has the id 'me-smiling'): CSS:

@media print {
   * {
     display:none;
   }
   img#me-smiling {
     display:block;
   }
}

Javascript:

 window.onload = function() { window.print() }

Solution 2

The only solution to avoid print dialog that I found was creating a variable on Mozilla Firefox to set auto-print. Maybe is not the best solution if you need to use other browser, but in my case, I only need to print a report automatically and it works:

1- Open Firefox and type "about:config" in the address bar
2- Right click on any preference and select "New" > "Boolean"
3- Add a variable called "print.always_print_silent" with "true" value
4- Restart Firefox.

Hope help you!

Solution 3

AttendStar created a free add-on that suppresses the dialog box and removes all headers and footers for most versions of Firefox.

https://addons.mozilla.org/en-US/firefox/addon/attendprint/

With that feature on you can use $('img').jqprint(); and jqprint for jquery will only print that image automatically called from your web application.

Solution 4

As far as I know, there is no way to print a document directly, without some client intervention, like setting browser flags. In our current project we need to print directly to the default printer, but at least with Chrome you can do it easily with additional startup arguments.

To print directly to the OS default printer you can use:

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --user-data-dir=c:\tmp --kiosk-printing http://www.contoso.com

Another option, which may also be useful, is tos use the native print dialog instead of chromes print preview.

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --user-data-dir=c:\tmp --disable-print-preview http://www.contoso.com

Note, that window.print() and/or Ctrl-P behave accordingly the mentioned settings.

I know, that this does not exactly answers the OPs question, but I think it somewhat related, and for web based enterprise applications this is a quite common use case. Maybe someone find it useful.

For Firefox I recommend Seamless Print Addon

Solution 5

To print to the default printer automatically without seeing a print dialog prompt, I've shared some code in the following question that works in IE7, IE8 and IE9:

Bypass Printdialog in IE9

View more solutions