如何使用电子webContents.print（[options]，[callback]）打印html / text文件？

Question

---

电子版本：2.0.7

作业系统：Ubuntu 16.04

节点版本：8.11.1

---

电子版

let win = new BrowserWindow({width: 302, height: 793,show:false});
win.once('ready-to-show', () => win.hide());
    fs.writeFile(path.join(__dirname,'/print.txt'), "Test Print From the app",function(){
        win.loadURL(`file://${path.join(__dirname,'/print.txt')}`);
        win.webContents.on('did-finish-load', () => {
            let printersInfo = win.webContents.getPrinters();
            let printer = printersInfo.filter(printer => printer.isDefault === true)[0];
            win.webContents.print({silent: true, printBackground: true, deviceName : printer.name},() => {
                win = null;
            });
        });
    })

win.webContents.print(silent: true, printBackground: true, deviceName : "POS-1") 产生如下图所示的异常数据：

win.webContents.print(silent: false, printBackground: true, deviceName : "POS-1") 产生异常数据并重叠文件文本，如下图所示：

我也尝试过html文件，但它也会产生相同的输出。

如果我写有silent : true和没有，deviceName那么它什么也不会产生。

let win = new BrowserWindow({show:false});
win.once('ready-to-show', () => win.hide());
win.loadURL(`file://${path.join(__dirname,'/hello.html')}`);
win.webContents.on('did-finish-load', () => {
    win.webContents.print({silent: true});
});

如果我用编写它，deviceName那么它会产生与上图所示相同的输出。

let win = new BrowserWindow({show:false});
win.once('ready-to-show', () => win.hide());
win.loadURL(`file://${path.join(__dirname,'/hello.html')}`);
win.webContents.on('did-finish-load', () => {
    let printersInfo = win.webContents.getPrinters();
    let printer = printersInfo.filter(printer => printer.isDefault === true)[0];
    win.webContents.print({silent: true, deviceName : printer.name});
});

如何繁殖

无声=真

win.webContents.print({
  silent: true,
  printBackground: false,
  deviceName: 'POS-1'
});

无声=错误

win.webContents.print({
  silent: false,
  printBackground: false,
  deviceName: 'POS-1'
});

Answer 1

即使在 Electron 11.0 中，我在打印 HTML 模板时也遇到了这个问题。并找到了解决方案。问题出在页面边距上。我为标题内容添加了 margin-top，现在可以正确打印，没有异常数据。

Main.js

ipcMain.on('print', (event, arg) => {
    let win = new BrowserWindow({ width: 302, height: 793, show: false });
    win.once('ready-to-show', () => win.hide());
    fs.writeFile(path.join(__dirname, '/printme.html'), arg, function () {
        win.loadURL(`file://${path.join(__dirname, '/printme.html')}`);
        win.webContents.on('did-finish-load', () => {
        
        // Finding Default Printer name
            let printersInfo = win.webContents.getPrinters();
            let printer = printersInfo.filter(printer => printer.isDefault === true)[0];

            const options = {
                silent: true,
                deviceName: printer.name,
                pageSize: { height: 301000, width: 50000 }
            }

            win.webContents.print(options, () => {
                win = null;
            });
        });
    })

    event.returnValue = true;
});

打印我.html

<style type="text/css">   
    #content {
        margin-top: 15px;
    }
</style>
<div id="page-wrap">
    <div id="content">
        my header content
    </div>
</div>