远程打印配置指南

工作原理

远程打印模式下，客户端后台持续监听你的业务服务端。收到任务后，在本地走与普通 printHtml 相同的打印流水线，无需浏览器参与。

1. ERP/WMS 生成与 printHtml 相同结构的 JSON
2. 通过 WebSocket 推送或 HTTP 接口返回给客户端
3. 客户端校验必要字段后执行打印
4. 本地排版转 PDF → 静默出纸

标准消息格式

建议与客户端「测试任务」保持一致的 JSON 结构，服务端按下列字段组织即可：

{
  "id": "uuid",
  "timestamp": 1710000000000,
  "type": "printHtml",
  "content": "<div>快递面单 #10086</div>",
  "pdfOptions": {
    "paperFormat": "A4",
    "margin": { "top": "20px", "bottom": "20px", "left": "20px", "right": "20px" },
    "printBackground": false
  },
  "printOptions": { "paperFormat": "A4", "printerName": "默认打印机" },
  "extraOptions": { "requestTimeout": 15 }
}

type 也可为 printHtmlByUrl、printPdfByUrl、batchPrint 等，与 标准 WS API 一致。

客户端配置

在客户端 UI「远程打印配置」中选择方式并填写 URL，配置持久化到本地：

配置保存后，布局组件 remotePrint/content.vue 按 method 挂载 WebSocket 或 HTTP 轮询子组件。

WebSocket 模式

客户端连接你配置的 WS 地址，收到 JSON 任务后进入本地打印流程；网络异常时会按策略自动重连。

Node.js 服务端推送示例：

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 9000 });

function buildTask() {
  return {
    id: crypto.randomUUID(),
    timestamp: Date.now(),
    type: 'printHtml',
    content: '<div>WMS 面单</div>',
    pdfOptions: { paperFormat: 'A4' },
    printOptions: { paperFormat: 'A4' },
    extraOptions: { requestTimeout: 15 }
  };
}

wss.on('connection', (ws) => {
  ws.send(JSON.stringify(buildTask()));
});

客户端配置 URL 填 ws://your-server:9000。无任务时不要推送空消息。

HTTP 轮询模式

客户端按固定间隔请求你配置的 URL，解析统一响应格式：

// 无任务
{ "success": true, "data": null }

// 有任务（data 为完整打印消息）
{
  "success": true,
  "data": {
    "id": "...",
    "timestamp": 1710000000000,
    "type": "printHtml",
    "content": "<div>...</div>",
    "pdfOptions": { ... },
    "printOptions": { ... },
    "extraOptions": { ... }
  }
}

仅当响应中的任务对象包含必要字段（如 id、timestamp、type）时才执行打印。

Express 服务端示例：

const express = require('express');
const app = express();
const queue = [];

app.get('/api/print/pull', (req, res) => {
  const task = queue.shift();
  res.json({ success: true, data: task || null });
});

// 业务系统入队
app.post('/api/print/push', express.json(), (req, res) => {
  queue.push(req.body);
  res.json({ success: true });
});

app.listen(8080);

客户端配置 URL 填 http://your-server:8080/api/print/pull。

与前端 printHtml 的关系

• 远程模式：服务端推送 → 客户端本地打印模块
• 本地模式：浏览器 Vue 页面 → webPrintPdf.printHtml
• 两种模式可并存：后台自动打面单，前台管理页仍可手动补打。