Electron 项目启动外部可执行文件的几种方式

序言

在开发 Electron 应用程序时，有时需要启动外部的可执行文件（如 .exe 文件）。这可能是为了调用系统工具、运行第三方软件或者集成现有的应用程序。
Electron 提供了多种方式来启动外部可执行文件，每种方法都有其适用场景和优缺点。本文将详细介绍这些方法，并提供详细的代码示例，帮助你在实际开发中选择最适合的方式来启动外部可执行文件。

1. 设置项目环境

首先，确保你已经安装了 Electron 和 child_process 模块。如果还没有安装，可以使用以下命令进行安装：

npm install electron --save-dev

2. 使用 `child_process.spawn` 启动外部可执行文件

child_process.spawn 是 Node.js 提供的一个方法，用于异步启动子进程。它非常适合启动长时间运行的进程，并且可以方便地处理标准输入、输出和错误流。

示例代码

const { app, BrowserWindow } = require('electron');
const { spawn } = require('child_process');let mainWindow;function createWindow() {mainWindow = new BrowserWindow({width: 800,height: 600,webPreferences: {nodeIntegration: true,contextIsolation: false,}});mainWindow.loadFile('index.html');
}app.on('ready', async () => {await createWindow();// 启动外部可执行文件function startExternalApp() {const child = spawn('notepad.exe'); // 示例：启动记事本child.stdout.on('data', (data) => {console.log(`stdout: ${data}`);});child.stderr.on('data', (data) => {console.error(`stderr: ${data}`);});child.on('close', (code) => {console.log(`子进程退出，退出码 ${code}`);});}// 绑定按钮事件mainWindow.webContents.on('did-finish-load', () => {mainWindow.webContents.send('init-start-button');});mainWindow.webContents.on('start-app', () => {startExternalApp();});
});

前端代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Electron Start External App</title>
</head>
<body><h1>Electron Start External App Example</h1><button id="start-button">Start External App</button><script>const { ipcRenderer } = require('electron');document.getElementById('start-button').addEventListener('click', () => {ipcRenderer.send('start-app');});ipcRenderer.on('init-start-button', () => {console.log('Start button initialized');});</script>
</body>
</html>

3. 使用 `child_process.exec` 启动外部可执行文件

child_process.exec 方法也用于启动子进程，但它更适合执行简单的命令行操作，并且会等待命令执行完毕后返回结果。

示例代码

const { app, BrowserWindow } = require('electron');
const { exec } = require('child_process');let mainWindow;function createWindow() {mainWindow = new BrowserWindow({width: 800,height: 600,webPreferences: {nodeIntegration: true,contextIsolation: false,}});mainWindow.loadFile('index.html');
}app.on('ready', async () => {await createWindow();// 启动外部可执行文件function startExternalApp() {const command = 'notepad.exe'; // 示例：启动记事本exec(command, (error, stdout, stderr) => {if (error) {console.error(`exec error: ${error}`);return;}console.log(`stdout: ${stdout}`);console.error(`stderr: ${stderr}`);});}// 绑定按钮事件mainWindow.webContents.on('did-finish-load', () => {mainWindow.webContents.send('init-start-button');});mainWindow.webContents.on('start-app', () => {startExternalApp();});
});

4. 使用 `shell.openPath` 或 `shell.openExternal` 启动外部可执行文件

shell.openPath 和 shell.openExternal 是 Electron 提供的方法，用于打开文件、目录或 URL。这些方法适用于不需要与外部进程进行交互的情况。

示例代码

const { app, BrowserWindow, shell } = require('electron');let mainWindow;function createWindow() {mainWindow = new BrowserWindow({width: 800,height: 600,webPreferences: {nodeIntegration: true,contextIsolation: false,}});mainWindow.loadFile('index.html');
}app.on('ready', async () => {await createWindow();// 启动外部可执行文件function startExternalApp() {const filePath = 'C:\\path\\to\\your\\app.exe'; // 替换为实际路径// 使用 shell.openPath 打开文件shell.openPath(filePath).then(() => {console.log('文件已打开');}).catch(err => {console.error(`打开文件时发生错误: ${err}`);});// 使用 shell.openExternal 打开文件shell.openExternal(filePath).then(() => {console.log('文件已打开');}).catch(err => {console.error(`打开文件时发生错误: ${err}`);});}// 绑定按钮事件mainWindow.webContents.on('did-finish-load', () => {mainWindow.webContents.send('init-start-button');});mainWindow.webContents.on('start-app', () => {startExternalApp();});
});

5. 使用 `child_process.fork` 启动外部 Node.js 脚本

child_process.fork 方法用于启动一个新的 Node.js 进程，并且可以方便地进行进程间通信。

示例代码

假设你有一个 Node.js 脚本 child.js：

// child.js
console.log('子进程启动');
process.on('message', (msg) => {console.log(`收到消息: ${msg}`);process.send('子进程响应');
});

在主进程中启动这个脚本：

const { app, BrowserWindow } = require('electron');
const { fork } = require('child_process');let mainWindow;function createWindow() {mainWindow = new BrowserWindow({width: 800,height: 600,webPreferences: {nodeIntegration: true,contextIsolation: false,}});mainWindow.loadFile('index.html');
}app.on('ready', async () => {await createWindow();// 启动外部 Node.js 脚本function startExternalScript() {const child = fork('child.js');child.on('message', (msg) => {console.log(`收到消息: ${msg}`);});child.send('主进程消息');}// 绑定按钮事件mainWindow.webContents.on('did-finish-load', () => {mainWindow.webContents.send('init-start-button');});mainWindow.webContents.on('start-app', () => {startExternalScript();});
});