electron+react调用打印机进行打印

原创文章，转载请注明出处

• 首先主进程获取打印机列表传递给渲染进程
• 其次渲染进程展示打印机列表，并选择打印机
• 选择完打印机后，执行打印，或多个打印

获取打印机列表（渲染进程）

        try {
            ipcRenderer.send('getPrinterList')
            ipcRenderer.on('printerList', function (e, data) {
                if (data.length <= 0) {
                    Message.error('打印服务异常,请尝试重启电脑')
                    return;
                }
                if (localStorage.getItem('printName')) {
                    for (let i = 0; i < data.length; i++) {
                        const element = data[i];
                        if (element.name == localStorage.getItem('printName')) {
                            that.setState({
                                printIndex: i
                            })
                        }
                    }
                }
                that.setState({
                    printList: data
                })
            })
        } catch (error) {
             console.log(error)
        }

获取打印机列表（主进程）

// 在主线程下，通过ipcMain对象监听渲染线程传过来的getPrinterList事件，返回打印机列表 
  // 需要注意 electron 版本是3.0.0
  ipcMain.on('getPrinterList', (event) => {
    //主线程获取打印机列表
    const list = mainWindow.webContents.getPrinters();
    //通过webContents发送事件到渲染线程，同时将打印机列表也传过去
    event.sender.send('printerList', list);
  });

调用打印机打印

  <span className="Y-cursor-pointer Y-margin-horizontal-right-15" onClick={this.onPrint.bind(this, record)}>打印条码</span>

  // 调用打印机打印
    onPrint(record) {
        let that = this
        // if (!localStorage.getItem('printName') && !this.state.printName) {
        //     Message.error('请先设置打印机')
        //     return;
        // }

        httpUrl('GET', host + 'api/business/web/order/print-order-detail?partsOrderKid=' + record.partsOrderKid, null, '', res => {
            if (res) {
                res.packageCount = record.partsCount
                res.printName = localStorage.getItem('printName') || this.state.printName
                try {
                    if (res.packageCount >= 1) {
                        for (let i = 0; i < res.packageCount; i++) {
                            res.packageCountPre = i + 1;
                            // ipcRenderer.send('print', res)  // 异步
                            // 同步打印，一张一张打印，创建一个任务
                            const replay = ipcRenderer.send('print', res)
                            // console.log(replay)
                            if (replay) {
                                continue;
                            }
                        }
                        let kids = [record.partsOrderKid]
                        httpUrl('PUT', host + 'order/web/admin/update-parts-order-print', { kids }, '', res => {
                            Message.success('打印成功')
                            that.partsBusinessOrderList()
                        })
                    }
                } catch (error) {
                    if (error) {
                        Message.error('暂不支持打印')
                    }
                }
            }
        })
    }

主进程执行打印

// 监听渲染进程打印按钮点击
  ipcMain.on('print', (event, args) => {
    print(event, args)
  })

// 打印 通过webContent
function print(event, args) {
  let win = new BrowserWindow({
    show: false
  }) // 新建窗口不打开，实现静默打印
  // win.openDevTools() //打开调试
  var url = 'print.html'
  for (const key in args) {
    // console.log('key:' + key + ',val:' + args[key])
    if (url.indexOf('?') <= 0) {
      url += '?' + key + '=' + args[key]
    } else {
      url += '&' + key + '=' + args[key]
    }
  }
  win.loadURL(path.join(__dirname, url)) // 加载print页面并将参数传入
  win.webContents.on('did-finish-load', () => { // 页面加载完毕执行打印操作
    // if (args.packageCountPre == args.packageCount) {
    //   event.sender.send('printResult', true)
    // }
    // 执行打印 静默打印，传入打印机名称
    win.webContents.print({
      silent: true,
      deviceName: args.deviceName, //'KM-118'
    }, function (success, errorType) {
      if (errorType) throw errorType
      // console.log('success：' + success)
      // console.log('errorType：' + errorType)
      event.returnValue = success // 同步打印 将打印结果返回给渲染进程
      if(args.packageCountPre == args.packageCount){
        win.close(); // 打印完成 关闭窗口
      }
    })
  })
}

创建多个任务进行打印

<div style={{ background: '#3080fe', border: '1px solid #3080fe', color: '#ffffff' }} className="Y-cursor-pointer Y-padding-vertical-both-8 Y-padding-horizontal-both-20" onClick={this.morePrint.bind(this)}> 批量打印</div>

    // 创建多个任务
    morePrint() {
        // console.log(this.state.addData)
        let data = this.state.addData
        let j = 1;
        let arr = []
        for (let i = 0; i < data.length; i++) {
            const item = data[i];
            // onPrint
            // var res = await axios.post('')
            this.axiosGet(item).then((valid) => {
                if (valid) {
                    console.log('同步执行完毕');
                    j++;
                }
            })
            arr.push(item.partsOrderKid)
            if (j = data.length) {
                let kids = arr
                httpUrl('PUT', host + 'order/web/admin/update-parts-order-print', { kids }, '', res => {
                    Message.success('打印成功')
                    that.partsBusinessOrderList()
                })
            }
        }
    }
    axiosGet(record) {
        let headers = {
            'Content-Type': 'application/json;charset=UTF-8',
            'Authorization': localStorage.getItem("token")
        }
        return axios({
            method: 'GET',
            headers: headers,
            url: host + 'order/business/print-order-detail?partsOrderKid=' + record.partsOrderKid,
            data: null,
        }).then(ret => {
            // console.log(ret)
            let flag = false
            let res = ret.data.data.data
            if (res) {
                res.packageCount = record.partsCount
                res.printName = localStorage.getItem('printName') || this.state.printName
                // console.log(res)
                try {
                    if (res.packageCount >= 1) {
                        for (let i = 0; i < res.packageCount; i++) {
                            res.packageCountPre = i + 1;
                            // ipcRenderer.send('print', res)  // 异步
                            const replay = ipcRenderer.send('print', res)
                            flag = replay;
                            // console.log(replay)
                            if (replay && res.packageCountPre < res.packageCount) {
                                flag = false;
                                continue;
                            }
                        }
                    }
                } catch (error) {
                    if (error) {
                        Message.error('暂不支持打印')
                    }
                }
                if (res.packageCountPre == res.packageCount && flag) {
                    return true;
                }
            }
        })
    }