Electron 是一個流行的框架，允許開發者使用 Web 技術（HTML、CSS、JavaScript）構建跨平臺桌面應用。許多知名應用，如 VS Code、Slack 和 Discord，都基于 Electron 開發。然而，由于其結合了 Node.js（后端能力）和 Chromium（前端渲染），Electron 應用也面臨獨特的安全挑戰。如果安全措施不到位，攻擊者可能利用漏洞執行任意代碼、竊取用戶數據，甚至控制用戶系統。

本文將深入探討 Electron 的安全最佳實踐，涵蓋進程隔離、內容安全策略（CSP）、遠程內容處理、主進程保護、安全存儲、應用打包與分發等方面，幫助開發者構建更安全的桌面應用。

1. 基本安全原則

1.1 保持 Electron 和依賴項更新

Electron 團隊會定期發布安全更新，修復已知漏洞。開發者應：

• 使用最新穩定版 Electron（npm update electron）。

• 定期檢查依賴項（npm audit?或?yarn audit）。

• 訂閱 Electron 安全公告（Electron Security Advisories）。

1.2 最小權限原則

• 文件系統訪問：避免不必要的?fs?模塊使用，限制讀寫權限。

• 網絡請求：僅允許訪問必要的 API 端點（使用?net?或?fetch?時限制域名）。

• 系統 API：謹慎使用?shell.openExternal()，防止任意 URL/命令執行。

2. 進程隔離與上下文隔離

Electron 采用多進程架構：

• 主進程（Main Process）：Node.js 環境，管理應用生命周期。

• 渲染進程（Renderer Process）：Chromium 環境，顯示 Web 內容。

2.1 啟用上下文隔離（Context Isolation）

默認情況下，渲染進程可以訪問 Node.js API，這可能導致安全風險。應啟用?contextIsolation?隔離主進程和渲染進程：

new BrowserWindow({webPreferences: {contextIsolation: true, // 啟用隔離nodeIntegration: false, // 禁用 Node.js 集成（推薦）},
});

2.2 使用預加載腳本安全通信

預加載腳本（Preload Script）是主進程和渲染進程之間的橋梁，應僅暴露必要的 API：

// preload.js
const { contextBridge, ipcRenderer } = require("electron");contextBridge.exposeInMainWorld("api", {readFile: (path) => ipcRenderer.invoke("read-file", path),showDialog: (options) => ipcRenderer.invoke("show-dialog", options),
});

渲染進程只能通過?window.api?訪問這些方法，而非直接調用 Node.js API。

3. 內容安全策略（CSP）

CSP 可防止 XSS（跨站腳本攻擊）和數據注入。在 HTML 文件中添加：

<meta http-equiv="Content-Security-Policy" content="default-src 'self';script-src 'self' 'unsafe-inline' https://trusted.cdn.com;style-src 'self' 'unsafe-inline';img-src 'self' data:;connect-src 'self' https://api.example.com;
">

• default-src 'self'：默認僅允許加載同源資源。

• script-src：限制 JavaScript 來源，避免惡意腳本執行。

• connect-src：限制可訪問的 API 端點。

4. 安全處理遠程內容

4.1 禁用 Node.js 集成

如果渲染進程加載遠程內容（如第三方網頁），必須禁用?nodeIntegration：

new BrowserWindow({webPreferences: {nodeIntegration: false,contextIsolation: true,},
});

4.2 啟用沙盒模式

沙盒模式限制渲染進程的權限，防止訪問系統資源：

new BrowserWindow({webPreferences: {sandbox: true, // 啟用沙盒},
});

4.3 限制 iframe 和 WebView

避免在 iframe 或 WebView 中加載不受信任的內容：

<webview src="https://trusted-site.com" nodeintegration="false"></webview>

5. 保護主進程

5.1 驗證 IPC 通信

主進程應驗證來自渲染進程的 IPC 消息：

ipcMain.handle("read-file", (event, path) => {if (!isValidPath(path)) throw new Error("Invalid path");return fs.readFileSync(path, "utf-8");
});

5.2 禁用危險 API

• eval()?和?Function()：避免動態執行代碼。

• shell.openExternal()：限制可打開的 URL（如僅允許?https://）。

6. 安全存儲

6.1 加密敏感數據

使用?node:crypto?或第三方庫（如?tweetnacl）加密數據：

const { encrypt, decrypt } = require("./crypto-utils");
localStorage.setItem("token", encrypt("secret-token"));

6.2 使用安全存儲 API

Electron 提供?safeStorage?加密數據：

const { safeStorage } = require("electron");
const encrypted = safeStorage.encryptString("secret-data");
const decrypted = safeStorage.decryptString(encrypted);

7. 應用打包與分發

7.1 使用 ASAR 打包

ASAR 是 Electron 的歸檔格式，防止用戶直接修改代碼：

electron-packager ./app --asar

7.2 代碼簽名

確保應用在 Windows（Authenticode）、macOS（Developer ID）和 Linux（GPG）上簽名，防止篡改。

7.3 禁用開發者工具

生產環境應禁用?devTools：

win.webContents.on("devtools-opened", () => {win.webContents.closeDevTools();
});

8. 安全審計與測試

8.1 使用 Electronegativity

Electronegativity?是 Electron 安全審計工具：

npm install -g electronegativity
electronegativity -i /path/to/app

8.2 滲透測試

• 檢查 XSS、RCE（遠程代碼執行）、路徑遍歷等漏洞。

• 使用 Burp Suite 或 OWASP ZAP 測試網絡請求。

結論

Electron 提供了強大的跨平臺能力，但也帶來了安全挑戰。遵循本文的最佳實踐，如：

• 啟用上下文隔離和沙盒

• 實施嚴格的 CSP

• 保護主進程和 IPC 通信

• 安全存儲敏感數據

• 代碼簽名和 ASAR 打包

可以顯著降低安全風險，構建更可靠的桌面應用。建議開發者定期進行安全審計，并關注 Electron 的安全更新。

?