Electron中XLSX库追加工作表后工作簿为空的技术问题求助

问题分析 #

1. 渲染进程直接写文件的权限限制：Electron 默认安全策略下，渲染进程没有直接操作本地文件的权限，你在渲染进程调用XLSX.writeFile不会生效，这是最终无法生成文件的核心原因。
2. 工作簿"为空"的视觉误导：console.log(wb)显示为空是浏览器控制台的展开逻辑问题，XLSX 工作簿的工作表实际存储在wb.SheetNames（工作表名称数组）和wb.Sheets（工作表对象集合）属性中，打印这两个属性就能确认工作表已被正确添加。

解决方案 #

核心思路：在渲染进程生成 Excel 工作簿的 Buffer 数据，通过 Electron 的 IPC 通信将 Buffer 传给主进程，由主进程负责写入本地文件。

1. 预加载脚本（preload.js）

仅暴露必要的 XLSX 工具方法，遵循 Electron 安全规范：

const { contextBridge, ipcRenderer } = require('electron');
const XLSX = require('xlsx');

contextBridge.exposeInMainWorld('electronAPI', {
  // 生成多工作表的Excel Buffer
  generateExcelBuffer: (dataArrays, sheetNames) => {
    const wb = XLSX.utils.book_new();
    dataArrays.forEach((arr, index) => {
      const ws = XLSX.utils.aoa_to_sheet(arr);
      const sheetName = sheetNames[index] || `Sheet${index + 1}`;
      XLSX.utils.book_append_sheet(wb, ws, sheetName);
    });
    return XLSX.write(wb, { type: 'buffer', bookType: 'xlsx' });
  },
  // 请求主进程保存文件
  saveExcelFile: (buffer, filePath) => {
    return ipcRenderer.invoke('save-excel', buffer, filePath);
  }
});

2. 渲染进程代码（renderer.js）

调用预加载暴露的 API 生成 Buffer，再请求主进程保存：

// 示例：8组数据对应8个工作表
const dataArrays = [
  ["string1-1", "string1-2"],
  ["string2-1"],
  ["string3-1", "string3-2", "string3-3"],
  ["string4-1"],
  ["string5-1"],
  ["string6-1", "string6-2"],
  ["string7-1"],
  ["string8-1"]
];
const sheetNames = ["Sheet1", "Sheet2", "Sheet3", "Sheet4", "Sheet5", "Sheet6", "Sheet7", "Sheet8"];

// 生成Excel Buffer
const excelBuffer = window.electronAPI.generateExcelBuffer(dataArrays, sheetNames);

// 请求主进程保存文件（可替换为用户选择路径逻辑）
window.electronAPI.saveExcelFile(excelBuffer, './SheetJSExportAOA.xlsx')
  .then(() => alert('文件保存成功'))
  .catch(err => console.error('保存失败:', err));

3. 主进程代码（main.js）

监听 IPC 请求，负责实际的文件写入操作：

const { app, BrowserWindow, ipcMain } = require('electron');
const fs = require('fs/promises');
const path = require('path');

function createWindow() {
  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js'),
      contextIsolation: true, // 强制开启，保证渲染进程安全
      nodeIntegration: false
    }
  });
  mainWindow.loadFile('index.html');
}

// 处理保存Excel的IPC调用
ipcMain.handle('save-excel', async (event, buffer, filePath) => {
  try {
    await fs.writeFile(filePath, buffer);
    return true;
  } catch (err) {
    throw err;
  }
});

app.whenReady().then(() => {
  createWindow();
  app.on('activate', () => {
    if (BrowserWindow.getAllWindows().length === 0) createWindow();
  });
});

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') app.quit();
});

可选优化：让用户选择保存路径 #

如果需要让用户自定义保存位置，可以修改主进程的 IPC 处理逻辑，使用系统对话框：

const { dialog } = require('electron');

ipcMain.handle('save-excel', async (event, buffer) => {
  const win = BrowserWindow.fromWebContents(event.sender);
  const { filePath } = await dialog.showSaveDialog(win, {
    defaultPath: 'SheetJSExportAOA.xlsx',
    filters: [{ name: 'Excel 文件', extensions: ['xlsx'] }]
  });
  if (!filePath) return;
  await fs.writeFile(filePath, buffer);
});

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