Electron JS 打印 pdf 文件

封面图 • 2025-11-18 • nodejs

在 Electron 中打印 PDF 文件，通常可以通过以下几种方式实现：

---

## ✅ 方法一：使用 `webContents.print()` 打印 PDF

Electron 提供了 `webContents.print()` 方法，可以将当前窗口中的内容（包括加载的 PDF）打印出来。

### 示例代码：

```javascript
const { webContents } = require('electron');

// 假设你有一个 BrowserWindow 实例
let win = new BrowserWindow({ width: 800, height: 600 });

win.loadURL('http://example.com/document.pdf');

// 在某个事件中触发打印
win.webContents.print({}, (success, error) => {
  if (success) {
    console.log('Print success');
  } else {
    console.error('Print failed:', error);
  }
});
```

> 注意：`print()` 方法会直接调用系统默认的打印对话框，让用户选择打印机和设置。

---

## ✅ 方法二：使用 `pdf.js` 渲染并打印 PDF 内容

如果你需要更精细地控制 PDF 的渲染和打印过程，可以使用 [PDF.js](https://mozilla.github.io/pdf.js/) 来加载和渲染 PDF，并通过 HTML/CSS 控制打印样式。

### 步骤如下：

1. 引入 PDF.js 库。
2. 将 PDF 渲染到 `<canvas>` 或 `<div>` 中。
3. 使用 CSS 控制打印样式（如 `@media print`）。
4. 调用 `window.print()` 打印页面。

### 示例代码（HTML + JS）：

```html
<!DOCTYPE html>
<html>
<head>
  <title>PDF Viewer</title>
  <script src="https://unpkg.com/pdfjs-dist@3.4.120/build/pdf.min.js"></script>
  <style>
    @media print {
      body * {
        visibility: hidden;
      }
      #pdf-container, #pdf-container * {
        visibility: visible;
      }
      #pdf-container {
        position: absolute;
        left: 0;
        top: 0;
      }
    }
  </style>
</head>
<body>
  <div id="pdf-container"></div>

const loadingTask = pdfjsLib.getDocument('http://example.com/document.pdf').promise;

loadingTask.then(pdf => {
      pdf.getPage(1).then(page => {
        const viewport = page.getViewport({ scale: 1.5 });
        const canvas = document.createElement('canvas');
        const context = canvas.getContext('2d');
        canvas.height = viewport.height;
        canvas.width = viewport.width;

const renderContext = {
          canvasContext: context,
          viewport: viewport
        };

page.render(renderContext).promise.then(() => {
          document.getElementById('pdf-container').appendChild(canvas);
        });
      });
    });
  </script>

<button onclick="window.print()">打印 PDF</button>
</body>
</html>
```

---

## ✅ 方法三：使用 Electron 的 `printer` 模块（高级）

Electron 提供了一个 `printer` 模块（需在主进程中使用），可以更灵活地控制打印任务。

### 示例代码（主进程）：

```javascript
const { ipcMain, webContents } = require('electron');

ipcMain.on('print-pdf', (event, url) => {
  webContents.fromId(event.sender.id).print({
    silent: false,
    printBackground: true,
    deviceName: ''
  }, (success, error) => {
    if (!success) {
      console.error('Print failed:', error);
    }
  });
});
```

然后在渲染进程中发送请求：

```javascript
const { ipcRenderer } = require('electron');

ipcRenderer.send('print-pdf', 'http://example.com/document.pdf');
```

---

## ✅ 总结

| 方法 | 优点 | 缺点 |
|------|------|------|
| `webContents.print()` | 简单易用 | 只能打印整个网页内容 |
| `pdf.js` + `window.print()` | 可控性强、支持自定义样式 | 需要手动处理 PDF 渲染 |
| `printer` 模块 | 更多打印选项 | 需要在主进程中操作 |

---

如果你有具体的需求（比如只打印 PDF 页面、自定义打印样式等），欢迎告诉我，我可以提供更详细的解决方案。