Electron通过IPC传输对象时如何保留对象类型与原型

Electron IPC 通信基于结构化克隆算法完成序列化，仅会保留对象的可枚举自有属性，不会保留原型链、实例方法、类身份标识。主进程与渲染进程内存完全隔离，不存在直接跨进程传递原生类实例的可能，必须在接收端完成类型重建。

原有代码的问题点 #

• Object.assign(ReferenceDescription, nodes[0])用法存在逻辑错误：Object.assign第一个参数为写入目标，传入类构造函数时，属性会被挂载到构造函数本身而非类原型实例上，既无法生成合法类实例，还会污染类的静态属性。
• 抛出如下错误的核心原因是渲染进程环境无法直接导入node-opcua包：

Uncaught Error: Cannot read properties of undefined (reading 'ReferenceDescription')

Electron默认开启上下文隔离与沙箱机制，渲染进程无Node.js API完整访问权限，node-opcua作为依赖Node原生能力的包，在渲染进程中直接导入会返回undefined，自然无法读取其导出的ReferenceDescription类。

• 直接调用new ReferenceDescription()不传构造参数只会生成空的类实例，不会自动填充IPC传输过来的属性，无法得到可用的实例对象。

可行实现方案 #

方案1：preload层手动重建实例（官方推荐，安全性最高） #

核心逻辑：IPC通道仅传输纯JSON格式的业务数据，在拥有Node.js API访问权限的preload脚本中完成类实例重建，再把可用实例传递给渲染进程使用，全程不需要在渲染进程导入Node原生模块。
参考实现：

// preload.ts
import { contextBridge, ipcRenderer } from 'electron';
import { ReferenceDescription } from 'node-opcua';

contextBridge.exposeInMainWorld('electron', {
  opcua: {
    onNodeListChange: (callback: (nodes: ReferenceDescription[]) => void) => {
      ipcRenderer.on('opcua:node-list-change', (_, rawNodeList) => {
        // 遍历IPC传过来的纯数据，重建带正确原型链的实例
        const typedNodes = rawNodeList.map(rawData => {
          // 创建绑定正确原型的空实例
          const instance = Object.create(ReferenceDescription.prototype);
          // 把纯数据的自有属性拷贝到实例上
          return Object.assign(instance, rawData);
          // 如果类构造函数支持传入数据初始化，可直接替换为：
          // return new ReferenceDescription(rawData);
        });
        callback(typedNodes);
      })
    }
  }
})

渲染进程侧无需额外导入node-opcua，直接拿到可用实例即可：

// 渲染进程React业务代码
window.electron.opcua.onNodeListChange(nodes => {
  // nodes数组内的元素已经是带正确原型、可正常调用实例方法的ReferenceDescription对象
  console.log(nodes[0]);
})

方案2：自定义序列化反序列化逻辑（适合复杂类场景） #

如果需要传输的类实例包含不可枚举属性、内部状态等特殊字段，可以给对应类实现自定义序列化方法，IPC传输时把实例还原所需的全部字段打包为纯数据，接收端按照固定规则反序列化为类实例即可。对于ReferenceDescription这类纯数据承载类，方案1已足够满足需求。

避坑说明 #

• 不建议为了简化代码关闭contextIsolation、开启nodeIntegration，该操作会大幅提升应用的安全风险，尤其在加载远程Web内容的场景下可能导致RCE漏洞。
• 所有依赖Node.js原生能力的逻辑尽量收敛在主进程或preload层，渲染进程仅负责UI渲染逻辑，不要直接在渲染进程导入Node原生模块。

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