Using window.print() or alternative on Android devices

问题

On Android devices (I have tested Nexus 5, Nexus 10, Galaxy S4 and Galaxy Tab 3), the window.print() command in JavaScript doesn't do anything. As far as I can tell it doesn't even register an error.

I know for a fact that most if not all of these browsers can print because you can use mobile Chrome's menu to choose "print".

Why doesn't window.print() trigger the behavior you would expect (opening the clients print menu)? And is there an Android alternative to window.print()?

回答1:

It is clearly stated in this Documentation, "The command is supported on iOS, Chrome on Windows and Safari and Chrome on Mac. It is not supported on Android."

Android phones don't have native support for printing yet, so window.print() will not work. Which means you need to use third-party app to do the printing. You could find some alternatives in this article.

回答2:

Use Google Cloud Print (GCP) - there is no app required. The user must have set up a printer via GCP though.

This example uses GCP gadget

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Print</title>
    </head>
    <body>
        <div>
            <p>On android devices (I have tested Nexus 5, Nexus 10, Galaxy S4 and Galaxy Tab 3) the window.print() command in javascript doesn't do anything, as far as I can tell it doesn't even register an error.</p>
            <p>I know for a fact that most if not all of these browsers can print because you can use mobile chromes menu to choose "print".  My questions is, why doesn't window.print() trigger the behavior you would expect (opening the clients print menu).
            And is there an android alternative to window.print()?</p>
        </div>

        <div id="gcpPrint"></div>

        <script src="https://www.google.com/cloudprint/client/cpgadget.js">
        </script>

        <script>
            var gadget = new cloudprint.Gadget();
            gadget.setPrintButton(cloudprint.Gadget.createDefaultPrintButton("gcpPrint"));
            gadget.setPrintDocument("text/html", "Print", document.documentElement.innerHTML);
        </script>
    </body>
</html>

回答3:

I'm working on a simular problem and came up with this solution:

$(document).ready(function($) {
  var ua = navigator.userAgent.toLowerCase();
  var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile");

  $('button.print').click(function(e) {
    e.preventDefault();
    if (isAndroid) {
      // https://developers.google.com/cloud-print/docs/gadget
      var gadget = new cloudprint.Gadget();
      gadget.setPrintDocument("url", $('title').html(), window.location.href, "utf-8");
      gadget.openPrintDialog();
    } else {
      window.print();
    }
    return false;
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button class="print">Print this page</button>

I haven't had the time to check if this works, i don't have an android device with me at the moment. I Would love to have some feedback on this ;-)

回答4:

I think, direct print() method is disabled on devices by default. I not saw so many phones or other Android devices with printer, however by USB it should be possible of course.

Instead, recommended is saving content/page as pdf and print it via some cloud print service.