小程序蓝牙打印机CPCL图片打印问题梳理

手册中要求需要用ASCII码十六进制字符下发命令，源引自 有赞零售小票打印跨平台解决方案

图片处理

由于 JS 引擎是不能解析图片文件的，所以在最初模板中存在图片链接时，全部由移动端进行处理，然后进行替换。图片处理主要就是下载图片，图片压缩，二值图处理，图片像素点压缩（打印指令要求），每个字节转换成 16 进制，拼接 16 进制字符串。

下载图片

采用 SDWebImage 进行下载缓存，创建并行队列进行多图片下载，每下载成功一张后回到主线程进行后续的相关处理。所有图片都处理完成或，回调给 JS 引擎进行指令解析。

图片压缩

根据 JS 引擎模板要求的 width（必须是 8 的倍数，后续说明），进行等比例压缩，转换成 jpg 格式，过滤掉 alpha 通道。

二值图处理

遍历每一个像素点，进行 RGB 取值，然后算出 RGB 均值与 255 的比值，根据比值进行取值 0 或 255 。这里没有使用直方图寻找阈值 T 的方式进行处理，是出于性能和时间考虑。

像素点压缩

由于打印机指令要求，需要对转换成二值后的每个点进行 width 上压缩，需要将 8 个字节压缩到 1 个字节，这里也是为什么图片压缩时 width 必须是 8 的倍数的原因，否则打印出来的图片会错位。
这里有两点需要清楚：1、图片的宽度需要处理，必须是8的倍数，不是的话余位补0, 2、对于8个字节压缩到1个字节的理解：每个像素点由R:0-255、G:0-255、B:0-255 、A：0-1 四个数值构成，图像二值化就是根据rgb的平均值跟阈值作比较，最终像素点变为了1或者0,（注意：二值化的结果是像素点变为了0或者1，而不是rgba的值变为0或者1

	var hexLookup = {
					'0000': '0',
					'0001': '1',
					'0010': '2',
					'0011': '3',
					'0100': '4',
					'0101': '5',
					'0110': '6',
					'0111': '7',
					'1000': '8',
					'1001': '9',
					'1010': 'A',
					'1011': 'B',
					'1100': 'C',
					'1101': 'D',
					'1110': 'E',
					'1111': 'F'
				};
				for (var i = 0; i < pix.length; i += 4) {
					var colour = {
						red: pix[i],
						green: pix[i + 1],
						blue: pix[i + 2],
						alpha: pix[i + 3]
					};
					var intensity = (colour.red + colour.green + colour.blue);

					if (intensity >= 128)
						binary = binary + '0';
					else
						binary = binary + '1';

				}
				var hex = '';
				var yu = binary.length % 4
				if (yu != 0) {
					for (var i = 0; i < 4-yu; i++) {
						binary+="0"
					}
				}
				for (var i = 0; i < binary.length; i += 4) {
					var current = binary[i] + binary[i + 1] + binary[i + 2] + binary[i + 3];
					hex = hex + hexLookup[current];
				}

				return hex;）

16 进制字符串

因为打印机打印图片接收的是 16 进制字符串，所以需要将处理后的每个字节转换成 16 进制字符，然后拼成一个字符串。

这里感谢赵同学提供的java版后台将图片转换完成后返回给前端，直接打印，里面的代码没看明白算法原理，但是可以使用