有一個需求是打印快遞 電子面單，試了好多網頁控件因為格式問題 都不好用，后來發現菜鳥控件可以直接按標准模板打印的；
菜鳥雲打印組件開啟本地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>