如何让Electron的preload文件使用同一个类实例

以下方案均符合Electron安全设计规范，不需要关闭上下文隔离：

方案1：主进程托管SignalR连接（最推荐） #

Electron主进程是全局唯一的单例进程，所有渲染窗口共享同一个主进程实例，将长连接逻辑放在主进程实现是官方推荐的最佳实践。
具体实现逻辑：

• 主进程内全局唯一初始化SignalR连接，处理连接状态维护、服务端消息接收、请求转发逻辑
• 主进程通过IPC通道暴露调用接口，所有窗口通过IPC调用主进程的能力收发消息
• 主进程收到服务端推送时，统一广播给所有存活的渲染窗口
  代码示例：

// 主进程 main.js
const { app, ipcMain, BrowserWindow } = require('electron')
const { HubConnectionBuilder } = require('@microsoft/signalr')

// 全局单例连接，只会初始化一次
let signalRConn = null
async function initSignalR() {
  if (signalRConn) return
  signalRConn = new HubConnectionBuilder()
    .withUrl('你的Hub服务地址')
    .build()
  // 监听服务端推送，广播到所有窗口
  signalRConn.on('serverPush', (data) => {
    BrowserWindow.getAllWindows().forEach(win => {
      !win.isDestroyed() && win.webContents.send('signalR-msg', data)
    })
  })
  await signalRConn.start()
}
// 暴露给渲染层的发送接口
ipcMain.handle('signalR:send', async (_, method, ...args) => {
  if (!signalRConn) await initSignalR()
  return signalRConn.invoke(method, ...args)
})
// 应用启动时初始化，也可按需延迟初始化
app.whenReady().then(initSignalR)

// 所有窗口复用的preload.js
const { contextBridge, ipcRenderer } = require('electron')
contextBridge.exposeInMainWorld('signalR', {
  send: (method, ...args) => ipcRenderer.invoke('signalR:send', method, ...args),
  onMessage: (cb) => ipcRenderer.on('signalR-msg', (_, data) => cb(data)),
  offMessage: (cb) => ipcRenderer.removeListener('signalR-msg', cb)
})

所有渲染窗口直接调用window.signalR下的方法即可，全局只会存在一个连接实例。

方案2：SharedWorker托管连接 #

如果所有窗口加载的都是同源的本地页面，可通过SharedWorker实现跨窗口共享连接实例：

• 单独编写SharedWorker脚本，在Worker内部初始化SignalR连接
• 所有渲染窗口连接到同一个SharedWorker实例，通过Worker的消息通道收发数据
  注意该方案仅适用于所有窗口页面同源的场景，加载外部站点的窗口无法复用同一个SharedWorker。

方案3：preload+主进程连接复用 #

如果不想把全量逻辑迁移到主进程，可保留preload的封装，只把核心连接实例放在主进程做复用：

• preload初始化时先通过IPC查询主进程是否已经存在连接实例
• 未创建时主进程触发初始化，已创建则preload直接绑定现有连接的事件回调即可，不会重复创建新连接

避坑提示 #

• 不要尝试通过localStorage、sessionStorage共享连接实例，这类存储只能存序列化后的普通数据，无法持有类实例、长连接对象
• 不要关闭上下文隔离实现共享，会引入严重的安全风险
• 窗口销毁时要主动移除对应IPC监听器，避免内存泄漏

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