本教程详细阐述了在 electron.js 应用中安全地与 sql 数据库交互的最佳实践。核心原则是避免客户端直接连接数据库和嵌入敏感凭证，推荐采用后端服务层作为中介，通过 electron 的主进程与后端服务进行安全通信，从而保护数据库凭证并防止潜在的安全漏洞，确保应用的数据完整性和安全性。
1. 理解安全风险：为何不能直接连接数据库？
Electron 应用程序本质上是一个桌面应用，其渲染进程（即前端界面）运行在 Chromium 环境中，与网页类似。如果允许渲染进程或甚至主进程直接连接到 SQL 数据库，将面临严重的安全风险：
- 凭证泄露风险：将数据库用户名、密码等敏感信息直接嵌入到 Electron 应用中，意味着这些凭证会随着应用分发到每一个用户的机器上。攻击者可以通过逆向工程轻松提取这些信息，从而直接访问数据库。
- SQL 注入攻击：如果客户端直接构建 SQL 查询字符串，很容易遭受 SQL 注入攻击，导致数据泄露、篡改甚至数据库被完全控制。
- 权限管理复杂：直接连接数据库难以实现细粒度的用户权限控制。每个客户端都可能拥有相同的数据库访问权限，一旦被攻破，影响范围巨大。
- 业务逻辑暴露：将业务逻辑放在客户端处理，容易被篡改或绕过。
因此，绝不应让 Electron 应用程序直接连接到数据库。
2. 推荐架构：引入后端服务层
为了安全地与 SQL 数据库交互，Electron 应用程序应采用经典的客户端-服务器架构。这意味着你需要一个独立的后端服务（例如使用 node.js、python、java 等框架构建的 restful API 或 graphql 服务）作为 Electron 应用与数据库之间的中介。
工作流示意图：
+------------------+ IPC +-------------------+ http/RPC +-------------------+ SQL +-----------------+ | Electron Renderer| <---------> | Electron Main | <--------------> | Backend Service | <---------> | SQL Database | | (UI/前端逻辑) | | (node.js 环境) | | (业务逻辑/API) | | (数据存储) | +------------------+ +-------------------+ +-------------------+ +-----------------+ ^ | ^ | | | +---------------------------------+----------------------------------------+ 用户输入/操作 安全凭证管理/SQL 查询执行
在这种架构下：
- Electron 应用程序：只负责用户界面展示和用户输入收集。
- Electron 主进程：作为渲染进程与后端服务之间的桥梁，通过 IPC（进程间通信）接收渲染进程的请求，然后使用标准的网络协议（如 HTTP/https）与后端服务通信。
- 后端服务：
- 存储和管理数据库连接凭证（通过环境变量、密钥管理服务等方式）。
- 接收来自 Electron 主进程的请求。
- 执行业务逻辑，包括验证、授权和构建安全的 SQL 查询。
- 使用参数化查询（Prepared Statements）等方式防止 SQL 注入。
- 连接并操作 SQL 数据库。
- 将查询结果返回给 Electron 主进程。
3. Electron 与后端服务通信实现
以下是基于用户提供的代码，重构以实现安全通信的示例：
3.1 预加载脚本 (preload.js)
预加载脚本是连接渲染进程和主进程的关键，它在渲染进程加载之前运行，并可以安全地将 Node.js API 暴露给渲染进程，同时保持 contextIsolation 开启以增强安全性。
// preload.js const { contextBridge, ipcRenderer } = require('electron'); // 通过 contextBridge 暴露一个安全的 API 到渲染进程的 window 对象 contextBridge.exposeInMainWorld('GlobalApi', { // invoke 用于从渲染进程向主进程发送请求并等待响应（异步） invoke: (channel, args) => ipcRenderer.invoke(channel, args), // on 用于监听主进程发送给渲染进程的事件 on: (channel, func) => ipcRenderer.on(channel, (event, ...args) => func(...args)) });
3.2 渲染进程 (renderer.js)
渲染进程负责收集用户输入，并通过预加载脚本暴露的 API 将数据发送到主进程。
// renderer.js // 注意：在 contextIsolation 开启时，不能直接 require('electron') 或访问 ipcRenderer // 而是通过 preload.js 暴露的 GlobalApi 来与主进程通信。 const loginForm = document.getElementById('login-form'); const usernameInput = document.getElementById('username'); const passwordInput = document.getElementById('password'); const messageContainer = document.getElementById('message-container'); // 添加一个消息显示容器 loginForm.addEventListener('submit', async (event) => { event.preventDefault(); const username = usernameInput.value; const password = passwordInput.value; messageContainer.innerhtml = ''; // 清空之前的消息 try { // 使用 preload.js 暴露的 GlobalApi.invoke 调用主进程的 'login-request' 处理器 const isSuccess = await window.GlobalApi.invoke('login-request', { username, password }); const messageElement = document.createElement('p'); if (isSuccess) { messageElement.textContent = '登录成功！'; messageElement.style.color = 'green'; } else { messageElement.textContent = '用户名或密码不正确，或登录失败。'; messageElement.style.color = 'red'; } messageContainer.appendChild(messageElement); setTimeout(() => { messageContainer.removeChild(messageElement); }, 3000); // 3秒后移除消息 } catch (error) { console.error('登录请求失败:', error); const errorElement = document.createElement('p'); errorElement.textContent = `登录过程中发生错误: ${error.message}`; errorElement.style.color = 'orange'; messageContainer.appendChild(errorElement); } });
请确保你的 index.html 中有一个 id=”message-container” 的元素来显示消息。
3.3 主进程 (main.js)
主进程接收来自渲染进程的请求，然后调用后端服务进行实际的数据库操作。在这个示例中，我们将使用 axios 库来发送 HTTP 请求到后端服务。你需要先安装 axios：npm install axios。
// main.js const { app, BrowserWindow, ipcMain } = require('electron'); const path = require('path'); const axios = require('axios'); // 引入 axios let mainWindow; // 假设你的后端服务地址。在生产环境中，这应该是一个可配置的变量，而非硬编码。 const BACKEND_API_BASE_URL = 'http://localhost:3000/api'; // 例如：你的后端服务监听在 3000 端口 function createWindow() { mainWindow = new BrowserWindow({ width: 800, height: 600, webPreferences: { preload: path.join(__dirname, 'preload.js'), contextIsolation: true, // 强烈建议启用 contextIsolation 以增强安全性 nodeIntegration: false // 强烈建议禁用 nodeIntegration }, }); mainWindow.loadFile(path.join(__dirname, 'index.html')); // 调试时可以打开开发者工具 mainWindow.webContents.openDevTools(); mainWindow.on('closed', () => { mainWindow = null; }); } app.on('ready', createWindow); app.on('window-all-closed', () => { if (process.platform !== 'darwin') { app.quit(); } }); // 监听渲染进程发来的 'login-request' 请求 ipcMain.handle('login-request', async (event, loginData) => { const { username, password } = loginData; console.log(`主进程收到登录请求。用户名: ${username}`); try { // 向后端服务发送登录请求 const response = await axios.post(`${BACKEND_API_BASE_URL}/login`, { username, password }); // 假设后端服务返回的数据结构为 { success: boolean, message?: string } // 根据后端响应判断登录是否成功 return response.data.success; } catch (error) { console.error('调用后端登录API失败:', error.message); // 根据错误类型，可以返回更详细的错误信息 // 例如，如果后端返回 401 Unauthorized，可以提示凭证错误 // 这里简化处理，任何后端通信错误都视为登录失败 return false; } }); // 示例：处理其他数据库操作，例如获取用户数据 ipcMain.handle('get-user-data', async (event, userId) => { console.log(`主进程收到获取用户数据请求，用户ID: ${userId}`); try { // 向后端服务发送获取数据的请求 const response = await axios.get(`${BACKEND_API_BASE_URL}/users/${userId}`); return response.data; // 返回后端返回的用户数据 } catch (error) { console.error(`调用后端获取用户数据API失败 (ID: ${userId}):`, error.message); return null; // 返回空值或错误信息 } }); // 移除所有直接的数据库连接代码（例如 tedious 相关的配置和连接逻辑） // var Connection = require('tedious').Connection; // var Request = require('tedious').Request; // ... // 这些代码应该存在于你的后端服务中，而非 Electron 的 main.js
3.4 后端服务 (Backend Service) – 概念性说明
这是一个独立的服务器应用，它负责实际的数据库连接和操作。以下是一个使用 Node.js 和 express.js 构建的简单后端服务示例（这部分代码不在 Electron 应用中，需要单独部署）：
// backend-service/app.js (这是一个独立的 Node.js Express 应用) const express = require('express'); const bodyParser = require('body-parser'); const tedious = require('tedious'); // 用于连接 SQL Server const app = express(); const port = 3000; app.use(bodyParser.json()); // 允许 Electron 应用跨域访问（仅用于开发环境，生产环境需更严格配置） app.use((req, res, next) => { res.header('Access-Control-Allow-Origin', '*'); // 允许所有来源 res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept'); next(); }); // 数据库连接配置 // 注意：这些凭证应该从环境变量或安全的配置管理系统中加载，绝不能硬编码！ const dbConfig = { server: process.env.DB_SERVER || 'your_sql_server_address', authentication: { type: 'default', options: { userName: process.env.DB_USERNAME || 'your_db_username', password: process.env.DB_PASSWORD || 'your_db_password' } }, options: { encrypt: true, // 根据你的 SQL Server 配置决定是否需要加密 database: process.env.DB_DATABASE || 'your_database_name', rowCollectionOnRequestCompletion: true // 方便一次性获取所有行 } }; // 登录 API 路由 app.post('/api/login', (req, res) => { const { username, password } = req.body; // 建立数据库连接 const connection = new tedious.Connection(dbConfig); connection.on('connect', (err) => { if (err) { console.error('数据库连接失败:', err.message); return res.status(500).json({ success: false, message: '数据库连接失败' }); } console.log('数据库连接成功'); // 执行查询以验证用户凭证 // **重要：使用参数化查询防止 SQL 注入！** const request = new tedious.Request( "SELECT COUNT(*) AS UserCount FROM Users WHERE username = @username AND password = @password", // 假设有一个 Users 表 (err, rowCount, rows) => { connection.close(); // 查询完成后关闭连接 if (err) { console.error('查询执行失败:', err.message); return res.status(500).json({ success: false, message: '服务器内部错误' }); } if (rows && rows.length > 0 && rows[0][0].value > 0) { res.json({ success: true, message: '登录成功' }); } else { res.status(401).json({ success