How to Automate the Google Cloud Print Service - Web Design Brisbane - Digital Services - Premium IT Solutions

How to Automate Printing
From Your Website

Using the Google Cloud Printing Service

We're making business easy...

This article is directed towards those that are looking to expand the label printing capabilites of their online store or website. We will explain how you can use a form on your website to automate your label/invoice printing with only a printer and an internet connection.

With Automated Printing via the Cloud

Being able to automate the printing of labels, barcodes, PDF's or any user response from your website is a feauture that should be relatively easy with all the advancements in Computer and Software technology. Unfortuantely this isn't the case, it's time consuming, difficult and you need to build your own workaround solution, so we've done it for you. With the help of Google Cloud's print service and integrations with mPDF, IFTTT and Wappwolf, you can streamline your workflow to automatically receive print documents and send them to print automatically.

The Tutorial

In this tutorial we will show you how you can automate the printing of a HTML document, which is converted to a pdf and saved in your directory prior to printing.

You will need to use the google cloud print service knowledgebase for assistance with this tutorial:

What you need before proceeding:

  • Intermediate/advanced programming knowledge to build and manipulate SQL database table and integrate php library..
  • Google+ account (google account with a gmail address)
  • Google Cloud Ready printer (or connect printer directly to a pc/router)
  • Google Chrome installed
  • mPDF(mPDF is a PHP class which generates PDF files from UTF-8 encoded HTML) -
    https://mpdf.github.io/
  • Wappwolf account -
    http://wappwolf.com/dropboxautomator
  • IFTTT account -
    https://ifttt.com/

What are the steps:

  1. Setup Google Cloud Print API
  2. Setup Gmail and Google Drive
  3. Create sql database and table
  4. Install mPDF to server
  5. Create IFTTT and Wappwolf integrations
  6. ​Setup form and handling php file to smtp to your Gmail account
  7. ​Process user response into formatted PDF for print
  8. Integrations automate google cloud print service when document is received.

Setting up your Google Cloud Print API

  • Simply navigate to https://www.google.com/cloudprint/ and login or create a new google+ account.
  • On the left hand side of the landing page you should find and click-on 'add a cloud-ready printer'.
  • Once the printer has been setup you can find your printer details by clicking on 'printers'.

Setup Gmail and Google Drive

Setup form and handling php file to smtp to your Gmail account

After you have created your sql database you will need to add a database user with full priveleges, we will then setup a form and submit a user response from the website to be automatically printed.

Simply, setup a form on your html page like the one below and submit that form to the server (process the form response with a php handler). This is where you will need to create the sql database table and use smtp settings to post the user's input through an email to the server. You can modify the below HTML code to for a standard form submitting to the server:

The HTML

First you will need to create a page where you can place html code:

<input id="input1" type="text"> <input id="input2" type="text"> <button id="submit"> Submit! </button>

Initiating a Post to the Database

Next you will create an Ajax POST to transfer the input from the user for server sider processing.

<script> jQuery( "#submit" ).click(function() { alert( "testing!." ); input1=document.getElementById('input1').value; input2=document.getElementById('input2').value; var formData = new FormData(); formData.append('input1', input1); formData.append('input2', input2); var completeDiv = jQuery('#customForm').html(); jQuery.ajax({ url : 'processData.php', type : 'POST', data : completeDiv, processData: false, // tell jQuery not to process the data contentType: false, // tell jQuery not to set contentType success : function(data) { location.href = "<a class="vglnk" href="http://yourdomain.com.au/sendToPrint.php" rel="nofollow"><span>http</span><span>://</span><span>yourdomain</span><span>.</span><span>com</span><span>.</span><span>au</span><span>/</span><span>sendToPrint</span><span>.</span><span>php</span></a>"; } }); }); </script>

Creating the PHP Handling File

Next you will need to create a php file to handle the data from the Ajax Post. We have called it processData.php to place our php.

<?php //select a database to work with and set the connection to variable '$db' $db = new PDO('mysql:host=localhost;dbname=database_name;charset=utf8mb4', 'database_user', 'password', array(PDO::ATTR_EMULATE_PREPARES => false, PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION)); //get today's date $today = date("F j, Y"); //collect user response from submitted form $input1 = $_POST['input1']; $input2 = $_POST['input2']; //specify a unique file name to save on your server (directory location you will save the output pdf file) $dir = "invoices/".$_POST['input1'].$_POST['input2'].$today.".pdf"; //post data to your server $db->query("INSERT INTO customTable (input1, input2, pdf) VALUES ('$input1', '$input2', '$dir')"); //Select the data posted to server and apply a tag $id = $db->query("SELECT * FROM customTable WHERE ( input1 = '$input1' AND input2 = '$input2' AND input3 = '$input3')"); //structure the output for the pdf $html ='<html> <body> <div id="billing" style="padding-left: 85px; padding-top: 120px;"> <p style="font-weight: bold">This is the data submitted by the user</p> <p style="font-size: 14px; padding-top: -20px;">'.$_POST['input1'].', '.$_POST['input2'].'</p> <p style="font-size: 14px; padding-top: -20px;">'.$_POST['input3'].'</p> <p style="font-size: 14px; padding-top: -20px;">Invoice Date: '.$today.'</p> </div> </body> </html>'; //call class to process response into pdf require_once __DIR__ . '/vendor/autoload.php'; $mpdf = new mPDF(); $mpdf->WriteHTML($html); //can output a single input with //$mpdf->WriteHTML($input1); //create and output pdf to specificied directory location $mpdf->Output('invoices/'.$_POST['input1'].$_POST['input2'].$today.".pdf",'F'); ?>

Creating a Thankyou Page

Now you will need to create a thankyou page to let the user know the form has been submitted to the google drive.

<!DOCTYPE html> <html> <head> <script src="jquery-3.1.1.min.js"></script> </head> <body> <h1>Thank you page after posting user respone/h1> <h2 style="padding-top:30px;">Well done!</h2> <p style="padding-top:30px;">If you have setup sendtoprint.php and your Wappwolf and IFFT integrations properly you should expect your pdf to print soon.</p> </body> </html>

Now to create sendToPrint.php:

Now that we have processed the user response, we will need to create another php file called sendToPrint.php.

This php file will handle the pdf we have created and smtp it to your email address.

*Make sure you have the phpmailer class installed on your server.

You will also need to create a mail account on your server so you can smtp the .pdf to your email address.

*This is where you will need to have created your Google+ account so your gmail account can receive the .pdf.

<?php $mysqli = new mysqli("localhost", "database_name", "password", "database_user"); /* check connection */ if ($mysqli->connect_errno) { printf("Connect failed: %sn", $mysqli->connect_error); exit(); } $today = date("F j, Y"); $query = "SELECT * from customTable ORDER BY id DESC LIMIT 1"; $result = $mysqli->query($query); /* associative and numeric array */ while ($row = mysqli_fetch_assoc($result)){ $input1 = $row[input1]; $input2 = $row[input2]; $input3 = $row[input3]; require 'phpmailer/PHPMailerAutoload.php'; $mail = new PHPMailer; //$mail->SMTPDebug = 3; // Enable verbose debug output $mail->isSMTP(); // Set mailer to use SMTP $mail->Host = 'server.premiumitsolutions.net.au'; // Specify main and backup SMTP servers $mail->SMTPAuth = true; // Enable SMTP authentication $mail->Username = 'example@yourdomain.com.au'; // SMTP username $mail->Password = 'password'; // SMTP password $mail->SMTPSecure = 'tls'; // Enable TLS encryption, `ssl` also accepted $mail->Port = 587; // TCP port to connect to $mail->setFrom('example@yourdomain.com.au', 'PDF to print'); $mail->addAddress('youraccount@gmail.com', 'PDF to print'); $mail->addAttachment("invoices/".$row[input1].$row[input2].$today.".pdf"); // Add attachments //$mail->addAttachment("invoices/".$_POST['input1'].$_POST['input2'].".pdf", 'new.pdf'); // Optional name $mail->isHTML(true); // Set email format to HTML $mail->Subject = 'PDF to Print'; $mail->Body = 'Congratulations, you should expect your .pdf to print soon. Please check your printer has successfully printed the .pdf.'; if(!$mail->send()) { echo 'Message could not be sent.'; echo 'Mailer Error: ' . $mail->ErrorInfo; } else { echo 'Message has been sent'; } } ?>

Setting up the IFTTT and Wappwolf Integrations

Now that all the hard work is done, we simply need to setup our integrations with IFTTT and Wappwolf then you have successfully setup your automated printing from your website.

All you need to do is create a free account with IFTTT on https://ifttt.com/join

The next step is to turn on the applet "Automatically save new email attachments in Gmail to Google Drive" , found at https://ifttt.com/applets/99068p-automatically-save-new-email-attachments-in-gmail-to-google-drive, you can filter messages like this and add a label, or if it hasn'y done this automatically, label all message received like this as 'PDF to Print'.

The next step is to setup Wappolf's integration which will detect new attachments which arrive in your google drive from the IFTTT integration and automate your Google Cloud Printing. If you have created an account, navigate to http://wappwolf.com/gdriveautomator and set up the integration to automate your google drive to print and new attachments received to your google drive with the label PDF to Print.

Now the you have made it to the bottom, you should have setup
your automated printing with Google Cloud Print.