在Electron应用中控制剪贴板操-复制&粘贴

背景

最近给别人做的一个考试防作弊系统，要禁止考生使用复制粘贴，我们使用的Electron做了一个考试客户端，在 Electron 应用中控制复制/粘贴 剪贴板操作，通过 electron.clipboard API 来实现。同时，可以通过监听键盘事件（如 Ctrl+C/Ctrl+V）来自定义复制粘贴行为。

---

实现方法

1. 基本剪贴板控制（读写剪贴板）

Electron 提供了 clipboard 模块，可以访问系统剪贴板：

const { clipboard } = require("electron");

// 写入文本到剪贴板
clipboard.writeText("Hello, Electron!");

// 读取剪贴板内容
const clipboardText = clipboard.readText();
console.log("剪贴板内容：", clipboardText);

其他剪贴板操作（HTML、图像等）：

// 写入 HTML 到剪贴板
clipboard.writeHTML("<b>Bold text</b>");
const htmlContent = clipboard.readHTML();

// 写入图片（Buffer）
clipboard.writeImage(nativeImage.createFromPath("image.png"));

---

2. 监听并自定义复制/粘贴按键

你可以在 webContents 或 window 中监听 keydown 事件，拦截 Ctrl+C (复制) 或 Ctrl+V (粘贴)：

方法 1：在主进程中使用 webContents（适用于 BrowserWindow）

const { app, BrowserWindow } = require("electron");

app.whenReady().then(() => {
  const win = new BrowserWindow();

  // 监听键盘事件
  win.webContents.on("before-input-event", (event, input) => {
    if (input.control && input.key.toLowerCase() === "c") {
      console.log("Ctrl+C 被按下！");
      // 自定义行为：比如先获取选中文本，再写入剪贴板
      // event.preventDefault(); // 阻止默认行为
    }

    if (input.control && input.key.toLowerCase() === "v") {
      console.log("Ctrl+V 被按下！");
      // 自定义逻辑：比如只允许粘贴纯文本
      event.preventDefault();
      const clipboardText = clipboard.readText();
      win.webContents.insertText(clipboardText);
    }
  });
});

方法 2：在渲染进程（前端）监听

在 HTML 页面里直接用 JavaScript 监听键盘事件：

<script>
document.addEventListener("keydown", (e) => {
  if (e.ctrlKey && e.key === "c") {
    console.log("Ctrl+C 按下！");
    // 自定义复制逻辑
    e.preventDefault(); // 阻止默认行为
    navigator.clipboard.writeText("自定义复制内容").then(() => {
      console.log("已复制自定义内容！");
    });
  }

  if (e.ctrlKey && e.key === "v") {
    console.log("Ctrl+V 按下！");
    e.preventDefault(); // 阻止默认行为
    navigator.clipboard.readText().then((text) => {
      document.execCommand("insertText", false, text); // 插入文本
    });
  }
});
</script>

---

3. 禁用默认复制/粘贴

如果你想完全禁止用户使用复制或粘贴，可以在 webPreferences 里禁用：

const win = new BrowserWindow({
  webPreferences: {
    // 禁用粘贴板访问
    contextIsolation: true,
    enableRemoteModule: false,
  },
});

或者在 renderer.js 里：

document.addEventListener("copy", (e) => {
  e.preventDefault();  // 禁止复制
});
document.addEventListener("paste", (e) => {
  e.preventDefault();  // 禁止粘贴
});

---

4. 典型应用场景

✅ 安全控制 ：限制某些内容的复制（如付费内容）。

✅ 增强体验 ：自动转换复制的格式（如 Markdown → 富文本）。

✅ 剪贴板审计：记录用户复制/粘贴行为（企业合规需求）。

---

如果想让用户右键菜单也能自定义复制粘贴 ，可以结合 contextMenu API：

const { Menu, MenuItem } = require("electron");
const menu = new Menu();
menu.append(new MenuItem({
  label: "复制（自定义）",
  click: () => {
    clipboard.writeText("这是自定义复制内容");
  }
}));
win.webContents.on("context-menu", () => menu.popup());