Electron如何避免重复打开同一窗口？

在Electron 24.4应用中，通过按钮调用window.open('settings.html', '_blank')打开设置窗口时，多次点击会重复创建相同窗口，可通过以下方案实现"窗口已存在则激活，不存在则新建"的逻辑：

核心思路 #

在主进程中维护目标窗口的实例引用，每次处理打开请求时先检查实例是否存在且未被销毁，以此决定激活现有窗口还是创建新窗口。

具体实现步骤 #

1. 声明窗口实例变量
   在主进程的全局作用域（或createWindow()函数外部）声明变量，用于保存设置窗口的实例：

let settingsWindow = null;

2. 修改窗口打开处理逻辑
   替换原有的setWindowOpenHandler配置，加入窗口存在性检查与实例管理：

mainWindow.webContents.setWindowOpenHandler(({ url }) => {
  const fileName = path.basename(url);
  if (fileName === 'settings.html') {
    // 检查设置窗口是否已存在且未被销毁
    if (settingsWindow && !settingsWindow.isDestroyed()) {
      settingsWindow.focus(); // 激活已存在的窗口
      return { action: 'deny' }; // 阻止新建窗口
    }

    // 窗口不存在时创建新窗口
    settingsWindow = new BrowserWindow({
      width: 400,
      height: 450,
      autoHideMenuBar: true,
      fullscreenable: false,
      webPreferences: {
        preload: path.join(__dirname, 'js', 'preload.js')
      }
    });

    settingsWindow.loadFile(url);

    // 监听窗口关闭事件，清空实例引用
    settingsWindow.on('closed', () => {
      settingsWindow = null;
    });

    return { action: 'deny' }; // 手动创建窗口，无需Electron默认处理
  }
  return { action: 'deny' };
});

关键说明 #

• 使用isDestroyed()判断窗口是否已被销毁，避免操作无效的窗口实例
• 窗口关闭时将settingsWindow置为null，确保下次点击可重新创建窗口
• 返回action: 'deny'是因为我们手动完成了窗口创建，不需要Electron按默认逻辑处理window.open请求

内容的提问来源于stack exchange，提问作者lll