分类归档 产品策划

通过孟繁永

如何优雅的转发会员付费文章

微信群里经常收到这样的文章,但看到财新我就怕了,你看半截,就看不下去了,因为人家要会员。

那如果自己有会员,又想把这篇文章分享给自己的朋友,该怎么办呢?

请看我在八年前提到的分享定价模式(http://futuremeng.com/?p=4244

具体来说,如果我是会员,我又想把一篇只有会员才能看的文章分享给朋友看,那我就为这篇文章付费,当然需要平台支持,买下若干次分享的权益,然后再转发到群里。

这样,最先若干个打开的用户就可以看了。分享数不够的时候,还可以点击申请分享者追加付费。

通过孟繁永

自制热敏打印机连接器始末(9)为什么要在osx上添加cups才能将指令发送到打印机

这个问题我一直很困惑,正如上一篇提到的raw打印,按说raw的意思就是直接将原始指令直接发送到设备上,比如将打印机视作一个usb设备,直接通过usb写入设备不就行了吗?

我一直没有调通这样的方案。理论上是可行的,但对打印机的一些设置可能会更复杂一些,或者是我的打印机不支持这种模式。

目前能做到的就是在oxs/mac上启用cups,添加一个打印机,添加一个匹配的驱动程序,很多国产(中国大陆)的热敏打印机不提供mac的驱动程序,但实际上,这些打印机的控制板厂商就那么几家,看看打印机说明书里面提到的指令类型,比如TSPL就知道该找哪个厂商的驱动,TSPL就找TSC,他家的官网上资料可以说是非常的全了,提供了各个语言的例程。

经过反复测试,在mac上有两种方式添加打印机,一种是开启cups的web页面(在那里添加打印机,选择raw方式,但这个路径我没跑通,打印机不正常工作。),可以在cups这里添加打印机,选择对应厂商的ppa驱动程序(同一个厂商的驱动程序因不同设备而有很多型号,但比较下文件就知道大同小异,主要体现在设备的最大打印宽度、最高打印速度、分辨率这三项上,还有一个是热敏和转印模式)。另一种方式是直接在系统偏好设置-打印机这里添加打印机,选择相应的ppa文件也可以。

最后回答题目里自己设置的问题,我也不知道。一种猜测是osx为了安全起见,必须通过cups才能访问打印设备。一种猜测是打印机不具备直接简单接收指令就能打印的能力,可能还需要一些默认配置,这些配置由驱动程序来提供(ppa文件就是一个文本/配置文件,里面的内容都可以看)。

通过孟繁永

自制热敏打印机连接器始末(8)一些基本概念

其实之前参考过这篇文章

https://www.printnode.com/en/docs/what-is-raw-printing

但是他们提供的api没有命令式的,只能打文件,现在回头来看,打印机确实可以这么连接,直接安装为raw的方式就可以用程序打印了,并不需要找驱动。

当然,为了简化cups的操作,对普通用户来说,提供一个tsc的驱动在传统的打印机界面上安装会更简单一些。

在cups中添加的raw打印机只能在cups中可见,打印机与扫描仪管理中是看不见的,当然,node-printer中可以调用到这个打印机。

梳理一下基本概念:

标签打印机:重点当然在标签,每次打印一小截,标签一般是固定大小,指令如TSPL

票据打印机:重点当然是票据,按需打印长度,然后撕掉。指令如EOP。

面单打印机:快递单那种,应该是跟标签打印机差不多,只不过更大。

其实对于打印机厂商来说,很多都已经兼容多种指令了,当然不包括得力这种OEM还不提供开发文档的。

要做一个跨平台的连接器,需要满足几个条件:

(1)能够构建跨平台的发布,所以范围就锁定在electron、xamarin这样的方案上,js和c#虽然都熟悉,但最近用的多的还是js,所以有限选electron,但是其实对node不够熟悉,所以造成了上一篇关于buffer类型的困惑。

(2)搞清楚打印机在不同的操作系统如何连接,目前还没尝试usb直驱这种,在mac上还是通过cups来连接,windows上都有相应的驱动,可以不单独讨论。

(3)指令集兼容性,目前只尝试了TSPL这一种,后续还需要其他的ZPL之类的测试一下,还需要在各种指令之间转换,方便原来用某个指令集编写的程序直接对接。

(4)接入方式的兼容性,至少应该支持socket和http。

(5)统一的api,尤其是友好的RestFul模式的api,便于开发对接。

通过孟繁永

自制热敏打印机连接器始末(7)指令如何编码,尤其是汉字的编码

接下来就想为什么汉字是乱码呢?是command.setText(50, 100, “TSS24.BF2”, 1, 1, “一二三”);里面的汉字需要转码吗?

对照jpPrinter.addCommand里面把原来的转码去掉了,如果在command.setText(50, 100, “TSS24.BF2”, 1, 1, “一二三”);中把汉字转成unico呢,试了试也不行。

把jpPrinter.addCommand恢复回去,

jpPrinter.addCommand = function(content) {
      // 将指令转成数组装起;
      var code = new encode.TextEncoder("gb18030", {
        NONSTANDARD_allowLegacyEncoding: true,
      }).encode(content);
      for (var i = 0; i < code.length; ++i) {
        command.push(code[i]);
      }
      // command = command + content;
    };

还是会报错,throw new TypeError(‘first argument must be a string or Buffer’);

然后仔细一看,原来data复制不止是string类型,还可以是buffer类型。

那就接着从BluetoothPrinter往这里扒,因为不是蓝牙,不受每次传输的长度限制,所以把分段传输的逻辑去掉。

var data = Array.from(uint8Buf);
  var buffer = new ArrayBuffer(data.length);
  
  var dataView = new DataView(buffer);
  for (var i = 0; i < data.length; ++i) {
    dataView.setUint8(i, data[i]);
  }
  console.log(
    "data type is: " + typeof data + ", is buffer: " + Buffer.isBuffer(data)
  );

但是,还是报同样地错误。

然后发现Buffer.isBuffer(data)是false,为什么类型不对呢?

于是搜到了这里http://nodejs.cn/api/buffer.html#buffer_static_method_buffer_from_arraybuffer_byteoffset_length

是nodejs里面对Buffer有不同于js的类型定义。

于是改成:

var uint8Buf = command.getData();
  var buffer=Buffer.from(uint8Buf);
  console.log(
    "buffer type is: " + typeof buffer + ", is buffer: " + Buffer.isBuffer(buffer)
  );
  var jobid = "";
  printer.printDirect({
    data: buffer, // or simple String: "some text"
    printer: "Deli_DL_888B_NEW_", // printer name, if missing then will print to default printer
    type: "RAW", // type: RAW, TEXT, PDF, JPEG, COMMAND.. depends on platform
    success: function(jobID) {
      console.log("sent to printer with ID: " + jobID);
      jobid = jobID;
    },
    error: function(err) {
      console.log(err);
    },
  });

打印成功。

通过孟繁永

自制热敏打印机连接器始末(6)验证指令可以驱动打印机输出但有乱码

后来我找到了https://github.com/qihang666/BluetoothPrinter这个项目,人家用蓝牙直接连打印机,比如我手头的DL-888AW就有蓝牙,我用usb为什么就不行呢,所以我就着手将这个项目中的代码拿过来。

尽管他里面的打印机指令集叫jprinter,但指令集实际上是TSPL,所以理论上应该可以复用。

拿过来的部分是https://github.com/qihang666/BluetoothPrinter/tree/master/components/gprint,

考虑到https://github.com/tojocky/node-printer/blob/master/examples/print_raw.js这里面提示的是data部分需要string类型,所以,我把tsc.js里面的command改成了字符串类型,把

jpPrinter.addCommand = function(content) {
      // 将指令转成数组装起;
      var code = new encode.TextEncoder("gb18030", {
        NONSTANDARD_allowLegacyEncoding: true,
      }).encode(content);
      for (var i = 0; i < code.length; ++i) {
        command.push(code[i]);
      }
    };

改成了

jpPrinter.addCommand = function(content) {
       command = command + content;
    };

然后打印的时候:

var command = tsc.jpPrinter.createNew();
  console.log(command);
  command.setSize(60, 40);
  command.setGap(2);
  command.setCls();
  command.setText(50, 10, "2", 1, 1, "Hello");
  command.setText(50, 100, "TSS24.BF2", 1, 1, "一二三");
  // command.setQR(50, 50, "L", 5, "A", "977767937@qq.com");
  command.setPagePrint();

  var data=command.getData();
  var jobid = "";
  printer.printDirect({
    data: data, // or simple String: "some text"
    printer: "Deli_DL_888B_NEW_", // printer name, if missing then will print to default printer
    type: "RAW", // type: RAW, TEXT, PDF, JPEG, COMMAND.. depends on platform
    success: function(jobID) {
      console.log("sent to printer with ID: " + jobID);
      jobid = jobID;
    },
    error: function(err) {
      console.log(err);
    },
  });

惊喜出现了,打印机工作了,但是汉字是乱码。

通过孟繁永

自制热敏打印机连接器始末(5)放弃直接驱动usb,尝试找替代的驱动程序

中间走了一段弯路,因为一直无法直接用程序驱动打印机打出东西来,无法验证以前的思路是否可行,所以,想着是否应该给打印机找一找mac版的驱动,然后尝试直接在电脑上打印一个pdf文件,来和程序做下对比。于是,按照打印机的说明书里说的TSPL这个语言,找到了TSC这个厂商,他们家的网站上资源真是全啊https://www.chinatsc.cn/

按照类似的规格找了几个型号的打印机,下载驱动,然后发现其实人家的驱动都在一起。

这个ppd文件就是所谓驱动,用vscode打开,发现就是文本文件,对比一下,发现基本上都是一样的,对于热敏打印机来说,只有几个参数有区别,主要是打印宽度、打印速度、打印方式(热敏/热转印)。

找到了驱动,就可以在系统的打印机管理中添加打印机,然后自选某个驱动文件,比如我试了TA200,Deli_DL_888B_NEW是可以打印文件的。

但是我用node-printer还是无法打印。

  printer.printDirect({
    data:"测试", // or simple String: "some text"
    printer: "Deli_DL_888B_NEW_", // printer name, if missing then will print to default printer
    type: "RAW", // type: RAW, TEXT, PDF, JPEG, COMMAND.. depends on platform
    success: function(jobID) {
      console.log("sent to printer with ID: " + jobID);
      jobid = jobID;
    },
    error: function(err) {
      console.log(err);
    },
  });

打印机有时间连动都不动。

通过孟繁永

自制热敏打印机连接器始末(4)分清楚热敏打印机的几种常用指令集

都调试起来以后,连接打印机,发现打印机根本没反应,网上找到的相关资料很少,大部分都是在windows或者linux上做的,难道是mac的osx有一些安全限制,导致打印的指令被拦截了。

于是照着这个思路查下去,终于找到了一个新的东西:CUPS。其实这个东西支持linux也支持mac,按照说明添加上打印机之后,确实能在mac的打印机列表中看到了,而且在系统打开一个文件用这个打印机打印,是有动作的,尽管是瞎走纸,没有真正的输出。但至少说明是有希望了。

那么为什么用electron-escpos还是无法打印呢,甚至依然连走纸反应都没有。

无奈又去得力的官网看了看,找到888B这个打印机的说明书,仔细瞅了一眼,竟然发现它说他的编程语言是TSPL,不兼容ESCPOS,擦,过于相信刚找到escpos这个神奇的协议的时候它所说的几乎所有的打印机都支持了。

https://blog.csdn.net/weixin_34355881/article/details/89543300这篇文章介绍了打印机主流的指令类型(ESC命令集+CPCL命令集+TSPL命令集)之间的区别。这就解释了上面我对打印机类型的模糊认识

好了,标签打印机一般用TSPL命令集,票据打印机一般用ESCPOS。而我用的得力888B(NEW)是标签打印机。

那么,就需要将原来的escpos换成tspl来写打印命令。

通过孟繁永

自制热敏打印机连接器始末(3)

接上一篇,分清楚了两种模块的规范,那么怎么解决两种规范的不同呢,似乎可以通过配置babel来实现,于是我在babel.config.js中尝试了很多办法,都没有收效,归根结底是还没有搞清楚vue和electron之间是如何各自适用这些规范的。

按照某种说法,最新的vue是遵循ES6,而electron或者说node模块是CommonJs,但是,在项目中,npm install进来的模块都放在node_modules中,怎么区分呢,如果不是babel.config.js来负责,那就应该是electron相关的,于是我找到了electronBuilder这个配置。

在vue.config.js(如果没有则在项目根目录新建)中:

module.exports = {
  configureWebpack: {
    devtool: "source-map"
  },
  pluginOptions: {
    electronBuilder: {
      // List native deps here if they don't work
      externals: ["escpos", "escpos-usb"]
      // If you are using Yarn Workspaces, you may have multiple node_modules folders
      // List them all here so that VCP Electron Builder can find them
    }
  }
  // chainWebpack: config => {
  //   config.module
  //     .rule("js")
  //     .test(/\.jsx?$/)
  //     .exclude.clear()
  //     .end()
  //     .include.add(function() {
  //       return ["./node_modules/escpos", "./node_modules/escpos-usb", "src"];
  //     })
  //     .end();
  // }
};

这个发现得益于https://medium.com/@nyorikakar/printing-with-vue-electron-and-node-f52a730e63e7这篇文章,而且我还在后面的评论中发现了https://github.com/song940/node-escpos/issues/297,最终靠这些信息搞清楚了逻辑。

(1)对于用于node的模块,需要在vue.config.js的externals那里列出,这样,vue就不会让babel啥的那些loader去处理了。

(2)负责和node打交道的代码要放在background.js中,这在前面第二个连接中可以看到,而且最关键的是在vue的代码因为是通过BrowserWindow加载的,在其初始化是webPreferences中的nodeIntegration这个属性需要配置为true,const { ipcRenderer } = window.require(“electron”);才能用。而且,这个true如果是放在.env中不能直接给process.env.ELECTRON_NODE_INTEGRATION=true,那样,调到的是字符串,不是布尔值,会出现下面的报错:

Uncaught TypeError: window.require is not a function
    at Module../node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/App.vue?vue&type=script&lang=js& (App.vue:22)
    at __webpack_require__ (bootstrap:853)
    at fn (bootstrap:150)
    at Module../src/App.vue?vue&type=script&lang=js& (App.vue?c53a:1)
    at __webpack_require__ (bootstrap:853)
    at fn (bootstrap:150)
    at Module../src/App.vue (App.vue:1)
    at __webpack_require__ (bootstrap:853)
    at fn (bootstrap:150)
    at Module../src/main.js (HelloWorld.vue?adfd:1)
通过孟繁永

自制热敏打印机连接器始末(2)从跨平台方案开始

接上一篇,选择vue+electron之后,那就按electron-vue这个来。虽然能跑起来,但是代码上传到git以后,收到很多高危报警,https://github.com/futuremeng/electron-vue-escpos-bridge

尝试升级一下,结果发现因为版本已经差太多,需要花很多时间修,遂放弃。通过检索,发现有一个新的方案,https://nklayman.github.io/vue-cli-plugin-electron-builder/

于是,开启新的https://github.com/futuremeng/vue-electron-builder-escpos-printer-bridge

先用vue cli4创建一个新的项目,再vue add electron-builder。尝试运行yarn electron:serve 的时候提示Vue Devtools下载失败,需要翻墙跑成功一遍才行。

接下来分析打印机如何连接,通过检索发现escpos这个协议,据说是大部分打印机都支持的。那么是否可以用escpos直接驱动打印机呢,网上有树莓派的示范。

在寻找合适的escpos驱动的时候,发现了各种版本的,除了java、python,还有php和node,我决定选择node版的https://www.npmjs.com/package/escpos

但是,当然当我尝试引入到项目的时候,悲剧发生了。

ERROR Failed to compile with 1 errors 16:30:59

error in ./node_modules/escpos/statuses.js

Module parse failed: Unexpected token (7:7)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|
| class DeviceStatus {

byte = ”;
| bits = [];
| bitsAsc = [];

@ ./node_modules/escpos/index.js 12:17-38
@ ./node_modules/cache-loader/dist/cjs.js??ref–12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref–0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://192.168.3.139:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

见到是loader的问题,我就尝试配置babel-loader script-loader file-loader。都没有解决问题,实际上,我也不是很了解这些loader到底是干什么的。

在这个过程中,了解到CommonJS和ES6这些区别,还有,在网页版的vue项目和electron中还涉及到运行环境的问题,网页中没有办法直接调用node接口。

通过孟繁永

自制热敏打印机连接器始末(1)不想花钱,还想跨平台

前情回顾:做了一个网站,需要在网页上打印二维码,将热敏打印机连到电脑上,在网页上直接用print打印出来的二维码完全无法识别,应该是分辨率的问题,因为屏幕的分辨率和打印机的分辨率差太多。所以寻找解决方案,找到了c-lodop.com这个网站提供的中间件,需要付费,而且只有win版。

需求分析:现在重构网站,计划做成saas模式,在打印模块上,需要尽量摆脱第三方的束缚,所以构思如何自己实现。

网页到打印机,这中间是网页-浏览器-操作系统-usb-打印机,这样一个路径。经过确认,网页直接连打印机是不显示的,有一个比较接近的办法是通过chrome的app方案,但通用性不高,放弃,那就只剩下跟lodop一样的模式了,要么把整个网站构建成桌面程序,要么通过中间件来连打印机,网页再通过http或者socket驱动中间件。

当然,选择一个中间件是比较合适的,整个后台构建成桌面程序,没有必要,维护起来也太笨重。

接下来,就是选择跨平台的桌面程序方案来做这个中间件了。需要实现几个部分,一是http或者socket,二是打印机连接,中间的打印机连接管理。

当然,首选相对比较熟悉的vue+electron的方案。