简体   繁体   English

JavaScript:将原始文本发送到打印机 - 没有服务器请求/方法调用,能够脱机工作,纯粹是客户端

[英]JavaScript: Send raw text to printer - no server requests/method calls, able to work offline, purely clientside

My thorough research on the web provided me with a couple of ideas, but none of them seem to work correctly in my particular use case. 我对网络的深入研究为我提供了一些想法,但在我的特定用例中似乎没有一个能够正常工作。 Here is what I have: 这是我有的:

1) Zebra printer, which uses ZPL as its printing language; 1)Zebra打印机,使用ZPL作为其打印语言;

2) A string in javascript which consists of 3 ZPL forms for printing 3 labels. 2)javascript中的一个字符串,由3个ZPL表单组成,用于打印3个标签。

Our system engineer has verified already, that the ZPL syntax is all correct. 我们的系统工程师已经验证过,ZPL语法都是正确的。 What I am trying to achieve is to send the string as plain text for the printer to accept it as ZPL instructions to print labels. 我想要实现的是将字符串作为纯文本发送给打印机,以接受它作为打印标签的ZPL指令。 The best I have come up with so far looks like this: 到目前为止,我提出的最好的看起来像这样:

var mywindow = window.open('', 'Printing', 'width=800,height=600');
//mywindow.write("testDirectWrite"); // not working
mywindow.document.open('text/plain');
////mywindow.document.write('<html><head><title>Printing</title><meta charset="ISO-8859-1">');
///*optional stylesheet*/ //mywindow.document.write('<link rel="stylesheet" href="main.css" type="text/css" />');
////mywindow.document.write('</head><body>');
var theDiv = $(".test-printirane-po-usb");
var printContents = theDiv[0].innerText;
mywindow.document.write(printContents);
////mywindow.document.write('</body></html>');

//mywindow.document.close(); // necessary for IE >= 10
//mywindow.focus(); // necessary for IE >= 10

//mywindow.print();
//mywindow.close();

For now (testing purposes), theDiv is the container where i place the ZPL string. 就目前而言(测试目的),theDiv是我放置ZPL字符串的容器。 Basically, I understood, that the best solution is to open a new popup window, fill it with the ZPL string and call thePopupWindow.print(); 基本上,我明白,最好的解决方案是打开一个新的弹出窗口,用ZPL字符串填充它并调用thePopupWindow.print(); The user then selects the zebra printer and hits 'Print'. 然后用户选择斑马打印机并点击“打印”。 The problem: it seems like the printer interprets what's being printed as an html page (because of the 问题是:看起来打印机会将正在打印的内容解释为html页面(因为

<html><head></head><body>theZPLString comes here</body></html>

tags, that i see, when I inspect the popup in Chrome, for example) and prints the ZPL code as plain text, rather than interpret it and print a label. 标签,我看,当我检查Chrome中的弹出窗口时,并将ZPL代码打印为纯文本,而不是解释它并打印标签。 I suppose I need something like thePopupWindow.write() to avoid writing to the document property of the window, which obviously wraps the string in html code. 我想我需要类似thePopupWindow.write()来避免写入窗口的document属性,这显然将字符串包装在html代码中。 In order to test it, I use the Generic/Text Only driver and save what's "printed" into a .txt file. 为了测试它,我使用Generic / Text Only驱动程序并将“打印”保存到.txt文件中。

In Chrome I get an empty file. 在Chrome中,我收到一个空文件。

In Mozilla, when I remove this line: mywindow.document.open('text/plain'); 在Mozilla中,当我删除这一行时:mywindow.document.open('text / plain'); I get the ZPL as characters, one per line. 我把ZPL作为字符,每行一个。 When I add it, I get only a date and time, again one char per line. 当我添加它时,我只得到一个日期和时间,每行再一个字符。

In IE - I get this (with or without mywindow.document.open('text/plain');): 在IE中 - 我得到这个(有或没有mywindow.document.open('text / plain');):

Page 1 o



    ^XA^PW400^LL37^





          12.4.2016

I found various solutions, but they involve using php, c#, even java and I don't want it to be server-side, as mentioned in the title. 我找到了各种解决方案,但它们涉及使用php,c#,甚至java,我不希望它是服务器端,如标题中所述。 Any help will be appreciated. 任何帮助将不胜感激。 @forgivenson, thanks for the point. @forgivenson,谢谢你的观点。 After reading yours, I saw the little 'x', that I can click to delete my comment, so I added the comment within the question. 读完你的后,我看到了小'x',我可以点击删除我的评论,所以我在问题中添加了评论。 I missed something very important: the printer is connected via USB port! 我错过了一些非常重要的东西:打印机通过USB端口连接!

When printing to a Zebra printer, everything before ^XA and after ^XZ is ignored. 打印到Zebra打印机时, ^XA之前和^XZ之后的所有内容都将被忽略。 The html tags around the zpl don't interfere. zpl周围的html标签不会干扰。

The only thing you must ensure is that you print RAW text to the printer. 您必须确保唯一的事情是将RAW文本打印到打印机。

Use the build in windows Generic / Text Only driver for your Zebra printer . 使用Zebra打印机的内置W​​indows Generic / Text Only驱动程序 Instead of the zebra driver. 而不是斑马司机。

  • The normal zebra driver: renders the print job to a bitmap 普通斑马驱动程序:将打印作业呈现为位图
    • result: a slow printed image of your zpl code. 结果:zpl代码的慢速打印图像。
  • The text only driver: sends the zpl code straight to the printer 仅文本驱动程序:将zpl代码直接发送到打印机
    • result: a fast printed sticker, from zpl rendered on the printer 结果:来自打印机上呈现的zpl的快速打印贴纸

Example on jsfiddle or on gist.run 关于jsfiddlegist.run的示例

function printZpl(zpl) {
  var printWindow = window.open();
  printWindow.document.open('text/plain')
  printWindow.document.write(zpl);
  printWindow.document.close();
  printWindow.focus();
  printWindow.print();
  printWindow.close();
}

Tested in 测试中

  • Edge 边缘
  • Internet Explorer IE浏览器
  • Firefox 火狐

Not working in: 不工作:


Select the Generic / Text Only driver in your printer properties: 在打印机属性中选择Generic / Text Only驱动程序:

Zebra打印机 -  Generic / Text Only驱动程序

Following snippet worked for me on Firefox and IE11 , with a little change to printer's properties. 以下片段在FirefoxIE11上为我工作,对打印机的属性稍作改动。

I was using this printer emulator. 我正在使用台打印机模拟器。

In Chrome I get error from emulator when printing from Chrome's Print Dialog. Chrome中 ,从Chrome的“打印”对话框打印时,我从模拟器中收到错误消息。 Using system dialog gives error about printing failure from Chrome. 使用系统对话框会出现有关Chrome打印失败的错误。 CTRL + SHIFT + P(shortcut to skip Chrome dialog) no error and nothing happens. CTRL + SHIFT + P(跳过Chrome对话框的快捷方式)没有错误,没有任何反应。 All these errors may be related to emulator, but I don't have real printer to test it. 所有这些错误都可能与模拟器有关,但我没有真正的打印机来测试它。

In Printer's Properties I set following options: 打印机的属性中,我设置了以下选项:

  • Begin Print Job : ${ 开始打印作业: ${
  • End Print Job: }$ 结束打印作业: }$

As you can see in script below ZPL code is wrapped in '${' and '}$' 正如您在下面的脚本中看到的那样,ZPL代码包含在'${''}$'

<script type="text/javascript">
  function openWin() {
    var printWindow = window.open();
    printWindow.document.open('text/plain')
    printWindow.document.write('${^XA^FO50,100^BXN,10,200^FDYourTextHere^FS^XZ}$');
    printWindow.document.close();
    printWindow.focus();
    printWindow.print();
  }
</script>
<input type="button" value="Print code" onclick="openWin()" />

JSFiddle 的jsfiddle

If you want to accomplish this consistently without involving the opening of popups or user prompts, you are going to need an application running on the client PC to act as mediator between your application's javascript and the client's printer. 如果要在不涉及打开弹出窗口或用户提示的情况下始终如一地完成此操作,则需要在客户端PC上运行的应用程序充当应用程序的javascript和客户端打印机之间的中介。

One popular way of doing this is via a browser plugin (NPAPI). 一种流行的方法是通过浏览器插件(NPAPI)。 But this approach is quickly becoming obsolete as many browsers have begun to remove NPAPI support entirely ( Chrome , Firefox ). 但是这种方法很快就会过时,因为许多浏览器已经开始完全删除NPAPI支持( ChromeFirefox )。

Another approach is to develop a small application that runs on your client's PC which listens for websocket connections. 另一种方法是开发一个在客户端PC上运行的小应用程序,它可以监听websocket连接。 Your web application will send the ZPL through a connection to the client's websocket server, which in turn will generate a print job. 您的Web应用程序将通过与客户端的websocket服务器的连接发送ZPL,而后者将生成打印作业。

A third approach - some printers have an internal IP address that can be sent raw ZPL. 第三种方法 - 一些打印机具有可以原始ZPL发送的内部IP地址。 If you build your web application so that a user can configure this IP address, it would be an option to send the ZPL to that address. 如果您构建Web应用程序以便用户可以配置此IP地址,则可以选择将ZPL发送到该地址。 However, this won't work if your users are using printers that don't support this functionality. 但是,如果您的用户使用的打印机不支持此功能,则无法使用此功能。

Zebra created an application called (BROWSER PRINT) they released April 2016. It appears to be a local JAVA service that runs on your computer and exposes a pseudo rest api. Zebra创建了一个名为(BROWSER PRINT)的应用程序,它们于2016年4月发布。它似乎是一个在您的计算机上运行的本地JAVA服务,并公开了伪休息api。 They provide a javascript api to hide the details and simplify usage. 它们提供了一个javascript api来隐藏细节并简化使用。

Currently supports (ZD500, ZD410, LP2824+, ZT230, ZT420, QLn320, GX420) 目前支持(ZD500,ZD410,LP2824 +,ZT230,ZT420,QLn320,GX420)

It allows you to select the printer if there are multiple. 如果有多个打印机,它允许您选择打印机。 Also allows 2 way communication where you can ask the printer it's status and get the result. 还允许双向通信,您可以询问打印机的状态并获得结果。 They recently added support for printers connected to Ethernet but do not support printers mapped via Windows UNC path. 他们最近添加了对连接到以太网的打印机的支持,但不支持通过Windows UNC路径映射的打印机。

https://www.zebra.com/us/en/products/software/barcode-printers/link-os/browser-print.html https://www.zebra.com/us/en/products/software/barcode-printers/link-os/browser-print.html

You see, the main problem here is that the Zebra commands will only work if you can send the raw, unmodified bytes directly to the printer port; 你看,这里的主要问题是Zebra命令只有在你可以将未经修改的原始字节直接发送到打印机端口时才能工作。 the browser won't allow you to do that, unfortunately. 不幸的是,浏览器不允许你这样做。

You will need some way to get such direct acess: 你需要一些方法来获得这样的直接访问:

  • One way would be through a browser extension, so you'd have less restricted access to the hardware; 一种方法是通过浏览器扩展,因此您对硬件的访问权限较少; you could do that through NPAPI, but Chrome does not support that, and both Mozilla and IE will cease supporting that really soon;; 你可以通过NPAPI做到这一点,但Chrome不支持这一点,Mozilla和IE都将很快停止支持; Chrome can allow direct access to the hardware through the Native Messaging API ; Chrome可以允许通过Native Messaging API直接访问硬件; Mozilla may support a similar solution really soon; Mozilla可能很快就会支持类似的解决方案 ;
  • Another option would be to use a Java JNLP application to provide such an access, and it can be called from a browser. 另一种选择是使用Java JNLP应用程序来提供这种访问,并且可以从浏览器调用它。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Webapp 可以离线工作! - Webapp able to work offline ! 如何在JavaScript中纯粹使用Map数据类型 - How to purely work with the Map datatype in JavaScript 我如何将原始数据从 javascript 发送到 Nativescript 中的 ESC/POS 联网打印机(无蓝牙) - how do i send raw data from javascript to an ESC/POS networked printer in Nativescript (no bluetooth) 从客户端 Javascript 签署街景静态 API 请求是否可能/值得? - Is it possible/worthwhile to sign Streetview Static API requests from clientside Javascript? 使用 JavaScript 将文档发送到打印机? - Send documents to printer using JavaScript? 使用javascript从textarea获取原始文本并将其发送到PHP - Get raw text from textarea with javascript and send it to PHP 使用Javascript向服务器发送多个请求,直到服务器返回200 - Use Javascript to send multiple requests to server until server returns 200 在客户端获取浏览器请求 - get browser requests in clientside 如何将原始命令发送到 Node.JS 中的收据打印机? - How to send Raw Commands to Receipt Printer in Node.JS? AJAX 和 JavaScript 可以纯粹用于服务器端脚本吗? - Can AJAX and JavaScript be used purely for server side scripting?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM