网页调用菜鸟打印控件打印电子面单
有一个需求是打印快递 电子面单，试了好多网页控件因为格式问题 都不好用，后来发现菜鸟控件可以直接按标准模板打印的；
菜鸟云打印组件开启本地socket服务，接收客户端命令后转发给打印机输出
交互协议 https://open.taobao.com/doc.htm?docId=107014&docType=1
官方示例 http://cdn-cloudprint.cainiao.com/waybill-print/docs/test/test_print.html
下载地址 https://support-cnkuaidi.taobao.com/docs/doc.htm?treeId=409&articleId=108934&docType=1
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button onclick="doPrint('2027200037403746')">打印</button>
</body>
<script>
var socket,defaultPrinter;
socket = new WebSocket('ws://127.0.0.1:13528');
// 打开Socket
socket.onopen = function(event){
getPrintList();
// 监听消息
socket.onmessage = function(event)
{
console.log('Client received a message', event);
console.log(JSON.parse(event.data).defaultPrinter)
defaultPrinter = JSON.parse(event.data).defaultPrinter
};
// 监听Socket的关闭
socket.onclose = function(event)
{
console.log('Client notified socket has closed',event);
};
};
websocket.onmessage = function (event) {
var response = eval(event.data);
if (response.cmd == 'notifyPrintResult') {
//打印通知
console.log(response.taskID);
if(response.taskStatus == 'printed'){
//打印完成回调 response.printStatus[0].documentID
}
}
};
//打印电子面单
function doPrint(waybillNO){
var request = getRequestObject("print");
request.task = new Object();
request.task.taskID = getUUID(8,10);
request.task.preview = false;
request.task.printer = defaultPrinter;
var documents = new Array();
var doc = new Object();
doc.documentID = waybillNO;
var waybill = getWaybillJson(waybillNO);
doc.contents = waybill;
documents.push(doc);
request.task.documents = documents;
socket.send(JSON.stringify(request));
}
/***
*
* 获取请求的UUID，指定长度和进制,如
* getUUID(8, 2) //"01001010" 8 character (base=2)
* getUUID(8, 10) // "47473046" 8 character ID (base=10)
* getUUID(8, 16) // "098F4D35"。 8 character ID (base=16)
*
*/
function getUUID(len, radix) {
var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
var uuid = [], i;
radix = radix || chars.length;
if (len) {
for (i = 0; i < len; i++) uuid[i] = chars[0 | Math.random()*radix];
} else {
var r;
uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-';
uuid[14] = '4';
for (i = 0; i < 36; i++) {
if (!uuid[i]) {
r = 0 | Math.random()*16;
uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
}
}
}
return uuid.join('');
}
/***
* 构造request对象
*/
function getRequestObject(cmd) {
var request = new Object();
request.requestID=getUUID(8, 16);
request.version="1.0";
request.cmd=cmd;
return request;
}
/**
* 请求打印机列表
* */
function getPrintList(){
var request = getRequestObject("getPrinters");
if (socket.readyState===1) {
console.log(request)
socket.send(JSON.stringify(request));
}
}
//获取运单数据 waybillNO 电子面单号
function getWaybillJson(waybillNO){
var ret = {
content: [
{
"data": {
"_dataFrom": "waybill",
"cpCode": "SHENTONG",
"needEncrypt": false,
"parent": false,
"recipient": {
"address": {
"city": "武汉市",
"detail": "东湖路112号",
"district": "武昌区",
"province": "湖北省"
},
"mobile": "13100000000",
"name": "张三"
},
"routingInfo": {
"consolidation": {
"code": "E30",
"name": "中转集"
},
"routeCode": "327 E70 000",
"sortation": {
"name": "E70"
}
},
"sender": {
"address": {
"city": "太原市",
"detail": "太榆路185号",
"district": "小店区",
"province": "山西省"
},
"mobile": "15500000000",
"name": "李四"
},
"shippingOption": {
"code": "STANDARD_EXPRESS",
"title": "标准快递"
},
"waybillCode": "2027200037403746"
},
"templateURL": "http://cloudprint.cainiao.com/template/standard/288948/7"
},
{
"data": {
"tradeInfo": "图书画册 * 3"
},
"templateURL": "http://cloudprint.cainiao.com/template/standard/313049/6"
}
]
};
return ret.content;
}
</script>
</html>
