如何在Electron 14版本中使用gRPC完成前后端通信？

Electron 14 对应的 Node.js 底层版本为 v14.17.0，和旧版本的 ABI 差异较大，此前基于原生 C++ 绑定的 grpc 包适配方案基本失效，推荐优先使用纯 JS 实现的 @grpc/grpc-js 完成适配，不需要重编译原生模块，兼容性更强，完全匹配你的技术栈场景。

第一步：依赖安装 #

• 先卸载项目中可能存在的旧版 gRPC 依赖：npm uninstall grpc @grpc/proto-loader
• 安装兼容 Electron 14 的依赖包：npm install @grpc/grpc-js@1.6.7 @grpc/proto-loader@0.6.13

注意：不要使用原生 grpc 包，Electron 14 没有对应的预编译二进制包，自行编译会遇到大量工具链依赖问题，纯 JS 实现的 @grpc/grpc-js 性能足够覆盖桌面端应用场景，且和原生 gRPC 的调用接口完全兼容，你之前的业务逻辑基本不需要修改。

第二步：proto 文件加载与客户端初始化 #

可以直接复用项目中已有的 .proto 定义文件，不需要调整协议内容，加载示例代码如下：

const grpc = require('@grpc/grpc-js');
const protoLoader = require('@grpc/proto-loader');
const path = require('path');

// 替换为你本地的proto文件路径
const PROTO_PATH = path.join(__dirname, 'proto/xxx_service.proto');
const packageDefinition = protoLoader.loadSync(
  PROTO_PATH,
  {
    keepCase: true,
    longs: String,
    enums: String,
    defaults: true,
    oneofs: true
  }
);
const protoDescriptor = grpc.loadPackageDefinition(packageDefinition);
// 替换为你自己的proto包名、服务名
const serviceClient = protoDescriptor.your_package_name.YourServiceName;

// 初始化gRPC客户端连接Go后端，本地调试用非加密凭证即可
const grpcClient = new serviceClient('127.0.0.1:你的后端监听端口', grpc.credentials.createInsecure());

如果你的 Go 后端开启了 TLS 加密，把凭证创建逻辑替换为对应 TLS 证书加载逻辑即可，和旧版 gRPC 的用法完全一致。

第三步：Electron 侧调用适配 #

结合你用 Angular 8 做前端的场景，推荐把 gRPC 客户端逻辑放在 Electron 主进程实现，通过 IPC 通道和渲染进程（Angular 侧）通信，避免渲染进程跨域、权限限制问题：

• 主进程监听 Angular 侧发送的 IPC 事件，收到请求后调用对应 gRPC 方法，再把返回结果通过 IPC 回传给渲染进程
• 若要直接在渲染进程调用 gRPC，需要在 BrowserWindow 初始化时配置 nodeIntegration: true、contextIsolation: false，该方案存在安全风险，不推荐生产环境使用。

第四步：打包适配 #

使用 electron-builder 等打包工具时不需要额外配置 gRPC 相关的原生模块重编译规则，@grpc/grpc-js 是纯 JS 实现，打包后可以直接运行，不会出现模块缺失、ABI 不匹配的报错。

可选优化建议 #

你可以把 Go 后端作为子进程随 Electron 启动，本地走 TCP 通信，调用延迟可以控制在毫秒级，完全匹配之前 Wails 方案的交互体验。

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