0

0

Electron.js 应用中安全地进行 SQL 数据库操作的教程

聖光之護

聖光之護

发布时间:2025-11-07 16:10:00

|

839人浏览过

|

来源于php中文网

原创

Electron.js 应用中安全地进行 SQL 数据库操作的教程

本教程旨在指导开发者如何在 electron.js 应用程序中安全地与 sql 数据库进行交互。核心原则是避免直接从 electron 客户端连接数据库,而是通过构建一个独立的后端 api 服务作为中介,从而保护数据库凭据,防止 sql 注入,并增强应用程序的整体安全性与可维护性。

引言:Electron 与 SQL 交互的挑战

Electron 应用程序结合了 Web 技术(HTML、CSS、JavaScript)和 Node.js 的能力,允许开发者构建跨平台的桌面应用。在许多业务场景中,应用程序需要与数据库进行交互以存储和检索数据。然而,直接从 Electron 应用程序连接 SQL 数据库,尤其是在客户端代码中包含数据库连接凭据,会带来严重的安全风险。

Electron 应用程序由两个主要进程组成:

  • 主进程 (Main Process):负责创建和管理渲染进程,以及处理操作系统级别的交互。它拥有完整的 Node.js API 访问权限。
  • 渲染进程 (Renderer Process):负责显示用户界面,运行在独立的 Chromium 实例中,类似于网页浏览器。

如果将数据库连接逻辑和凭据直接放在主进程中,虽然主进程不像渲染进程那样容易被用户直接访问,但打包后的 Electron 应用仍然是客户端软件,用户可以通过逆向工程、查看网络请求日志等方式获取敏感信息。更危险的是,将数据库连接逻辑暴露在渲染进程中则几乎等同于将数据库完全暴露给最终用户。此外,直接在客户端执行 SQL 查询也极易遭受 SQL 注入攻击。

因此,为了确保数据安全和应用程序的健壮性,我们必须采用一种更安全的架构模式。

核心安全策略:引入后端 API 服务

在 Electron 应用中安全地访问 SQL 数据库的最佳实践是引入一个独立的后端 API 服务作为中介层。这种架构将数据库操作从客户端完全隔离,从而保护敏感凭据并集中处理数据逻辑和安全性。

推荐架构示意图:

Electron 渲染进程 (renderer.js)
        ↓ (用户输入)
Electron 主进程 (main.js) (通过 ipcRenderer/ipcMain 通信)
        ↓ (HTTP/S 请求)
独立后端 API 服务 (Node.js/Python/Java等)
        ↓ (数据库驱动)
SQL 数据库 (例如:SQL Server)

后端 API 服务的作用:

MMM金融互助系统源码
MMM金融互助系统源码

MMM金融互助系统源码是以thinkphp为核心进行开发的3m金融互助平台。程序安装说明:1.恢复数据:将“数据备份”文件夹中的 urkeji.sql 文件请采用phpMyAdmin进行导入; 2.配置Sql数据库信息,文件路径:根目录下 config.php3.后台管理地址:http://域名/admin.php 用户名:100000 密码:admin1

下载
  1. 凭据管理: 后端服务负责安全地存储和使用数据库连接凭据,这些凭据绝不会暴露给 Electron 客户端。
  2. SQL 查询执行: 后端服务接收来自 Electron 应用的请求,并使用其内部的数据库驱动程序执行 SQL 查询。
  3. 数据验证与安全性: 后端服务可以对所有传入的数据进行严格的验证和清理,以防止 SQL 注入和其他恶意攻击。
  4. 业务逻辑: 复杂的业务逻辑可以集中在后端处理,使 Electron 应用保持轻量和专注于用户界面。
  5. 认证与授权: 后端服务可以实现用户认证(如登录)和授权机制,确保只有经过验证的用户才能访问特定数据或功能。
  6. 可伸缩性与可维护性: 将数据层与 UI 层分离,有助于应用程序的长期维护和未来扩展。

Electron 应用程序端实现

Electron 应用的主要任务是收集用户输入,通过 IPC (Inter-Process Communication) 机制将请求发送到主进程,然后主进程将这些请求转发给后端 API,并处理后端 API 的响应。

1. renderer.js (渲染进程)

渲染进程负责用户界面的呈现和交互。当用户输入数据(例如用户名和密码)并提交时,renderer.js 会通过 Electron 的 ipcRenderer 模块将数据发送到主进程。

// renderer.js
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;

    try {
        // 使用预加载脚本暴露的 API 调用主进程
        const response = await window.myCoolApi.login({ username, password }); 
        if (response.success) {
            showMessage('Login successful', 'green');
            // 可以在此处重定向或加载主界面
        } else {
            showMessage(response.message || 'Incorrect details.', 'red');
        }
    } catch (error) {
        console.error('Login error:', error);
        showMessage('An error occurred during login.', 'red');
    }
});

function showMessage(text, color) {
    messageContainer.textContent = text;
    messageContainer.style.color = color;
    setTimeout(() => {
        messageContainer.textContent = '';
    }, 3000);
}

2. preload.js (预加载脚本)

为了增强安全性,我们应启用 contextIsolation 并在 preload.js 中使用 contextBridge 安全地将特定功能暴露给渲染进程,而不是直接在渲染进程中启用 nodeIntegration。

// preload.js
const { contextBridge, ipcRenderer } = require('electron');

contextBridge.exposeInMainWorld('myCoolApi', {
    // 暴露一个异步函数,用于向主进程发送登录请求
    login: (credentials) => ipcRenderer.invoke('login-request', credentials),
    // 可以暴露其他需要主进程处理的函数
    // getData: (params) => ipcRenderer.invoke('get-data-request', params)
});

3. main.js (主进程)

主进程接收来自渲染进程的请求,然后使用 HTTP 客户端(如 axios 或内置的 fetch API)向后端 API 发送请求。它不直接进行数据库连接。

首先,确保你的 package.json 中安装了 axios 或 node-fetch: npm install axios 或 npm install node-fetch

// main.js
const { app, BrowserWindow, ipcMain } = require('electron');
const path = require('path');
const axios = require('axios'); // 或使用内置的 node-fetch

let mainWindow;

// 配置后端 API 的基础 URL
const BACKEND_API_URL = 'http://localhost:3000/api'; // 根据你的后端服务地址调整

function createWindow() {
    mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            // 强烈建议启用 contextIsolation 以增强安全性
            contextIsolation: true,
            // nodeIntegration 应该为 false,通过 preload 脚本安全地暴露 API
            nodeIntegration: false,
            preload: path.join(__dirname, 'preload.js')
        },
    });

    mainWindow.loadFile(path.join(__dirname, 'index.html'));

    mainWindow.on('closed', () => {
        mainWindow = null;
    });
}

app.on('ready', createWindow);

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

// 监听渲染进程的登录请求
ipcMain.handle('login-request', async (event, loginData) => {
    try {
        // 向后端 API 发送登录请求
        const response = await axios.post(`${BACKEND_API_URL}/login`, loginData);
        // 返回后端 API 的响应给渲染进程
        return { success: true, message: response.data.message, token: response.data.token };
    } catch (error) {
        console.error('Error calling backend login API:', error.message);
        // 根据后端错误响应码返回不同的消息
        if (error.response && error.response.status === 401) {
            return { success: false, message: 'Invalid username or password.' };
        }
        return { success: false, message: 'An unexpected error occurred. Please try again later.' };
    }
});

// 示例:如果需要从后端获取数据
ipcMain.handle('get-data-request', async (event, params) => {
    try {
        // 假设登录后获取了 token,并将其存储在主进程中
        // 实际应用中,token 应该更安全地管理,例如通过 session 或 secure store
        const userToken = 'YOUR_AUTH_TOKEN_HERE'; // 替换为实际的认证 token

        const response = await axios.get(`${BACKEND_API_URL}/data`, {
            params: params,
            headers: {
                'Authorization': `Bearer ${userToken}` // 发送认证 token
            }
        });
        return { success: true, data: response.data };
    } catch (error) {
        console.error('Error calling backend get data API:', error.message);
        return { success: false, message: 'Failed to fetch data.' };
    }
});

后端 API 服务端实现 (概念与最佳实践)

后端 API 服务是一个独立的应用程序,它负责与 SQL 数据库进行实际交互。你可以选择任何你熟悉的后端技术栈,例如 Node.js (Express, Koa)、Python (Flask, Django)、Java (Spring Boot) 等。这里以 Node.js 和 Express 为例,使用 tedious 库连接 SQL Server。

首先,在后端项目目录中安装必要的包: npm init -ynpm install express tedious dotenv

// backend/server.js
const express = require('express');
const Connection = require('tedious').Connection;
const Request = require('tedious').Request;
const TYPES = require('tedious').TYPES;
const dotenv = require('dotenv'); // 用于加载环境变量

dotenv.config(); // 加载 .env 文件中的环境变量

const app = express();
const PORT = process.env.PORT || 3000;

app.use(express.json()); // 允许 Express 解析 JSON 请求体

// 从环境变量安全加载数据库配置
const dbConfig = {
    server: process.env.DB_SERVER,
    authentication: {
        type: 'default',
        options: {
            userName: process.env.DB_USERNAME,
            password: process.env.DB_PASSWORD
        }
    },
    options: {
        encrypt: process.env.DB_ENCRYPT === 'true', // 根据环境配置是否加密
        database: process.env.DB_DATABASE,
        trustServerCertificate: process.env.DB_TRUST_SERVER_CERTIFICATE === 'true' // 如果使用自签名证书,可能需要设置为 true
    }
};

// 简单的登录 API 路由
app.post('/api/login', (req, res) => {
    const { username, password } = req.body;

    if (!username || !password) {
        return res.status(400).json({ success: false, message: 'Username and password are required.' });
    }

    const connection = new Connection(dbConfig);

    connection.on('connect', (err) => {
        if (err) {
            console.error('Database connection error:', err.message);
            return res.status(500).json({ success: false, message: 'Database connection failed.' });
        }

        console.log("Connected to SQL Server for login.");

        // !!! 重要:在实际应用中,密码应存储为哈希值,并在服务器端进行比对,而不是直接查询明文密码。
        // 此处为简化示例,请勿在生产环境中使用此方法。
        const request = new Request(
            "SELECT UserId, Username FROM Users WHERE Username = @username AND PasswordHash = HASHBYTES('SHA2_256', @password)", // 假设密码以 SHA2_256 哈希存储
            (err, rowCount, rows) => {
                if (err) {
                    console.error('SQL query error:', err.message);
                    connection.close();
                    return res.status(500).json({ success: false, message: 'Login failed due to server error.' });
                }

                if (rowCount > 0) {
                    // 登录成功,可以生成并返回一个认证 Token (如 JWT)
                    // const token = generateAuthToken(rows[0].UserId);
                    res.json({ success: true, message: 'Login successful', /* token: token */ });
                } else {
                    res.status(401).json({ success: false, message: 'Invalid username or password.' });
                }
                connection.close();
            }
        );

        // 使用参数化查询防止 SQL 注入
        request.addParameter('username', TYPES.NVarChar, username);
        request.addParameter('password', TYPES.NVarChar, password); // 实际应传递哈希后的密码或在DB中进行哈希比对

        connection.execSql(request);
    });

    connection.on('error', (err) => {
        console.error('Connection error (outside connect event):', err.message);
        // 可以在这里处理连接池的错误或重试逻辑
    });

    connection.connect();
});

// 示例:获取数据的 API 路由 (需要认证)
app.get('/api/data', (req, res) => {
    // 实际应用中,这里应该有认证中间件来验证 token
    // 例如:authenticateToken(req, res, () => { ... })
    // if (!req.user) { return res.status(403).json({ message: 'Unauthorized' }); }

    const connection = new Connection(dbConfig);
    connection.on('connect', (err) => {
        if (err) {
            console.error('Database connection error:', err.message);
            return res.status(500).json({ success: false, message: 'Database connection failed.' });
        }

        const request = new Request(
            "SELECT * FROM Products WHERE Category = @category", // 示例查询
            (err, rowCount, rows) => {
                if (err) {
                    console.error('SQL query error:', err.message);
                    connection.close();
                    return res

相关专题

更多
python开发工具
python开发工具

php中文网为大家提供各种python开发工具,好的开发工具,可帮助开发者攻克编程学习中的基础障碍,理解每一行源代码在程序执行时在计算机中的过程。php中文网还为大家带来python相关课程以及相关文章等内容,供大家免费下载使用。

769

2023.06.15

python打包成可执行文件
python打包成可执行文件

本专题为大家带来python打包成可执行文件相关的文章,大家可以免费的下载体验。

661

2023.07.20

python能做什么
python能做什么

python能做的有:可用于开发基于控制台的应用程序、多媒体部分开发、用于开发基于Web的应用程序、使用python处理数据、系统编程等等。本专题为大家提供python相关的各种文章、以及下载和课程。

764

2023.07.25

format在python中的用法
format在python中的用法

Python中的format是一种字符串格式化方法,用于将变量或值插入到字符串中的占位符位置。通过format方法,我们可以动态地构建字符串,使其包含不同值。php中文网给大家带来了相关的教程以及文章,欢迎大家前来阅读学习。

639

2023.07.31

python教程
python教程

Python已成为一门网红语言,即使是在非编程开发者当中,也掀起了一股学习的热潮。本专题为大家带来python教程的相关文章,大家可以免费体验学习。

1325

2023.08.03

python环境变量的配置
python环境变量的配置

Python是一种流行的编程语言,被广泛用于软件开发、数据分析和科学计算等领域。在安装Python之后,我们需要配置环境变量,以便在任何位置都能够访问Python的可执行文件。php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

549

2023.08.04

python eval
python eval

eval函数是Python中一个非常强大的函数,它可以将字符串作为Python代码进行执行,实现动态编程的效果。然而,由于其潜在的安全风险和性能问题,需要谨慎使用。php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

579

2023.08.04

scratch和python区别
scratch和python区别

scratch和python的区别:1、scratch是一种专为初学者设计的图形化编程语言,python是一种文本编程语言;2、scratch使用的是基于积木的编程语法,python采用更加传统的文本编程语法等等。本专题为大家提供scratch和python相关的文章、下载、课程内容,供大家免费下载体验。

709

2023.08.11

Java编译相关教程合集
Java编译相关教程合集

本专题整合了Java编译相关教程,阅读专题下面的文章了解更多详细内容。

5

2026.01.21

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Sass 教程
Sass 教程

共14课时 | 0.8万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 2.9万人学习

CSS教程
CSS教程

共754课时 | 21.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号