zoukankan      html  css  js  c++  java
  • 网页调用菜鸟打印控件打印电子面单

    有一个需求是打印快递 电子面单,试了好多网页控件因为格式问题 都不好用,后来发现菜鸟控件可以直接按标准模板打印的;

    菜鸟云打印组件开启本地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>
  • 相关阅读:
    文档撰写思路与排版(hadoop)
    ULUA的简洁用法(二)
    开源cocos2d-x编辑器 qco-editor
    u3d tolua + ZeroBraneStudio远程调试
    ULUA的简洁用法
    OpenGL顶点数据传输速度优化
    在do while语句中使用continue的误解
    cocos2d-x 3D shader的纹理坐标是上下颠倒的
    使用ndk-gdb调试android native程序
    OpenSSL中AES加密的用法
  • 原文地址:https://www.cnblogs.com/6min/p/13755168.html
Copyright © 2011-2022 走看看