How to print RAW commands and known file formats in one printing job from ASP.NET
Product WebClientPrint for ASP.NET Published 12/26/2016 Updated 10/16/2019 Author Neodynamic
Overview
Suppose you have an ASP.NET website and you need to print some RAW commands to a Thermal printer in addition to priting a PDF to a laser printer, both printers installed at the client machine. Let's say you want to print a ticket in ESC/POS commands to a thermal printer called "ThermalPrinter" and a "Dispatch Form" in PDF format to a laser printer called "LaserPrinter". Both "ThermalPrinter" & "LaserPrinter" are available at the client machine (they can be installed locally or reached through the client network).
The new ClientPrintJobGroup class shipped with WebClientPrint 3.0+ for ASP.NET will allow you to get that working by just writing a few lines of code. The great thing about this is that you can print those files without displaying any print dialog to the user i.e. a silently printing approach on clients running Windows, macOS/OSX as well as Linux and Raspberry Pi!
In this walkthrough, you'll learn how to print RAW printer commands alongside multiple known files or documents (like MS Word *.doc or *.docx; MS Excel *.xls or *.xlsx; Adobe PDF; Text files or images) from an ASP.NET website to different printers installed at the client machine without displaying any print dialog. Best of, this solution works with any browser on Windows OS like IE (6 or later), Chrome, Firefox, Opera & Safari as well as on Linux, Raspberry Pi & Mac OS clients!
Requirements
Development/Server-side
WebClientPrint 6.0 for ASP.NET (or greater)
ASP.NET 4.6.1+ or ASP.NET Core 2.0+
Visual Studio 2015+
jQuery 1.4.1+
Client-side
WebClientPrint Processor 6.0 for Windows, Linux, Raspberry Pi & Mac
File Printing Requirements depending on the kind of file you want to print at client side:
| Windows Clients | Linux, RPi & Mac Clients | |
| DOC, DOCX | Microsoft Word is required | LibreOffice is required |
| XLS, XLSX | Microsoft Excel is required | LibreOffice is required |
| Natively supported! | Natively supported! | |
| TXT | Natively supported! | Natively supported! |
| JPEG | Natively supported! | Natively supported! |
| PNG | Natively supported! | Natively supported! |
| BMP | Natively supported! | Natively supported! |
| Printer Support | You can print files to local installed printers ONLY! Parallel, Serial and IP/Ethernet printers are NOT supported. | You can print files to any installed printers through CUPS system. |
Follow up these steps
- Open Visual Studio and create a new ASP.NET Website naming it PrintMultipleJobsSample
- Add a NuGet reference to Neodynamic.SDK.WebClientPrint package to your project
- Now follow up the instructions for each MVC/C#, MVC/VB, SPA/AngularJS+WebAPI, WebForms/CS or WebForms/VB:
Creating/Editing Controllers
Create a new Controller and name it WebClientPrintAPIController and then copy/paste the following code:
public class WebClientPrintAPIController : Controller { //********************************* // IMPORTANT NOTE // In this sample we store users related stuff (like // the list of printers and whether they have the WCPP // client utility installed) in the Application cache // object part of ASP.NET BUT you can change it to // another different storage (like a DB or file server)! // which will be required in Load Balacing scenarios //********************************* [AllowAnonymous] public void ProcessRequest() { //get session ID string sessionID = (HttpContext.Request["sid"] != null ? HttpContext.Request["sid"] : null); //get Query String string queryString = HttpContext.Request.Url.Query; try { //Determine and get the Type of Request RequestType prType = WebClientPrint.GetProcessRequestType(queryString); if (prType == RequestType.GenPrintScript || prType == RequestType.GenWcppDetectScript) { //Let WebClientPrint to generate the requested script byte[] script = WebClientPrint.GenerateScript(Url.Action("ProcessRequest", "WebClientPrintAPI", null, HttpContext.Request.Url.Scheme), queryString); HttpContext.Response.ContentType = "text/javascript"; HttpContext.Response.BinaryWrite(script); HttpContext.Response.End(); } else if (prType == RequestType.ClientSetWcppVersion) { //This request is a ping from the WCPP utility //so store the session ID indicating it has the WCPP installed //also store the WCPP Version if available string wcppVersion = HttpContext.Request["wcppVer"]; if (string.IsNullOrEmpty(wcppVersion)) wcppVersion = "1.0.0.0"; HttpContext.Application.Set(sessionID + "wcppInstalled", wcppVersion); } else if (prType == RequestType.ClientSetInstalledPrinters) { //WCPP Utility is sending the installed printers at client side //so store this info with the specified session ID string printers = HttpContext.Request["printers"]; if (string.IsNullOrEmpty(printers) == false) printers = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printers)); HttpContext.Application.Set(sessionID + "printers", printers); } else if (prType == RequestType.ClientSetInstalledPrintersInfo) { //WCPP Utility is sending the client installed printers with detailed info //so store this info with the specified session ID //Printers Info is in JSON format string printersInfo = HttpContext.Request.Form["printersInfoContent"]; if (string.IsNullOrEmpty(printersInfo) == false) printersInfo = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printersInfo)); HttpContext.Application.Set(sessionID + "printersInfo", printersInfo); } else if (prType == RequestType.ClientGetWcppVersion) { //return the WCPP version for the specified sid if any bool sidWcppVersion = (HttpContext.Application.Get(sessionID + "wcppInstalled") != null); HttpContext.Response.ContentType = "text/plain"; HttpContext.Response.Write((sidWcppVersion ? HttpContext.Application.Get(sessionID + "wcppInstalled") : "")); HttpContext.Response.End(); } else if (prType == RequestType.ClientGetInstalledPrinters) { //return the installed printers for the specified sid if any bool sidHasPrinters = (HttpContext.Application.Get(sessionID + "printers") != null); HttpContext.Response.ContentType = "text/plain"; HttpContext.Response.Write((sidHasPrinters ? HttpContext.Application.Get(sessionID + "printers") : "")); HttpContext.Response.End(); } else if (prType == RequestType.ClientGetInstalledPrintersInfo) { //return the installed printers with detailed info for the specified Session ID (sid) if any bool sidHasPrinters = (HttpContext.Application[sessionID + "printersInfo"] != null); HttpContext.Response.ContentType = "text/plain"; HttpContext.Response.Write(sidHasPrinters ? HttpContext.Application[sessionID + "printersInfo"] : ""); } } catch (Exception ex) { HttpContext.Response.StatusCode = 500; HttpContext.Response.ContentType = "text/plain"; HttpContext.Response.Write(ex.Message + " - StackTrace: " + ex.StackTrace); HttpContext.Response.End(); } } }Edit the HomeController to the following code:
public class HomeController : Controller { public ActionResult Index() { ViewBag.WCPPDetectionScript = Neodynamic.SDK.Web.WebClientPrint.CreateWcppDetectionScript(Url.Action("ProcessRequest", "WebClientPrintAPI", null, HttpContext.Request.Url.Scheme), HttpContext.Session.SessionID); return View(); } public ActionResult PrintManyJobs() { return View(); } }Add a new Controller and name it PrintManyJobsController and paste the following code:
using Neodynamic.SDK.Web; public class PrintManyJobsController : Controller { public ActionResult Index() { ViewBag.WCPScript = WebClientPrint.CreateScript(Url.Action("ProcessRequest", "WebClientPrintAPI", null, HttpContext.Request.Url.Scheme), Url.Action("PrintRawCmdAndFile", "PrintManyJobs", null, HttpContext.Request.Url.Scheme), HttpContext.Session.SessionID); return View(); } [AllowAnonymous] public void PrintRawCmdAndFile(string useDefaultPrinter1, string printerName1, string useDefaultPrinter2, string printerName2) { //We'll create TWO ClientPrintJob objects, one for printing the RAW commands and the other one for printing the PDF file //Create ESC/POS commands for sample receipt string ESC = "0x1B"; //ESC byte in hex notation string NewLine = "0x0A"; //LF byte in hex notation string cmds = ESC + "@"; //Initializes the printer (ESC @) cmds += ESC + "!" + "0x38"; //Emphasized + Double-height + Double-width mode selected (ESC ! (8 + 16 + 32)) 56 dec => 38 hex cmds += "BEST DEAL STORES"; //text to print cmds += NewLine + NewLine; cmds += ESC + "!" + "0x00"; //Character font A selected (ESC ! 0) cmds += "COOKIES 5.00"; cmds += NewLine; cmds += "MILK 65 Fl oz 3.78"; cmds += NewLine + NewLine; cmds += "SUBTOTAL 8.78"; cmds += NewLine; cmds += "TAX 5% 0.44"; cmds += NewLine; cmds += "TOTAL 9.22"; cmds += NewLine; cmds += "CASH TEND 10.00"; cmds += NewLine; cmds += "CASH DUE 0.78"; cmds += NewLine + NewLine; cmds += ESC + "!" + "0x18"; //Emphasized + Double-height mode selected (ESC ! (16 + 8)) 24 dec => 18 hex cmds += "# ITEMS SOLD 2"; cmds += ESC + "!" + "0x00"; //Character font A selected (ESC ! 0) cmds += NewLine + NewLine; cmds += "11/03/13 19:53:17"; //Create a ClientPrintJob and send it back to the client! ClientPrintJob cpj1 = new ClientPrintJob(); //set ESCPOS commands to print... cpj1.PrinterCommands = cmds; cpj1.FormatHexValues = true; //set client printer... if (useDefaultPrinter1 || printerName1 == "null") cpj1.ClientPrinter = new DefaultPrinter(); else cpj1.ClientPrinter = new InstalledPrinter(printerName1); //Now the ClientPrintJob for the PDF file //full path of the PDF file to be printed string pdfFilePath = @"c:\myDocument.pdf"; //create a temp file name for our PDF file... string fileName = "MyFile-" + Guid.NewGuid().ToString("N") + System.IO.Path.GetExtension(pdfFilePath); //Create a PrintFilePDF object with the PDF file PrintFilePDF file = new PrintFilePDF(pdfFilePath, fileName); //Create a ClientPrintJob for printing the file! ClientPrintJob cpj2 = new ClientPrintJob(); //set file to print... cpj2.PrintFile = file; //set client printer... if (useDefaultPrinter2 || printerName2 == "null") cpj2.ClientPrinter = new DefaultPrinter(); else cpj2.ClientPrinter = new InstalledPrinter(printerName2); //Create a ClientPrintJobGroup for printing both ClientPrintJob! ClientPrintJobGroup cpjg = new ClientPrintJobGroup(); cpjg.Add(cpj1); cpjg.Add(cpj2); //send it... System.Web.HttpContext.Current.Response.ContentType = "application/octet-stream"; System.Web.HttpContext.Current.Response.BinaryWrite(cpjg.GetContent()); System.Web.HttpContext.Current.Response.End(); } }Creating/Editing Views
The default View is for detecting whether the client machine has the WebClientPrint Processor (WCPP) Utility installed. Edit the Views / Shared / _Layout.cshtml file and add the folowing section to the BODY:
Be sure this View links to jQuery 1.4.1+ file!
<body> ... @RenderSection("scripts", required: false) ... </body>Edit the Views / Home / Index.cshtml file and copy/paste the folowing code:
@{ ViewBag.Title = "Home Page"; } <div id="msgInProgress"> <div id="mySpinner" style="width:32px;height:32px"></div> <br /> <h3>Detecting WCPP utility at client side...</h3> <h3>Please wait a few seconds...</h3> <br /> </div> <div id="msgInstallWCPP" style="display:none;"> <h3>#1 Install WebClientPrint Processor (WCPP)!</h3> <p> <strong>WCPP is a native app (without any dependencies!)</strong> that handles all print jobs generated by the <strong>WebClientPrint for ASP.NET component</strong> at the server side. The WCPP is in charge of the whole printing process and can be installed on <strong>Windows, Linux, Mac & Raspberry Pi!</strong> </p> <p> <a href="//www.neodynamic.com/downloads/wcpp/" target="_blank" >Download and Install WCPP from Neodynamic website</a><br /> </p> <h3>#2 After installing WCPP...</h3> <p> <a href="@Url.Action("Index", "PrintManyJobs")" >You can go and test the printing page...</a> </p> </div> @section scripts{ <script type="text/javascript"> var wcppPingTimeout_ms = 60000; //60 sec var wcppPingTimeoutStep_ms = 500; //0.5 sec function wcppDetectOnSuccess(){ // WCPP utility is installed at the client side // redirect to WebClientPrint sample page // get WCPP version var wcppVer = arguments[0]; if(wcppVer.substring(0, 1) == "6") window.location.href = '@Url.Action("Index", "PrintManyJobs")'; else //force to install WCPP v6.0 wcppDetectOnFailure(); } function wcppDetectOnFailure() { // It seems WCPP is not installed at the client side // ask the user to install it $('#msgInProgress').hide(); $('#msgInstallWCPP').show(); } </script> @* WCPP detection script generated by HomeController *@ @Html.Raw(ViewBag.WCPPDetectionScript) }Create a new folder called PrintManyJobs under the Views and add a new View with the following name and under such folder: Views / PrintManyJobs / Index.cshtml Then, copy/paste the folowing code:
<h3>Print RAW ESC/POS Commands and PDF File</h3> <h4>Print RAW ESC/POS Commands To the following printer:</h4> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter1" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters1"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters1" style="visibility:hidden"> <label for="installedPrinterName1">Select an installed Printer:</label> <select name="installedPrinterName1" id="installedPrinterName1"></select> </div> <h3>Print PDF To the following printer:</h3> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter2" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters2"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters2" style="visibility:hidden"> <label for="installedPrinterName2">Select an installed Printer:</label> <select name="installedPrinterName2" id="installedPrinterName2"></select> </div> <script type="text/javascript"> var wcppGetPrintersTimeout_ms = 60000; //60 sec var wcppGetPrintersTimeoutStep_ms = 500; //0.5 sec function wcpGetPrintersOnSuccess() { // Display client installed printers if (arguments[0].length > 0) { var p = arguments[0].split("|"); var options = ''; for (var i = 0; i < p.length; i++) { options += '<option>' + p[i] + '</option>'; } $('#installedPrinters1').css('visibility', 'visible'); $('#installedPrinterName1').html(options); $('#installedPrinterName1').focus(); $('#loadPrinters1').hide(); $('#installedPrinters2').css('visibility', 'visible'); $('#installedPrinterName2').html(options); $('#loadPrinters2').hide(); } else { alert("No printers are installed in your system."); } } function wcpGetPrintersOnFailure() { // Do something if printers cannot be got from the client alert("No printers are installed in your system."); } </script> <br /> <input type="button" style="font-size:18px" onclick="javascript:jsWebClientPrint.print('useDefaultPrinter1=' + $('#useDefaultPrinter1').attr('checked') + '&printerName1=' + $('#installedPrinterName1').val() + '&useDefaultPrinter2=' + $('#useDefaultPrinter2').attr('checked') + '&printerName2=' + $('#installedPrinterName2').val());" value="Print Commands And Files..." /> @section scripts{ @* Register the WebClientPrint script code generated by PrintManyJobsController. *@ @Html.Raw(ViewBag.WCPScript); }Creating/Editing Controllers
Create a new Controller and name it WebClientPrintAPIController and then copy/paste the following code:
Imports Neodynamic.SDK.Web Namespace Controllers Public Class WebClientPrintAPIController Inherits Controller ' GET: WebClientPrintAPI Function Index() As ActionResult Return View() End Function '********************************* ' IMPORTANT NOTE ' In this sample we store users related stuff (like ' the list of printers and whether they have the WCPP ' client utility installed) in the Application cache ' object part of ASP.NET BUT you can change it to ' another different storage (like a DB or file server)! ' which will be required in Load Balacing scenarios '********************************* <AllowAnonymous> Public Sub ProcessRequest() 'get session ID Dim sessionID As String = (If(HttpContext.Request("sid") IsNot Nothing, HttpContext.Request("sid"), Nothing)) 'get Query String Dim queryString As String = HttpContext.Request.Url.Query Try 'Determine and get the Type of Request Dim prType As RequestType = WebClientPrint.GetProcessRequestType(queryString) If prType = RequestType.GenPrintScript OrElse prType = RequestType.GenWcppDetectScript Then 'Let WebClientPrint to generate the requested script Dim script As Byte() = WebClientPrint.GenerateScript(Url.Action("ProcessRequest", "WebClientPrintAPI", Nothing, HttpContext.Request.Url.Scheme), queryString) HttpContext.Response.ContentType = "text/javascript" HttpContext.Response.BinaryWrite(script) HttpContext.Response.End() ElseIf prType = RequestType.ClientSetWcppVersion Then 'This request is a ping from the WCPP utility 'so store the session ID indicating it has the WCPP installed 'also store the WCPP Version if available Dim wcppVersion As String = HttpContext.Request("wcppVer") If String.IsNullOrEmpty(wcppVersion) Then wcppVersion = "1.0.0.0" End If HttpContext.Application.Set(sessionID & "wcppInstalled", wcppVersion) ElseIf prType = RequestType.ClientSetInstalledPrinters Then 'WCPP Utility is sending the installed printers at client side 'so store this info with the specified session ID Dim printers As String = HttpContext.Request("printers") If String.IsNullOrEmpty(printers) = False Then printers = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printers)) End If HttpContext.Application.Set(sessionID & "printers", printers) ElseIf prType = RequestType.ClientSetInstalledPrintersInfo Then 'WCPP Utility is sending the installed printers at client side 'so store this info with the specified session ID 'Printers Info is in JSON format Dim printersInfo As String = HttpContext.Request.Form("printersInfoContent") If Not String.IsNullOrEmpty(printersInfo) Then printersInfo = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printersInfo)) End If HttpContext.Application.Set(sessionID & "printersInfo", printersInfo) ElseIf prType = RequestType.ClientGetWcppVersion Then 'return the WCPP version for the specified sid if any Dim sidWcppVersion As Boolean = (HttpContext.Application(sessionID & "wcppInstalled") IsNot Nothing) HttpContext.Response.ContentType = "text/plain" If (sidWcppVersion) Then HttpContext.Response.Write(HttpContext.Application(sessionID & "wcppInstalled").ToString()) End If HttpContext.Response.End() ElseIf prType = RequestType.ClientGetInstalledPrinters Then 'return the installed printers for the specified sid if any Dim sidHasPrinters As Boolean = (HttpContext.Application(sessionID & "printers") IsNot Nothing) HttpContext.Response.ContentType = "text/plain" If (sidHasPrinters) Then HttpContext.Response.Write(HttpContext.Application(sessionID & "printers").ToString()) End If HttpContext.Response.End() ElseIf prType = RequestType.ClientGetInstalledPrintersInfo Then 'return the installed printers with detailed info for the specified Session ID (sid) if any Dim sidHasPrinters As Boolean = (HttpContext.Application(sessionID & "printersInfo") IsNot Nothing) HttpContext.Response.ContentType = "text/plain" If (sidHasPrinters) Then HttpContext.Response.Write(HttpContext.Application(sessionID & "printersInfo").ToString()) End If HttpContext.Response.End() End If Catch ex As Exception HttpContext.Response.StatusCode = 500 HttpContext.Response.ContentType = "text/plain" HttpContext.Response.Write(ex.Message + " - StackTrace: " + ex.StackTrace) HttpContext.Response.End() End Try End Sub End Class End NamespaceEdit the HomeController to the following code:
Public Class HomeController Inherits System.Web.Mvc.Controller Function Index() As ActionResult ViewData("WCPPDetectionScript") = Neodynamic.SDK.Web.WebClientPrint.CreateWcppDetectionScript(Url.Action("ProcessRequest", "WebClientPrintAPI", Nothing, HttpContext.Request.Url.Scheme), HttpContext.Session.SessionID) Return View() End Function Function PrintManyJobs() As ActionResult Return View() End Function End ClassAdd a new Controller and name it PrintManyJobsController and paste the following code:
Imports Neodynamic.SDK.Web Namespace Controllers Public Class PrintPDFController Inherits Controller Function Index() As ActionResult ViewData("WCPScript") = Neodynamic.SDK.Web.WebClientPrint.CreateScript(Url.Action("ProcessRequest", "WebClientPrintAPI", Nothing, HttpContext.Request.Url.Scheme), Url.Action("PrintRawCmdAndFile", "PrintManyJobs", Nothing, HttpContext.Request.Url.Scheme), HttpContext.Session.SessionID) Return View() End Function <AllowAnonymous> Public Sub PrintFile(useDefaultPrinter As String, printerName As String) 'We'll create TWO ClientPrintJob objects, one for printing the RAW commands and the other one for printing the PDF file 'Create ESC/POS commands for sample receipt Dim ESC As String = "0x1B" 'ESC byte in hex notation Dim NewLine As String = "0x0A" 'LF byte in hex notation Dim cmds As String = ESC & "@" 'Initializes the printer (ESC @) cmds += ESC & "!" & "0x38" 'Emphasized + Double-height + Double-width mode selected (ESC ! (8 + 16 + 32)) 56 dec => 38 hex cmds += "BEST DEAL STORES" 'text to print cmds += NewLine & NewLine cmds += ESC & "!" & "0x00" 'Character font A selected (ESC ! 0) cmds += "COOKIES 5.00" cmds += NewLine cmds += "MILK 65 Fl oz 3.78" cmds += NewLine & NewLine cmds += "SUBTOTAL 8.78" cmds += NewLine cmds += "TAX 5% 0.44" cmds += NewLine cmds += "TOTAL 9.22" cmds += NewLine cmds += "CASH TEND 10.00" cmds += NewLine cmds += "CASH DUE 0.78" cmds += NewLine & NewLine cmds += ESC & "!" & "0x18" 'Emphasized + Double-height mode selected (ESC ! (16 + 8)) 24 dec => 18 hex cmds += "# ITEMS SOLD 2" cmds += ESC & "!" & "0x00" 'Character font A selected (ESC ! 0) cmds += NewLine & NewLine cmds += "11/03/13 19:53:17" 'Create a ClientPrintJob and send it back to the client! Dim cpj1 As New ClientPrintJob() 'set ESCPOS commands to print... cpj1.PrinterCommands = cmds cpj1.FormatHexValues = True 'set client printer... If useDefaultPrinter1 OrElse printerName1 = "null" Then cpj1.ClientPrinter = New DefaultPrinter() Else cpj1.ClientPrinter = New InstalledPrinter(printerName1) End If 'Now the ClientPrintJob for the PDF file 'full path of the PDF file to be printed Dim pdfFilePath As String = "c:\myDocument.pdf" 'create a temp file name for our PDF file... Dim fileName As String = "MyFile-" + Guid.NewGuid().ToString("N") & System.IO.Path.GetExtension(pdfFilePath) 'Create a PrintFilePDF object with the PDF file Dim file As New PrintFilePDF(pdfFilePath, fileName) 'Create a ClientPrintJob for printing the file! Dim cpj2 As New ClientPrintJob() 'set file to print... cpj2.PrintFile = file 'set client printer... If useDefaultPrinter2 OrElse printerName2 = "null" Then cpj2.ClientPrinter = New DefaultPrinter() Else cpj2.ClientPrinter = New InstalledPrinter(printerName2) End If 'Create a ClientPrintJobGroup for printing both ClientPrintJob! Dim cpjg As New ClientPrintJobGroup() cpjg.Add(cpj1) cpjg.Add(cpj2) 'send it... System.Web.HttpContext.Current.Response.ContentType = "application/octet-stream" System.Web.HttpContext.Current.Response.BinaryWrite(cpjg.GetContent()) System.Web.HttpContext.Current.Response.End() End Sub End Class End NamespaceCreating/Editing Views
The default View is for detecting whether the client machine has the WebClientPrint Processor (WCPP) Utility installed. Edit the Views / Shared / _Layout.vbhtml file and add the folowing section to the BODY:
Be sure this View links to jQuery 1.4.1+ file!
<body> ... @RenderSection("scripts", required: False) ... </body>Edit the Views / Home / Index.vbhtml file and copy/paste the folowing code:
@Code ViewData("Title") = "Home Page" End Code <div id="msgInProgress"> <div id="mySpinner" style="width:32px;height:32px"></div> <br /> <h3>Detecting WCPP utility at client side...</h3> <h3>Please wait a few seconds...</h3> <br /> </div> <div id="msgInstallWCPP" style="display:none;"> <h3>#1 Install WebClientPrint Processor (WCPP)!</h3> <p> <strong>WCPP is a native app (without any dependencies!)</strong> that handles all print jobs generated by the <strong>WebClientPrint for ASP.NET component</strong> at the server side. The WCPP is in charge of the whole printing process and can be installed on <strong>Windows, Linux, Mac & Raspberry Pi!</strong> </p> <p> <a href="//www.neodynamic.com/downloads/wcpp/" target="_blank" >Download and Install WCPP from Neodynamic website</a><br /> </p> <h3>#2 After installing WCPP...</h3> <p> <a href="@Url.Action("Index", "PrintManyJobs")" >You can go and test the printing page...</a> </p> </div> @section scripts <script type="text/javascript"> var wcppPingTimeout_ms = 60000; //60 sec var wcppPingTimeoutStep_ms = 500; //0.5 sec function wcppDetectOnSuccess(){ // WCPP utility is installed at the client side // redirect to WebClientPrint sample page // get WCPP version var wcppVer = arguments[0]; if(wcppVer.substring(0, 1) == "6") window.location.href = '@Url.Action("Index", "PrintManyJobs")'; else //force to install WCPP v6.0 wcppDetectOnFailure(); } function wcppDetectOnFailure() { // It seems WCPP is not installed at the client side // ask the user to install it $('#msgInProgress').hide(); $('#msgInstallWCPP').show(); } </script> @* WCPP detection script generated by HomeController *@ @Html.Raw(ViewData("WCPPDetectionScript")) } End SectionCreate a new folder called PrintManyJobs under the Views and add a new View with the following name and under such folder: Views / PrintManyJobs / Index.vbhtml Then, copy/paste the folowing code:
<h3>Print RAW ESC/POS Commands and PDF File</h3> <h4>Print RAW ESC/POS Commands To the following printer:</h4> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter1" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters1"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters1" style="visibility:hidden"> <label for="installedPrinterName1">Select an installed Printer:</label> <select name="installedPrinterName1" id="installedPrinterName1"></select> </div> <h3>Print PDF To the following printer:</h3> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter2" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters2"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters2" style="visibility:hidden"> <label for="installedPrinterName2">Select an installed Printer:</label> <select name="installedPrinterName2" id="installedPrinterName2"></select> </div> <script type="text/javascript"> var wcppGetPrintersTimeout_ms = 60000; //60 sec var wcppGetPrintersTimeoutStep_ms = 500; //0.5 sec function wcpGetPrintersOnSuccess() { // Display client installed printers if (arguments[0].length > 0) { var p = arguments[0].split("|"); var options = ''; for (var i = 0; i < p.length; i++) { options += '<option>' + p[i] + '</option>'; } $('#installedPrinters1').css('visibility', 'visible'); $('#installedPrinterName1').html(options); $('#installedPrinterName1').focus(); $('#loadPrinters1').hide(); $('#installedPrinters2').css('visibility', 'visible'); $('#installedPrinterName2').html(options); $('#loadPrinters2').hide(); } else { alert("No printers are installed in your system."); } } function wcpGetPrintersOnFailure() { // Do something if printers cannot be got from the client alert("No printers are installed in your system."); } </script> <br /> <input type="button" style="font-size:18px" onclick="javascript:jsWebClientPrint.print('useDefaultPrinter1=' + $('#useDefaultPrinter1').attr('checked') + '&printerName1=' + $('#installedPrinterName1').val() + '&useDefaultPrinter2=' + $('#useDefaultPrinter2').attr('checked') + '&printerName2=' + $('#installedPrinterName2').val());" value="Print Commands And Files..." /> @section scripts @* Register the WebClientPrint script code generated by PrintManyJobsController. *@ @Html.Raw(ViewData("WCPScript")) @end sectionCreating/Editing Controllers
Create a new Controller and name it WebClientPrintAPIController and then copy/paste the following code:
public class WebClientPrintAPIController : Controller { //********************************* // IMPORTANT NOTE // In this sample we store users related stuff (like // the list of printers and whether they have the WCPP // client utility installed) in the Application cache // object part of ASP.NET BUT you can change it to // another different storage (like a DB or file server)! // which will be required in Load Balacing scenarios //********************************* [AllowAnonymous] public void ProcessRequest() { //get session ID string sessionID = (HttpContext.Request["sid"] != null ? HttpContext.Request["sid"] : null); //get Query String string queryString = HttpContext.Request.Url.Query; try { //Determine and get the Type of Request RequestType prType = WebClientPrint.GetProcessRequestType(queryString); if (prType == RequestType.GenPrintScript || prType == RequestType.GenWcppDetectScript) { //Let WebClientPrint to generate the requested script byte[] script = WebClientPrint.GenerateScript(Url.Action("ProcessRequest", "WebClientPrintAPI", null, HttpContext.Request.Url.Scheme), queryString); HttpContext.Response.ContentType = "text/javascript"; HttpContext.Response.BinaryWrite(script); HttpContext.Response.End(); } else if (prType == RequestType.ClientSetWcppVersion) { //This request is a ping from the WCPP utility //so store the session ID indicating it has the WCPP installed //also store the WCPP Version if available string wcppVersion = HttpContext.Request["wcppVer"]; if (string.IsNullOrEmpty(wcppVersion)) wcppVersion = "1.0.0.0"; HttpContext.Application.Set(sessionID + "wcppInstalled", wcppVersion); } else if (prType == RequestType.ClientSetInstalledPrinters) { //WCPP Utility is sending the installed printers at client side //so store this info with the specified session ID string printers = HttpContext.Request["printers"]; if (string.IsNullOrEmpty(printers) == false) printers = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printers)); HttpContext.Application.Set(sessionID + "printers", printers); } else if (prType == RequestType.ClientSetInstalledPrintersInfo) { //WCPP Utility is sending the client installed printers with detailed info //so store this info with the specified session ID //Printers Info is in JSON format string printersInfo = HttpContext.Request.Form["printersInfoContent"]; if (string.IsNullOrEmpty(printersInfo) == false) printersInfo = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printersInfo)); HttpContext.Application.Set(sessionID + "printersInfo", printersInfo); } else if (prType == RequestType.ClientGetWcppVersion) { //return the WCPP version for the specified sid if any bool sidWcppVersion = (HttpContext.Application.Get(sessionID + "wcppInstalled") != null); HttpContext.Response.ContentType = "text/plain"; HttpContext.Response.Write((sidWcppVersion ? HttpContext.Application.Get(sessionID + "wcppInstalled") : "")); HttpContext.Response.End(); } else if (prType == RequestType.ClientGetInstalledPrinters) { //return the installed printers for the specified sid if any bool sidHasPrinters = (HttpContext.Application.Get(sessionID + "printers") != null); HttpContext.Response.ContentType = "text/plain"; HttpContext.Response.Write((sidHasPrinters ? HttpContext.Application.Get(sessionID + "printers") : "")); HttpContext.Response.End(); } else if (prType == RequestType.ClientGetInstalledPrintersInfo) { //return the installed printers with detailed info for the specified Session ID (sid) if any bool sidHasPrinters = (HttpContext.Application[sessionID + "printersInfo"] != null); HttpContext.Response.ContentType = "text/plain"; HttpContext.Response.Write(sidHasPrinters ? HttpContext.Application[sessionID + "printersInfo"] : ""); } } catch (Exception ex) { HttpContext.Response.StatusCode = 500; HttpContext.Response.ContentType = "text/plain"; HttpContext.Response.Write(ex.Message + " - StackTrace: " + ex.StackTrace); HttpContext.Response.End(); } } }Add a new Controller and name it PrintManyJobsController and paste the following code:
using Neodynamic.SDK.Web; public class PrintManyJobsController : Controller { public ActionResult Index() { return View(); } [AllowAnonymous] public void PrintRawCmdAndFile(string useDefaultPrinter1, string printerName1, string useDefaultPrinter2, string printerName2) { //We'll create TWO ClientPrintJob objects, one for printing the RAW commands and the other one for printing the PDF file //Create ESC/POS commands for sample receipt string ESC = "0x1B"; //ESC byte in hex notation string NewLine = "0x0A"; //LF byte in hex notation string cmds = ESC + "@"; //Initializes the printer (ESC @) cmds += ESC + "!" + "0x38"; //Emphasized + Double-height + Double-width mode selected (ESC ! (8 + 16 + 32)) 56 dec => 38 hex cmds += "BEST DEAL STORES"; //text to print cmds += NewLine + NewLine; cmds += ESC + "!" + "0x00"; //Character font A selected (ESC ! 0) cmds += "COOKIES 5.00"; cmds += NewLine; cmds += "MILK 65 Fl oz 3.78"; cmds += NewLine + NewLine; cmds += "SUBTOTAL 8.78"; cmds += NewLine; cmds += "TAX 5% 0.44"; cmds += NewLine; cmds += "TOTAL 9.22"; cmds += NewLine; cmds += "CASH TEND 10.00"; cmds += NewLine; cmds += "CASH DUE 0.78"; cmds += NewLine + NewLine; cmds += ESC + "!" + "0x18"; //Emphasized + Double-height mode selected (ESC ! (16 + 8)) 24 dec => 18 hex cmds += "# ITEMS SOLD 2"; cmds += ESC + "!" + "0x00"; //Character font A selected (ESC ! 0) cmds += NewLine + NewLine; cmds += "11/03/13 19:53:17"; //Create a ClientPrintJob and send it back to the client! ClientPrintJob cpj1 = new ClientPrintJob(); //set ESCPOS commands to print... cpj1.PrinterCommands = cmds; cpj1.FormatHexValues = true; //set client printer... if (useDefaultPrinter1 || printerName1 == "null") cpj1.ClientPrinter = new DefaultPrinter(); else cpj1.ClientPrinter = new InstalledPrinter(printerName1); //Now the ClientPrintJob for the PDF file //full path of the PDF file to be printed string pdfFilePath = @"c:\myDocument.pdf"; //create a temp file name for our PDF file... string fileName = "MyFile-" + Guid.NewGuid().ToString("N") + System.IO.Path.GetExtension(pdfFilePath); //Create a PrintFilePDF object with the PDF file PrintFilePDF file = new PrintFilePDF(pdfFilePath, fileName); //Create a ClientPrintJob for printing the file! ClientPrintJob cpj2 = new ClientPrintJob(); //set file to print... cpj2.PrintFile = file; //set client printer... if (useDefaultPrinter2 || printerName2 == "null") cpj2.ClientPrinter = new DefaultPrinter(); else cpj2.ClientPrinter = new InstalledPrinter(printerName2); //Create a ClientPrintJobGroup for printing both ClientPrintJob! ClientPrintJobGroup cpjg = new ClientPrintJobGroup(); cpjg.Add(cpj1); cpjg.Add(cpj2); //send it... System.Web.HttpContext.Current.Response.ContentType = "application/octet-stream"; System.Web.HttpContext.Current.Response.BinaryWrite(cpjg.GetContent()); System.Web.HttpContext.Current.Response.End(); } }Creating SPA by using AngularJS
Create a new index.html file that will act as our view for detecting whether the client machine has the WebClientPrint Processor (WCPP) Utility installed as well as for listing client printers and to finally perform client side printing. This SPA features two parts or sections, one for "Detecting WCPP" and the other one for "Client side printing". The ClientPrintJob is generated by the controller created above from the Web API server side code. Copy/Paste the following markup:
Be sure this html file links to jQuery 1.4.1+ and to AngularJS 1.6.4+ files!
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8" /> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> </head> <body> <div ng-app="myApp" ng-controller="myCtrl"> <div id="wcppDetection"> <div id="msgInProgress"> <div id="mySpinner" style="width:32px;height:32px"></div> <br /> <h3>Detecting WCPP utility at client side...</h3> <h3>Please wait a few seconds...</h3> <br /> </div> <div id="msgInstallWCPP" style="display:none;"> <h3>#1 Install WebClientPrint Processor (WCPP)!</h3> <p> <strong>WCPP is a native app (without any dependencies!)</strong> that handles all print jobs generated by the <strong>WebClientPrint for ASP.NET component</strong> at the server side. The WCPP is in charge of the whole printing process and can be installed on <strong>Windows, Linux, Mac & Raspberry Pi!</strong> </p> <p> <a href="//www.neodynamic.com/downloads/wcpp/" target="_blank">Download and Install WCPP from Neodynamic website</a><br /> </p> <h3>#2 After installing WCPP...</h3> <p> <a href="#" onclick="javascript:$('#wcppDetection').hide();$('#printSection').show();">You can go and test the printing page...</a> </p> <script type="text/javascript"> var wcppPingTimeout_ms = 60000; //60 sec var wcppPingTimeoutStep_ms = 500; //0.5 sec function wcppDetectOnSuccess() { // WCPP utility is installed at the client side // redirect to WebClientPrint sample page // get WCPP version var wcppVer = arguments[0]; if (wcppVer.substring(0, 1) == "6"){ $('#wcppDetection').hide(); $('#printSection').show(); } else //force to install WCPP v6.0 wcppDetectOnFailure(); } function wcppDetectOnFailure() { // It seems WCPP is not installed at the client side // ask the user to install it $('#msgInProgress').hide(); $('#msgInstallWCPP').show(); } </script> </div> <input type="hidden" id="sid" name="sid" ng-value="sid" /> <script> $(function () { //Gen script for WCPP detection $.getScript('/WebClientPrintAPI/ProcessRequest?d=' + $('#sid').val()); }); </script> </div> <div id="printSection" style="display:none;"> <h3>Print RAW ESC/POS Commands and PDF File</h3> <h4>Print RAW ESC/POS Commands To the following printer:</h4> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter1" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters1"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters1" style="visibility:hidden"> <label for="installedPrinterName1">Select an installed Printer:</label> <select name="installedPrinterName1" id="installedPrinterName1"></select> </div> <h3>Print PDF To the following printer:</h3> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter2" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters2"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters2" style="visibility:hidden"> <label for="installedPrinterName2">Select an installed Printer:</label> <select name="installedPrinterName2" id="installedPrinterName2"></select> </div> <script type="text/javascript"> var wcppGetPrintersTimeout_ms = 60000; //60 sec var wcppGetPrintersTimeoutStep_ms = 500; //0.5 sec function wcpGetPrintersOnSuccess() { // Display client installed printers if (arguments[0].length > 0) { var p = arguments[0].split("|"); var options = ''; for (var i = 0; i < p.length; i++) { options += '<option>' + p[i] + '</option>'; } $('#installedPrinters1').css('visibility', 'visible'); $('#installedPrinterName1').html(options); $('#installedPrinterName1').focus(); $('#loadPrinters1').hide(); $('#installedPrinters2').css('visibility', 'visible'); $('#installedPrinterName2').html(options); $('#loadPrinters2').hide(); } else { alert("No printers are installed in your system."); } } function wcpGetPrintersOnFailure() { // Do something if printers cannot be got from the client alert("No printers are installed in your system."); } </script> <br /> <input type="button" style="font-size:18px" onclick="javascript:jsWebClientPrint.print('useDefaultPrinter1=' + $('#useDefaultPrinter1').attr('checked') + '&printerName1=' + $('#installedPrinterName1').val() + '&useDefaultPrinter2=' + $('#useDefaultPrinter2').attr('checked') + '&printerName2=' + $('#installedPrinterName2').val());" value="Print Commands And Files..." /> <script> $(function () { // Create Base64 Object var Base64 = { _keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=", encode: function (e) { var t = ""; var n, r, i, s, o, u, a; var f = 0; e = Base64._utf8_encode(e); while (f < e.length) { n = e.charCodeAt(f++); r = e.charCodeAt(f++); i = e.charCodeAt(f++); s = n >> 2; o = (n & 3) << 4 | r >> 4; u = (r & 15) << 2 | i >> 6; a = i & 63; if (isNaN(r)) { u = a = 64 } else if (isNaN(i)) { a = 64 } t = t + this._keyStr.charAt(s) + this._keyStr.charAt(o) + this._keyStr.charAt(u) + this._keyStr.charAt(a) } return t }, _utf8_encode: function (e) { e = e.replace(/\r\n/g, "\n"); var t = ""; for (var n = 0; n < e.length; n++) { var r = e.charCodeAt(n); if (r < 128) { t += String.fromCharCode(r) } else if (r > 127 && r < 2048) { t += String.fromCharCode(r >> 6 | 192); t += String.fromCharCode(r & 63 | 128) } else { t += String.fromCharCode(r >> 12 | 224); t += String.fromCharCode(r >> 6 & 63 | 128); t += String.fromCharCode(r & 63 | 128) } } return t } } // Creat script for client side printing var rootUrl = $(location).attr('protocol') + "//" + $(location).attr('host'); var ABSOLUTE_URL_TO_PRINT_JOB_CONTROLLER = rootUrl + '/PrintManyJobs/PrintRawCmdAndFile'; $.getScript('/WebClientPrintAPI/ProcessRequest?v6.0.0.0&' + new Date().getTime() + '&sid=' + $('#sid').val() + '&u=' + Base64.encode(ABSOLUTE_URL_TO_PRINT_JOB_CONTROLLER)); }); </script> </div> </div> <script> var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.sid = new Date().getTime(); }); </script> </body> </html>Creating HTTP Handlers
Create a new Generic Handler and name it WebClientPrintAPI and then copy/paste the following code:
public class WebClientPrintAPI : IHttpHandler { //********************************* // IMPORTANT NOTE // In this sample we store users related stuff (like // the list of printers and whether they have the WCPP // client utility installed) in the Application cache // object part of ASP.NET BUT you can change it to // another different storage (like a DB or file server)! // which will be required in Load Balacing scenarios //********************************* public void ProcessRequest (HttpContext context) { //get session ID string sessionID = (context.Request["sid"] != null) ? context.Request["sid"].ToString() : null; //get Query String string queryString = context.Request.Url.Query; try { //Determine and get the Type of Request RequestType prType = WebClientPrint.GetProcessRequestType(queryString); if (prType == RequestType.GenPrintScript || prType == RequestType.GenWcppDetectScript) { //Let WebClientPrint to generate the requested script byte[] script = WebClientPrint.GenerateScript(context.Request.Url.AbsoluteUri.Replace(queryString, ""), queryString); context.Response.ContentType = "text/javascript"; context.Response.BinaryWrite(script); } else if (prType == RequestType.ClientSetWcppVersion) { //This request is a ping from the WCPP utility //so store the session ID indicating this user has the WCPP installed //also store the WCPP Version if available string wcppVersion = context.Request["wcppVer"]; if (string.IsNullOrEmpty(wcppVersion)) wcppVersion = "1.0.0.0"; context.Application.Set(sessionID + "wcppInstalled", wcppVersion); } else if (prType == RequestType.ClientSetInstalledPrinters) { //WCPP Utility is sending the installed printers at client side //so store this info with the specified session ID string printers = context.Request["printers"]; if (string.IsNullOrEmpty(printers) == false) printers = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printers)); context.Application.Set(sessionID + "printers", printers); } else if (prType == RequestType.ClientSetInstalledPrintersInfo) { //WCPP Utility is sending the client installed printers with detailed info //so store this info with the specified session ID //Printers Info is in JSON format string printersInfo = context.Request.Form["printersInfoContent"]; if (string.IsNullOrEmpty(printersInfo) == false) printersInfo = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printersInfo)); context.Application.Set(sessionID + "printersInfo", printersInfo); } else if (prType == RequestType.ClientGetWcppVersion) { //return the WCPP version for the specified Session ID (sid) if any bool sidWcppVersion = (context.Application[sessionID + "wcppInstalled"] != null); context.Response.ContentType = "text/plain"; context.Response.Write(sidWcppVersion ? context.Application[sessionID + "wcppInstalled"] : ""); } else if (prType == RequestType.ClientGetInstalledPrinters) { //return the installed printers for the specified Session ID (sid) if any bool sidHasPrinters = (context.Application[sessionID + "printers"] != null); context.Response.ContentType = "text/plain"; context.Response.Write(sidHasPrinters ? context.Application[sessionID + "printers"] : ""); } else if (prType == RequestType.ClientGetInstalledPrintersInfo) { //return the installed printers with detailed info for the specified Session ID (sid) if any bool sidHasPrinters = (context.Application[sessionID + "printersInfo"] != null); context.Response.ContentType = "text/plain"; context.Response.Write(sidHasPrinters ? context.Application[sessionID + "printersInfo"] : ""); } } catch (Exception ex) { context.Response.StatusCode = 500; context.Response.ContentType = "text/plain"; context.Response.Write(ex.Message + " - " + ex.StackTrace); } } public bool IsReusable { get { return false; } } }Create a new Generic Handler and name it PrintManyJobsHandler and then copy/paste the following code:
<%@ WebHandler Language="C#" Class="PrintManyJobsHandler" %> using System; using System.Web; using Neodynamic.SDK.Web; public class PrintPDFHandler : IHttpHandler { /*############### IMPORTANT!!! ############ If your website requires AUTHENTICATION, then you MUST configure THIS Handler file to be ANONYMOUS access allowed!!! ######################################### */ public void ProcessRequest (HttpContext context) { if (WebClientPrint.ProcessPrintJob(context.Request.Url.Query)) { //We'll create TWO ClientPrintJob objects, one for printing the RAW commands and the other one for printing the PDF file //Create ESC/POS commands for sample receipt string ESC = "0x1B"; //ESC byte in hex notation string NewLine = "0x0A"; //LF byte in hex notation string cmds = ESC + "@"; //Initializes the printer (ESC @) cmds += ESC + "!" + "0x38"; //Emphasized + Double-height + Double-width mode selected (ESC ! (8 + 16 + 32)) 56 dec => 38 hex cmds += "BEST DEAL STORES"; //text to print cmds += NewLine + NewLine; cmds += ESC + "!" + "0x00"; //Character font A selected (ESC ! 0) cmds += "COOKIES 5.00"; cmds += NewLine; cmds += "MILK 65 Fl oz 3.78"; cmds += NewLine + NewLine; cmds += "SUBTOTAL 8.78"; cmds += NewLine; cmds += "TAX 5% 0.44"; cmds += NewLine; cmds += "TOTAL 9.22"; cmds += NewLine; cmds += "CASH TEND 10.00"; cmds += NewLine; cmds += "CASH DUE 0.78"; cmds += NewLine + NewLine; cmds += ESC + "!" + "0x18"; //Emphasized + Double-height mode selected (ESC ! (16 + 8)) 24 dec => 18 hex cmds += "# ITEMS SOLD 2"; cmds += ESC + "!" + "0x00"; //Character font A selected (ESC ! 0) cmds += NewLine + NewLine; cmds += "11/03/13 19:53:17"; //Create a ClientPrintJob and send it back to the client! ClientPrintJob cpj1 = new ClientPrintJob(); //set ESCPOS commands to print... cpj1.PrinterCommands = cmds; cpj1.FormatHexValues = true; bool useDefaultPrinter1 = (Request["useDefaultPrinter1"] == "checked"); string printerName1 = Server.UrlDecode(Request["printerName1"]); //set client printer... if (useDefaultPrinter1 || printerName1 == "null") cpj1.ClientPrinter = new DefaultPrinter(); else cpj1.ClientPrinter = new InstalledPrinter(printerName1); //Now the ClientPrintJob for the PDF file //full path of the PDF file to be printed string pdfFilePath = @"c:\myDocument.pdf"; //create a temp file name for our PDF file... string fileName = "MyFile-" + Guid.NewGuid().ToString("N") + System.IO.Path.GetExtension(pdfFilePath); //Create a PrintFilePDF object with the PDF file PrintFilePDF file = new PrintFilePDF(pdfFilePath, fileName); //Create a ClientPrintJob for printing the file! ClientPrintJob cpj2 = new ClientPrintJob(); //set file to print... cpj2.PrintFile = file; bool useDefaultPrinter2 = (Request["useDefaultPrinter2"] == "checked"); string printerName2 = Server.UrlDecode(Request["printerName2"]); //set client printer... if (useDefaultPrinter2 || printerName2 == "null") cpj2.ClientPrinter = new DefaultPrinter(); else cpj2.ClientPrinter = new InstalledPrinter(printerName2); //Create a ClientPrintJobGroup for printing both ClientPrintJob! ClientPrintJobGroup cpjg = new ClientPrintJobGroup(); cpjg.Add(cpj1); cpjg.Add(cpj2); //send it... context.Response.ContentType = "application/octet-stream"; context.Response.BinaryWrite(cpjg.GetContent()); context.Response.End(); } } public bool IsReusable { get { return false; } } }Creating/Editing WebForm Pages
Be sure ALL *.aspx link to jQuery 1.4.1+ file!
The default page is for detecting whether the client machine has the WebClientPrint Processor (WCPP) Utility installed. Edit the Default.aspx file and copy/paste the following code inside the BODY:
<div id="msgInProgress"> <div id="mySpinner" style="width:32px;height:32px"></div> <br /> <h3>Detecting WCPP utility at client side...</h3> <h3>Please wait a few seconds...</h3> <br /> </div> <div id="msgInstallWCPP" style="display:none;"> <h3>#1 Install WebClientPrint Processor (WCPP)!</h3> <p> <strong>WCPP is a native app (without any dependencies!)</strong> that handles all print jobs generated by the <strong>WebClientPrint for ASP.NET component</strong> at the server side. The WCPP is in charge of the whole printing process and can be installed on <strong>Windows, Linux, Mac & Raspberry Pi!</strong> </p> <p> <a href="//www.neodynamic.com/downloads/wcpp/" target="_blank" >Download and Install WCPP from Neodynamic website</a><br /> </p> <h3>#2 After installing WCPP...</h3> <p> <a href="PrintManyJobs.aspx" >You can go and test the printing page...</a> </p> </div> <script type="text/javascript"> var wcppPingTimeout_ms = 60000; //60 sec var wcppPingTimeoutStep_ms = 500; //0.5 sec function wcppDetectOnSuccess(){ // WCPP utility is installed at the client side // redirect to WebClientPrint sample page // get WCPP version var wcppVer = arguments[0]; if(wcppVer.substring(0, 1) == "6") window.location.href = 'PrintManyJobs.aspx'; else //force to install WCPP v6.0 wcppDetectOnFailure(); } function wcppDetectOnFailure() { // It seems WCPP is not installed at the client side // ask the user to install it $('#msgInProgress').hide(); $('#msgInstallWCPP').show(); } </script> <%-- WCPP detection script code --%> <%=Neodynamic.SDK.Web.WebClientPrint.CreateWcppDetectionScript(HttpContext.Current.Request.Url.Scheme + "://" + HttpContext.Current.Request.Url.Host + ":" + HttpContext.Current.Request.Url.Port + "/WebClientPrintAPI.ashx", HttpContext.Current.Session.SessionID)%>Add a new page and name it PrintManyJobs.aspx. Copy/paste the following code inside the BODY:
<h4>Print RAW ESC/POS Commands To the following printer:</h4> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter1" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters1"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters1" style="visibility:hidden"> <label for="installedPrinterName1">Select an installed Printer:</label> <select name="installedPrinterName1" id="installedPrinterName1"></select> </div> <h3>Print PDF To the following printer:</h3> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter2" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters2"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters2" style="visibility:hidden"> <label for="installedPrinterName2">Select an installed Printer:</label> <select name="installedPrinterName2" id="installedPrinterName2"></select> </div> <script type="text/javascript"> var wcppGetPrintersTimeout_ms = 60000; //60 sec var wcppGetPrintersTimeoutStep_ms = 500; //0.5 sec function wcpGetPrintersOnSuccess() { // Display client installed printers if (arguments[0].length > 0) { var p = arguments[0].split("|"); var options = ''; for (var i = 0; i < p.length; i++) { options += '<option>' + p[i] + '</option>'; } $('#installedPrinters1').css('visibility', 'visible'); $('#installedPrinterName1').html(options); $('#installedPrinterName1').focus(); $('#loadPrinters1').hide(); $('#installedPrinters2').css('visibility', 'visible'); $('#installedPrinterName2').html(options); $('#loadPrinters2').hide(); } else { alert("No printers are installed in your system."); } } function wcpGetPrintersOnFailure() { // Do something if printers cannot be got from the client alert("No printers are installed in your system."); } </script> <br /> <input type="button" style="font-size:18px" onclick="javascript:jsWebClientPrint.print('useDefaultPrinter1=' + $('#useDefaultPrinter1').attr('checked') + '&printerName1=' + $('#installedPrinterName1').val() + '&useDefaultPrinter2=' + $('#useDefaultPrinter2').attr('checked') + '&printerName2=' + $('#installedPrinterName2').val());" value="Print Commands And Files..." /> <%-- Register the WebClientPrint script code --%> <%=Neodynamic.SDK.Web.WebClientPrint.CreateScript(HttpContext.Current.Request.Url.Scheme + "://" + HttpContext.Current.Request.Url.Host + ":" + HttpContext.Current.Request.Url.Port + "/WebClientPrintAPI.ashx", HttpContext.Current.Request.Url.Scheme + "://" + HttpContext.Current.Request.Url.Host + ":" + HttpContext.Current.Request.Url.Port + "/PrintManyJobsHandler.ashx", HttpContext.Current.Session.SessionID)%>Creating HTTP Handlers
Create a new Generic Handler and name it WebClientPrintAPI and then copy/paste the following code:
<%@ WebHandler Language="VB" Class="WebClientPrintAPI" %> Imports System Imports System.Web Imports Neodynamic.SDK.Web Public Class WebClientPrintAPI : Implements IHttpHandler '********************************* ' IMPORTANT NOTE ' In this sample we store users related stuff (like ' the list of printers and whether they have the WCPP ' client utility installed) in the Application cache ' object part of ASP.NET BUT you can change it to ' another different storage (like a DB or file server)! ' which will be required in Load Balacing scenarios '********************************* Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest 'get session ID Dim sessionID As String = "" If (context.Request("sid") IsNot Nothing) Then sessionID = context.Request("sid") End If 'get Query String Dim queryString As String = context.Request.Url.Query Try 'Determine and get the Type of Request Dim prType As RequestType = WebClientPrint.GetProcessRequestType(queryString) If prType = RequestType.GenPrintScript OrElse prType = RequestType.GenWcppDetectScript Then 'Let WebClientPrint to generate the requested script Dim script As Byte() = WebClientPrint.GenerateScript(context.Request.Url.AbsoluteUri.Replace(queryString, ""), queryString) context.Response.ContentType = "text/javascript" context.Response.BinaryWrite(script) ElseIf prType = RequestType.ClientSetWcppVersion Then 'This request is a ping from the WCPP utility 'so store the session ID indicating this user has the WCPP installed 'also store the WCPP Version if available Dim wcppVersion As String = context.Request("wcppVer") If String.IsNullOrEmpty(wcppVersion) Then wcppVersion = "1.0.0.0" End If context.Application.Set(sessionID & "wcppInstalled", wcppVersion) ElseIf prType = RequestType.ClientSetInstalledPrinters Then 'WCPP Utility is sending the installed printers at client side 'so store this info with the specified session ID Dim printers As String = context.Request("printers") If Not String.IsNullOrEmpty(printers) Then printers = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printers)) End If context.Application.Set(sessionID & "printers", printers) ElseIf prType = RequestType.ClientSetInstalledPrintersInfo Then 'WCPP Utility is sending the installed printers at client side 'so store this info with the specified session ID 'Printers Info is in JSON format Dim printersInfo As String = context.Request.Form("printersInfoContent") If Not String.IsNullOrEmpty(printersInfo) Then printersInfo = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(printersInfo)) End If context.Application.Set(sessionID & "printersInfo", printersInfo) ElseIf prType = RequestType.ClientGetWcppVersion Then 'return the WCPP version for the specified Session ID (sid) if any Dim sidWcppVersion As Boolean = (context.Application(sessionID & "wcppInstalled") IsNot Nothing) context.Response.ContentType = "text/plain" If (sidWcppVersion) Then context.Response.Write(context.Application(sessionID & "wcppInstalled").ToString()) End If ElseIf prType = RequestType.ClientGetInstalledPrinters Then 'return the installed printers for the specified Session ID (sid) if any Dim sidHasPrinters As Boolean = (context.Application(sessionID & "printers") IsNot Nothing) context.Response.ContentType = "text/plain" If (sidHasPrinters) Then context.Response.Write(context.Application(sessionID & "printers").ToString()) End If ElseIf prType = RequestType.ClientGetInstalledPrintersInfo Then 'return the installed printers with detailed info for the specified Session ID (sid) if any Dim sidHasPrinters As Boolean = (context.Application(sessionID & "printersInfo") IsNot Nothing) context.Response.ContentType = "text/plain" If (sidHasPrinters) Then context.Response.Write(context.Application(sessionID & "printersInfo").ToString()) End If End If Catch ex As Exception context.Response.StatusCode = 500 context.Response.ContentType = "text/plain" context.Response.Write(ex.Message + " - " + ex.StackTrace) End Try End Sub Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable Get Return False End Get End Property End ClassCreate a new Generic Handler and name it PrintManyJobsHandler and then copy/paste the following code:
<%@ WebHandler Language="VB" Class="PrintManyJobsHandler" %> Imports System Imports System.Web Imports Neodynamic.SDK.Web Public Class PrintPDFHandler : Implements IHttpHandler '############### IMPORTANT!!! ############ ' If your website requires AUTHENTICATION, then you MUST configure THIS Handler file ' to be ANONYMOUS access allowed!!! '######################################### Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest If WebClientPrint.ProcessPrintJob(context.Request.Url.Query) Then 'We'll create TWO ClientPrintJob objects, one for printing the RAW commands and the other one for printing the PDF file 'Create ESC/POS commands for sample receipt Dim ESC As String = "0x1B" 'ESC byte in hex notation Dim NewLine As String = "0x0A" 'LF byte in hex notation Dim cmds As String = ESC & "@" 'Initializes the printer (ESC @) cmds += ESC & "!" & "0x38" 'Emphasized + Double-height + Double-width mode selected (ESC ! (8 + 16 + 32)) 56 dec => 38 hex cmds += "BEST DEAL STORES" 'text to print cmds += NewLine & NewLine cmds += ESC & "!" & "0x00" 'Character font A selected (ESC ! 0) cmds += "COOKIES 5.00" cmds += NewLine cmds += "MILK 65 Fl oz 3.78" cmds += NewLine & NewLine cmds += "SUBTOTAL 8.78" cmds += NewLine cmds += "TAX 5% 0.44" cmds += NewLine cmds += "TOTAL 9.22" cmds += NewLine cmds += "CASH TEND 10.00" cmds += NewLine cmds += "CASH DUE 0.78" cmds += NewLine & NewLine cmds += ESC & "!" & "0x18" 'Emphasized + Double-height mode selected (ESC ! (16 + 8)) 24 dec => 18 hex cmds += "# ITEMS SOLD 2" cmds += ESC & "!" & "0x00" 'Character font A selected (ESC ! 0) cmds += NewLine & NewLine cmds += "11/03/13 19:53:17" 'Create a ClientPrintJob and send it back to the client! Dim cpj1 As New ClientPrintJob() 'set ESCPOS commands to print... cpj1.PrinterCommands = cmds cpj1.FormatHexValues = True 'set client printer... Dim useDefaultPrinter1 As Boolean = (Request("useDefaultPrinter1") = "checked") Dim printerName1 As String = Server.UrlDecode(Request("printerName1")) If useDefaultPrinter1 OrElse printerName1 = "null" Then cpj1.ClientPrinter = New DefaultPrinter() Else cpj1.ClientPrinter = New InstalledPrinter(printerName1) End If 'Now the ClientPrintJob for the PDF file 'full path of the PDF file to be printed Dim pdfFilePath As String = "c:\myDocument.pdf" 'create a temp file name for our PDF file... Dim fileName As String = "MyFile-" + Guid.NewGuid().ToString("N") & System.IO.Path.GetExtension(pdfFilePath) 'Create a PrintFilePDF object with the PDF file Dim file As New PrintFilePDF(pdfFilePath, fileName) 'Create a ClientPrintJob for printing the file! Dim cpj2 As New ClientPrintJob() 'set file to print... cpj2.PrintFile = file 'set client printer... Dim useDefaultPrinter2 As Boolean = (Request("useDefaultPrinter2") = "checked") Dim printerName2 As String = Server.UrlDecode(Request("printerName2")) If useDefaultPrinter2 OrElse printerName2 = "null" Then cpj2.ClientPrinter = New DefaultPrinter() Else cpj2.ClientPrinter = New InstalledPrinter(printerName2) End If 'Create a ClientPrintJobGroup for printing both ClientPrintJob! Dim cpjg As New ClientPrintJobGroup() cpjg.Add(cpj1) cpjg.Add(cpj2) context.Response.ContentType = "application/octet-stream" context.Response.BinaryWrite(cpjg.GetContent()) context.Response.End() End If End Sub Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable Get Return False End Get End Property End ClassCreating/Editing WebForm Pages
Be sure ALL *.aspx link to jQuery 1.4.1+ file!
The default page is for detecting whether the client machine has the WebClientPrint Processor (WCPP) Utility installed. Edit the Default.aspx file and copy/paste the following code inside the BODY:
<div id="msgInProgress"> <div id="mySpinner" style="width:32px;height:32px"></div> <br /> <h3>Detecting WCPP utility at client side...</h3> <h3>Please wait a few seconds...</h3> <br /> </div> <div id="msgInstallWCPP" style="display:none;"> <h3>#1 Install WebClientPrint Processor (WCPP)!</h3> <p> <strong>WCPP is a native app (without any dependencies!)</strong> that handles all print jobs generated by the <strong>WebClientPrint for ASP.NET component</strong> at the server side. The WCPP is in charge of the whole printing process and can be installed on <strong>Windows, Linux, Mac & Raspberry Pi!</strong> </p> <p> <a href="//www.neodynamic.com/downloads/wcpp/" target="_blank" >Download and Install WCPP from Neodynamic website</a><br /> </p> <h3>#2 After installing WCPP...</h3> <p> <a href="PrintManyJobs.aspx" >You can go and test the printing page...</a> </p> </div> <script type="text/javascript"> var wcppPingTimeout_ms = 60000; //60 sec var wcppPingTimeoutStep_ms = 500; //0.5 sec function wcppDetectOnSuccess(){ // WCPP utility is installed at the client side // redirect to WebClientPrint sample page // get WCPP version var wcppVer = arguments[0]; if(wcppVer.substring(0, 1) == "6") window.location.href = 'PrintManyJobs.aspx'; else //force to install WCPP v6.0 wcppDetectOnFailure(); } function wcppDetectOnFailure() { // It seems WCPP is not installed at the client side // ask the user to install it $('#msgInProgress').hide(); $('#msgInstallWCPP').show(); } </script> <%-- WCPP detection script code --%> <%=Neodynamic.SDK.Web.WebClientPrint.CreateWcppDetectionScript(HttpContext.Current.Request.Url.Scheme + "://" + HttpContext.Current.Request.Url.Host + ":" + HttpContext.Current.Request.Url.Port + "/WebClientPrintAPI.ashx", HttpContext.Current.Session.SessionID)%>Add a new page and name it PrintPDF.aspx. Copy/paste the following code inside the BODY:
<h4>Print RAW ESC/POS Commands To the following printer:</h4> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter1" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters1"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters1" style="visibility:hidden"> <label for="installedPrinterName1">Select an installed Printer:</label> <select name="installedPrinterName1" id="installedPrinterName1"></select> </div> <h3>Print PDF To the following printer:</h3> <div> <label class="checkbox"> <input type="checkbox" id="useDefaultPrinter2" /> <strong>Print to Default printer</strong> or... </label> </div> <div id="loadPrinters2"> Click to load and select one of the installed printers! <br /> <input type="button" onclick="javascript:jsWebClientPrint.getPrinters();" value="Load installed printers..." /> <br /><br /> </div> <div id="installedPrinters2" style="visibility:hidden"> <label for="installedPrinterName2">Select an installed Printer:</label> <select name="installedPrinterName2" id="installedPrinterName2"></select> </div> <script type="text/javascript"> var wcppGetPrintersTimeout_ms = 60000; //60 sec var wcppGetPrintersTimeoutStep_ms = 500; //0.5 sec function wcpGetPrintersOnSuccess() { // Display client installed printers if (arguments[0].length > 0) { var p = arguments[0].split("|"); var options = ''; for (var i = 0; i < p.length; i++) { options += '<option>' + p[i] + '</option>'; } $('#installedPrinters1').css('visibility', 'visible'); $('#installedPrinterName1').html(options); $('#installedPrinterName1').focus(); $('#loadPrinters1').hide(); $('#installedPrinters2').css('visibility', 'visible'); $('#installedPrinterName2').html(options); $('#loadPrinters2').hide(); } else { alert("No printers are installed in your system."); } } function wcpGetPrintersOnFailure() { // Do something if printers cannot be got from the client alert("No printers are installed in your system."); } </script> <br /> <input type="button" style="font-size:18px" onclick="javascript:jsWebClientPrint.print('useDefaultPrinter1=' + $('#useDefaultPrinter1').attr('checked') + '&printerName1=' + $('#installedPrinterName1').val() + '&useDefaultPrinter2=' + $('#useDefaultPrinter2').attr('checked') + '&printerName2=' + $('#installedPrinterName2').val());" value="Print Commands And Files..." /> <%-- Register the WebClientPrint script code --%> <%=Neodynamic.SDK.Web.WebClientPrint.CreateScript(HttpContext.Current.Request.Url.Scheme + "://" + HttpContext.Current.Request.Url.Host + ":" + HttpContext.Current.Request.Url.Port + "/WebClientPrintAPI.ashx", HttpContext.Current.Request.Url.Scheme + "://" + HttpContext.Current.Request.Url.Host + ":" + HttpContext.Current.Request.Url.Port + "/PrintManyJobsHandler.ashx", HttpContext.Current.Session.SessionID)%> - That's it! Run your website and test it. Remember to change the file names in the source code to match yours there.