Electron应用无法将API密钥保存至JSON文件求助

点击保存按钮时，输入的API密钥无法写入指定JSON文件，文件始终为空且无任何报错信息。相关代码及初始JSON文件如下：

前端处理代码 #

const apiBox = document.getElementById('apibox');
const saveButton = document.getElementById('saveapi');

saveButton.addEventListener('click', () => {
    const apiKey = apiBox.value;

    const data = {
        apikey: apiKey
    };

    const jsonStr = JSON.stringify(data, null, 2);

    fs.writeFileSync(path.join(__dirname, '../data/data.json'), jsonStr);
});

初始JSON文件（data.json） #

{
    "apikey": ""
}

排查与解决思路 #

• 路径验证：path.join(__dirname, '../data/data.json') 可能指向错误路径。先打印目标路径确认：

  const targetPath = path.join(__dirname, '../data/data.json');
  console.log('目标文件路径：', targetPath);
  

  若路径不存在，先创建目录再写入：

  const fs = require('fs');
  const path = require('path');
  const targetPath = path.join(__dirname, '../data/data.json');
  // 递归创建目录
  fs.mkdirSync(path.dirname(targetPath), { recursive: true });
  fs.writeFileSync(targetPath, jsonStr);
  

• 权限检查：当前运行程序的用户无目标文件/目录的写入权限。手动检查文件权限，或提升权限运行程序。

• 跨环境限制（如Electron）：如果是Electron应用，渲染进程无法直接调用fs模块，需通过主进程IPC通信完成文件写入。

• 输入值校验：若apiBox.value为空，写入后的JSON会和初始文件一致。添加日志确认值是否正确获取：

  console.log('获取到的API密钥：', apiKey);
  

• 捕获静默错误：writeFileSync的异常可能被吞掉，用try-catch捕获并输出：

  try {
    fs.writeFileSync(targetPath, jsonStr);
    console.log('写入成功');
  } catch (err) {
    console.error('写入失败：', err);
  }
  

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