当前位置：首页 > news >正文

【Electron入门】进程环境和隔离

news 来源：原创 2025/9/12 20:26:28

一、主进程和渲染进程

1、主进程（main）

2、渲染进程（renderer）

二、预加载脚本

三、沙盒化

为单个进程禁用沙盒

全局启用沙盒

四、环境访问权限控制：contextIsolation和nodeIntegration

1、contextIsolation

🌰启用contextIsolation：true时（默认推荐做法）

🌰不启用contextIsolation：false时

2、nodeIntegration

🌰 如果启用nodeIntegration: true（不推荐）

🌰如果不启用，我们应该如何借助Node.js的功能呢？

Electron可以简单理解为一个桌面应用程序的“壳”，内里还是遵循浏览器的行为，加载网页进行渲染（可以是本地、也可以是远程网页）

一、主进程和渲染进程

Electron的架构其实类似现代浏览器，为了管理应用程序窗口中不同的页面，每个标签页在自己的进程中渲染，从而限制了一个网页上的有误或恶意代码可能导致的对整个应用程序造成的伤害。

在Electron中，我们可控制的两类进程为：主进程 和 渲染进程。

1、主进程（main）

1️⃣ 运行环境：node.js，具有 require 模块和使用所有 Node.js API

2️⃣ 职责：

窗口管理：创建 / 销毁窗口实例BrowserWindow，其相当于一个小的EventEmitter，窗口将在单独的渲染器进程中加载一个网页。窗口中的webContents 代表的是 渲染进程 内部的网页内容（Web 页面），可以执行向渲染进程通信、网页内容生命周期监听、访问/控制devtools等

// main.js
const { BrowserWindow } = require('electron')const win = new BrowserWindow({ width: 800, height: 1500 })
win.loadURL('https://github.com')const contents = win.webContents
console.log(contents)

应用程序的生命周期：监听app生命周期、做相应处理

// quitting the app when no windows are open on non-macOS platforms
app.on('window-all-closed', () => {if (process.platform !== 'darwin') app.quit()
})

调用api与操作系统交互：Electron 有着多种控制原生桌面功能的模块，例如菜单、对话框以及托盘图标。下面举个例子🌰，创建应用菜单！

const { app, Menu, BrowserWindow } = require('electron');app.whenReady().then(() => {const win = new BrowserWindow({width: 800,height: 600,webPreferences: {nodeIntegration: true}});win.loadURL('https://example.com');// 创建菜单templateconst menuTemplate = [{label: '文件',submenu: [{ label: '打开文件', click: () => console.log('打开文件') },{ type: 'separator' }, // 分割线{ label: '退出', role: 'quit' }]},{label: '编辑',submenu: [{ label: '撤销', role: 'undo' },{ label: '重做', role: 'redo' },{ type: 'separator' },{ label: '剪切', role: 'cut' },{ label: '复制', role: 'copy' },{ label: '粘贴', role: 'paste' }]}];// 设置应用菜单const menu = Menu.buildFromTemplate(menuTemplate); //从模版设置菜单实例Menu.setApplicationMenu(menu);  // 放入应用菜单
});

2、渲染进程（renderer）

1️⃣ 运行环境：渲染器负责渲染网页内容。所以实际上，运行于渲染器进程中的代码是须遵照网页web标准的。

二、预加载脚本

由于主进程和渲染进程的运行环境完全不同，且默认情况下，二者无权直接访问互相之间的环境。

所以出现了预加载脚本preload.js作为环境桥梁，它包含了那些执行于渲染器进程中，且先于网页内容开始加载的代码，与浏览器共享一个全局window接口 。这些脚本虽运行于渲染器的环境中，却因能访问 Node.js API 而拥有了更多的权限。

preload.js可以部分暴露一些api给对方进程、可以作为通信中转站等等。

三、沙盒化

当 Electron 中的渲染进程被沙盒化时，它们的行为与常规 Chrome 渲染器一样。一个沙盒化的渲染器不会有一个 Node.js 环境。

附属于沙盒化的渲染进程的 preload 脚本中仍可使用一部分以 Polyfill 形式实现的 Node.js API。

为单个进程禁用沙盒

app.whenReady().then(() => {const win = new BrowserWindow({webPreferences: {sandbox: false}})win.loadURL('https://google.com')
})

全局启用沙盒

app.enableSandbox ：注意，此 API 必须在应用的 ready 事件之前调用

app.enableSandbox()
app.whenReady().then(() => }// 因为调用了app.enableSandbox()，所以任何sandbox:false的调用都会被覆盖。const win = new BrowserWindow()win.loadURL('https://google.com')
})

四、环境访问权限控制：contextIsolation和nodeIntegration

在创建一个browserWindow实例的时候，会配置webPreferences中的字段。

其中有两个字段与渲染进程的访问权限密切相关：contextIsolation 和 nodeIntegration

1、contextIsolation

控制 window 对象是否在独立的 JavaScript 上下文中运行。
默认值：true
如果为true,代表渲染进程在独立的js上下文中。因此preload.js、第三方库都不能直接修改渲染进程中的window全局对象；如果为false，preload.js可以直接通过修改window属性传递值

那么不同设置下，如何借助预加载脚本让主进程与渲染进程通信呢？

🌰启用contextIsolation：true时（默认推荐做法）

main.js

const { BrowserWindow } = require('electron');
const win = new BrowserWindow({webPreferences: {contextIsolation: true,  // 开启上下文隔离preload: 'preload.js'}
});

preload.js：利用exposeInMainWorld将属性挂在window对象中

const { contextBridge } = require('electron');contextBridge.exposeInMainWorld('myAPI', {sayHello: () => console.log('Hello!')
});

renderer.js

console.log(window.myAPI.sayHello()); // ✅ "Hello!"

🌰不启用contextIsolation：false时

preload.js：可直接篡改window对象

window.myApi= {sayHello: () => console.log('Hello!')
};

2、nodeIntegration

控制是否可以在渲染进程中直接使用Node.js API（如fs、path、require等语法和api)
默认值：false，无法直接使用node环境

🌰 如果启用nodeIntegration: true（不推荐）

渲染进程中的js文件

// 渲染进程 index.html
<script>const fs = require('fs');fs.writeFileSync('test.txt', 'Hello, Electron!');
</script>

🌰如果不启用，我们应该如何借助Node.js的功能呢？

通过【预加载脚本】执行ipcRenderer通信，发送至主进程处理

preload.js

// preload.js
const { contextBridge, ipcRenderer } = require('electron');contextBridge.exposeInMainWorld('electronAPI', {sendTitle: (title) => ipcRenderer.send('set-title', title),readFile : (filePath) => ipcRenderer.invoke('read-file', filePath)
});

main.js的利用ipcMain接受处理函数

const { app, BrowserWindow, ipcMain } = require('electron/main')
const path = require('node:path')
const fs = require('fs').promises;function createWindow () {const mainWindow = new BrowserWindow({webPreferences: {preload: path.join(__dirname, 'preload.js')}})// send 'sendTitle'方法的接收器ipcMain.on('set-title', (event, title) => {//通过event.sender获取网页内容对象const webContents = event.sender// fromWebContents解析const win = BrowserWindow.fromWebContents(webContents)win.setTitle(title)})// invoke 'readFile'方法的处理器ipcMain.handle('read-file', async (_, filePath) => {try {const data = await fs.readFile(filePath, 'utf-8');return { success: true, data };} catch (error) {return { success: false, error: error.message };}});mainWindow.loadFile('index.html')
}app.whenReady().then(() => {createWindow()app.on('activate', function () {if (BrowserWindow.getAllWindows().length === 0) createWindow()})
})app.on('window-all-closed', function () {if (process.platform !== 'darwin') app.quit()
})

⚠️注意：send + on和invoke + handle两种通信方法的区别

send + on：单向通信，单向发送->单边处理

invoke + handle ：双向通信，发送者发送信息 -> 接收者理后可return一个返回值 -> 发送者接收到返回值的Promise对象，可针对返回值再处理

🌟推荐实践：

启用 sandbox: true（沙箱模式）进一步增强安全性

const win = new BrowserWindow({webPreferences: {contextIsolation: true, （默认，无需特别设置）nodeIntegration: false,（默认，无需特别设置）preload: 'preload.js',sandbox: true}
});

【Electron入门】进程环境和隔离

目录一、主进程和渲染进程 1、主进程（main） 2、渲染进程（renderer） 二、预加载脚本三、沙盒化为单个进程禁用沙盒全局启用沙盒四、环境访问权限控制：contextIsolation和nodeIntegration 1、contextIsola…...

编程日记 2025/9/12 20:26:28

拉链表介绍

拉链表是处理缓慢变化维（SCD） 的一种常用方法，特别适用于需要保留历史记录的场景。以下是拉链表的详细说明及实现方法： 1. 什么是拉链表？ 拉链表是一种用于记录维度数据历史变化的表结构，通过开始时间 …...

编程日记 2025/9/9 9:55:55

Spring Boot 日志配置与常见问题解析（详解）

目录 Spring Boot 日志配置与常见问题解析引言什么是日志？日志的重要性日志使用打印日志日志框架介绍日志格式的说明⽇志级别日志级别的分类日志级别的使用 Spring Boot 日志配置1. 设置日志级别和格式2. 配置日志收集器3. 查看和分析日志4.日志的持久化5.设置日志…...

编程日记 2025/9/6 19:57:07

-bash: lsof: command not found

一、问题说明执行如下命令时报错： # lsof |grep deleted > deleted_file -bash: lsof: command not found二、处理方法 # yum -y install lsof安装完成后可成功执行上面的命令。...

编程日记 2025/9/11 15:28:48

PC 端连接安卓手机恢复各类数据：安装、操作步骤与实用指南

软件介绍这款用于恢复安卓手机数据的软件，虽运行在 PC 端，却专为安卓手机数据恢复打造，使用时得用数据线把手机和电脑连接起来。它的功能相当强大，能帮你找回安卓手机里已删除的短信、联系人、通话记录、文档，还有照…...

编程日记 2025/9/11 19:03:43

ES、OAS、ERP、电子政务、企业信息化（高软35）

系列文章目录 ES、OAS、ERP、电子政务、企业信息化文章目录系列文章目录前言一、专家系统（ES）二、办公自动化系统（OAS）三、企业资源规划（ERP）四、典型信息系统架构模型1.政府信息化和电子政务2.企业信息…...

编程日记 2025/9/12 20:19:32

android智能指针android::sp使用介绍

android::sp 是 Android 中的智能指针（Smart Pointer）的实现，用于管理对象的生命周期，避免手动管理内存泄漏等问题。它是 Android libutils 库中重要的一部分，常用于管理继承自 android::RefBase 的对象。与标准库中…...

编程日记 2025/9/4 17:30:48

DeepSeek05-大模型WebUI

一、说明： 将DeepSeek部署到前台Web界面的方法主要有以下几种推荐方案，涵盖开源工具、第三方客户端及特定场景适配方案： Open WebUIChatbox AICherry StudioSillyTavern 二、Open WebUI 安装配置教程特点：Open WebUI 是一个开…...

编程日记 2025/9/12 9:15:34

自然语言处理NLP入门 -- 第八节OpenAI GPT 在 NLP 任务中的应用

在前面的学习中，我们已经了解了如何使用一些经典的方法和模型来处理自然语言任务，如文本分类、命名实体识别等。但当我们需要更强的语言生成能力时，往往会求助于更先进的预训练语言模型。OpenAI 旗下的 GPT 系列模型（如 GPT-3、GP…...

编程日记 2025/9/9 3:54:41

FFmpeg av_read_frame 和iOS系统提供的 AVAudioRecorder 实现音频录制的区别

1. 第一种方式：使用 FFmpeg 的 av_read_frame 特点底层实现：基于 FFmpeg，这是一个强大的多媒体处理库，直接操作音频流。灵活性：非常灵活，可以处理多种音频格式、编解码器和输入设备。复杂性：需要手动管理音频流、数据包（AVPacket）、内存释放等，代码复杂度较高。跨平…...

编程日记 2025/9/11 6:58:40

【区块链】深入理解区块链中的 Gas 机制

🌈个人主页: 鑫宝Code 🔥热门专栏: 闲话杂谈｜ 炫酷HTML | JavaScript基础 💫个人格言: "如无必要，勿增实体" 文章目录深入理解区块链中的 Gas 机制一、Gas 的基本概念1.1 为什么需要 Gas&#xff1f…...

编程日记 2025/9/10 21:07:48

Section I Use of English（完型填空） 原题 Directions：Read the following text. Choose the best word (s) for each numbered blank and mark A, B, C or D on the ANSWER SHEET. (10 points) Even if families are less likely to si…...

编程日记 2025/9/10 9:51:12

mamba_ssm和causal-conv1d详细安装教程

1.前言 Mamba是近年来在深度学习领域出现的一种新型结构，特别是在处理长序列数据方面表现优异。在本文中，我将介绍如何在 Linux 系统上安装并配置 mamba_ssm 虚拟环境。由于官方指定mamba_ssm适用于 PyTorch 版本高于 1.12 且 CUDA 版本大于 11.6 的环境…...

编程日记 2025/9/11 1:25:41

leetcode-442.数组中重复的数据

leetcode-442.数组中重复的数据文章目录 leetcode-442.数组中重复的数据1.题目描述：数组中重复的数据2.第一次代码提交：(不符合仅使用常量额外空间)3.最终代码提交：只使用常数额外空间、时间复杂度为 O(n) 的做法，即“标记法” 1…...

编程日记 2025/9/11 13:22:55

UniApp 按钮组件 open-type 属性详解：功能、场景与平台差异

文章目录引言一、open-type 基础概念1.1 核心作用1.2 通用使用模板二、主流 open-type 值详解2.1 contact - 客服会话功能说明平台支持代码示例 2.2 share - 内容转发功能说明平台支持注意事项 2.3 getUserInfo - 获取用户信息功能说明平台支持代码示例 2.4 getPhoneNumber -…...

编程日记 2025/9/10 1:41:21

Android13修改多媒体默认音量

干就完了! 设置音量为最大音量,修改如下: /framework/base/media/java/android/media/AudioSystem.java/** hide */public static int[] DEFAULT_STREAM_VOLUME new int[] {4, // STREAM_VOICE_CALL7, // STREAM_SYSTEM5, // STREAM_RING-5, // STREAM_MUSIC15, // STREAM…...

编程日记 2025/9/8 21:19:38

【银河麒麟高级服务器操作系统】服务器测试业务耗时问题分析及处理全流程分享

更多银河麒麟操作系统产品及技术讨论，欢迎加入银河麒麟操作系统官方论坛 https://forum.kylinos.cn 了解更多银河麒麟操作系统全新产品，请点击访问麒麟软件产品专区：https://product.kylinos.cn 开发者专区：https://developer…...

编程日记 2025/8/26 11:52:01

HTTP 请求时传递多部分表单数据

HTTP 请求时传递多部分表单数据（multipart/form-data） --data-raw $------demo11111\r\nContent-Disposition: form-data; name"Filedata"; filename"截屏2025-02-27 15.45.46.png"\r\nContent-Type: image/png\r\n\r\n\r\n------d…...

编程日记 2025/9/8 12:44:13

【Python环境】配置极简描述

241220 241220 241220 Python环境配置下载Python 稳定版本：Stable Releases【3.12.3】下载地址：Python Releases for Windows | Python.org. 配环境注意勾上Add Python 3.x to PATH，然后点“Install Now”即可完成安装。配置完成&…...

编程日记 2025/9/4 17:57:34

1. HTTP 数据请求

相关资源： 图片素材📎图片素材.zip 接口文档 1. HTTP 数据请求什么是HTTP数据请求： (鸿蒙)应用软件可以通过(鸿蒙)系统内置的 http 模块和 Axios，通过 HTTP 协议和服务器进行通讯学习核心Http请求技术: Http模块 - 属于鸿…...

编程日记 2025/9/9 11:55:01

基于深度学习+NLP豆瓣电影数据爬虫可视化推荐系统

博主介绍：资深开发工程师，从事互联网行业多年，熟悉各种主流语言，精通java、python、php、爬虫、web开发，已经做了多年的设计程序开发，开发过上千套设计程序，没有什么华丽的语言，只有…...

编程日记 2025/9/9 19:07:35

Apache Spark中的依赖关系与任务调度机制解析

Apache Spark中的依赖关系与任务调度机制解析在Spark的分布式计算框架中，RDD（弹性分布式数据集）的依赖关系是理解任务调度、性能优化及容错机制的关键。宽依赖（Wide Dependency）与窄依赖（Narrow Dependency）作为两种核心依赖类型，直接影响Stage划分、Shuffle操作及容…...

编程日记 2025/9/10 5:32:57

SEO炼金术（4）| Next.js SEO 全攻略

在上一篇文章 SEO炼金术（3）| 深入解析 SEO 关键要素中，我们深入解析了 SEO 关键要素，包括 meta 标签、robots.txt、canonical、sitemap.xml 和 hreflang，并探讨了它们在搜索引擎优化（SEO）中的作…...

编程日记 2025/9/9 13:49:26

DeepSeek开源周，第五弹再次来袭，3FS

Fire-Flyer 文件系统（3FS）总结： 一、核心特点 3FS 是一个专为 AI 训练和推理工作负载设计的高性能分布式文件系统，利用现代 SSD 和 RDMA 网络，提供共享存储层，简化分布式应用开发。其主要特点包括&#xf…...

编程日记 2025/9/8 6:17:46

conda怎么迁移之前下载的环境包，把python从3.9升级到3.10

克隆旧环境（保留旧环境作为备份） conda create -n cloned_env --clone old_env 在克隆环境中直接升级 Python conda activate cloned_env conda install python3.10 升级 Python 后出现所有包导入失败的问题，通常是因为依赖包与新 Pyth…...

编程日记 2025/9/11 3:11:33

一周一个Unity小游戏2D反弹球游戏 - 移动的弹板（鼠标版）

前言本文将实现控制弹板移动，通过Unity的New Input System，可以支持鼠标移动弹板跟随移动，触控点击跟随移动，并且当弹板移动到边界时，弹板不会移动超过边界之外。创建移动相关的InputAction 项目模版创建的时候默认会…...

编程日记 2025/9/12 20:15:04

wordpress子分类调用父分类名称和链接的3种方法

专为导航而生，在wordpress模板制作过程中常常会在做breadcrumbs导航时会用到，子分类调用父分类的名称和链接，下面这段简洁的代码，可以完美解决这个问题。 <?php echo get_category_parents( $cat, true, » ); ?…...

编程日记 2025/9/9 16:41:48

使用mermaid查看cursor程序生成的流程图

一、得到cursor生成的流程图文本 cursor写的程序正常运行后，在对话框输入框中输入诸如“请生成扫雷的代码流程图”，然后cursor就把流程图给生成了，但是看到的还是文本的样子，保留这部分内容待用二、注册一个Mermaid绘图账号 …...

编程日记 2025/9/8 20:27:41

GC垃圾回收介绍及GC算法详解

目录引言 GC的作用域什么是垃圾回收？ 常见的GC算法 1.引用计数法 2.复制算法 3.标记清除 4.标记整理小总结 5.分代收集算法 ps:可达性分析算法？ 可达性分析的作用可达性分析与垃圾回收算法的关系结论引言在编程世界中，…...

编程日记 2025/9/9 1:12:07

设计后端返回给前端的返回体

目录 1、为什么要设计返回体？ 2、返回体包含哪些内容（如何设计）？ 举例 3、总结 1、为什么要设计返回体？ 在设计后端返回给前端的返回体时，通常需要遵循一定的规范，以确保前后端交互的清晰性…...

编程日记 2025/9/8 20:14:41

Pytorch为什么 nn.CrossEntropyLoss = LogSoftmax + nn.NLLLoss？

为什么 nn.CrossEntropyLoss LogSoftmax nn.NLLLoss？ 在使用 PyTorch 时，我们经常听说 nn.CrossEntropyLoss 是 LogSoftmax 和 nn.NLLLoss 的组合。这句话听起来简单，但背后到底是怎么回事？为什么这两个分开的功能加起来就等于…...

编程日记 2025/9/9 11:42:18

Linux实操——在服务器上直接从百度网盘下载（/上传）文件

Linux Linux实操——在服务器上直接从百度网盘下载（/上传）文件文章目录 Linux前言一、下载并安装bypy工具二、认证并授权网盘账号三、将所需文件转移至目的文件夹下四、下载文件五、上传文件六、更换绑定的百度云盘账户前言最近收到一批很大的数据&…...

编程日记 2025/9/7 9:39:47

【无标题】ABP更换MySql数据库

原因：ABP默认使用的数据库是sqlServer，本地没有安装sqlServer，安装的是mysql，需要更换数据库 ABP版本：9.0 此处以官网TodoApp项目为例打开EntityFrameworkCore程序集，可以看到默认使用的是sqlServer&…...

编程日记 2025/9/12 1:26:21

nuxt常用组件库html-validator应用解析

html-validator 主要用于自动验证nuxt服务器呈现的HTML(SSR和SSG)，以检测可能导致水合错误的HTML常见问题，有助于减少水合错误，检测常见的可访问性错误。安装 npx nuxilatest module add html-validator配置若自动更新nuxt.config.ts配置文…...

编程日记 2025/9/8 11:34:46

思维训练（算法+技巧）

1.深度优先搜索：暴力求解，适合判断能不能走出迷宫利用递归，有一个check【】数组来检查该节点是否经过 for循环该节点的邻接节点（存在且没被访问），递归DFS（该节点的某个邻接节点） D…...

编程日记 2025/9/9 11:21:38

AIGC（生成式AI）试用 25 -- 跟着清华教程学习 - DeepSeek+DeepResearch让科研像聊天一样简单

目标：继续学习，以DeepSeek为主个人理解： - 模型结合，充分发挥各模型的优势 - 关注应用，弱化理论，了解就好 - 多模态：多模态（Multimodality）是指结合多种不同类型的数据…...

编程日记 2025/9/10 11:44:08

Solr中得Core和Collection的作用和关系

Solr中得Core和Collection的作用和关系一， 总结在Apache Solr中，Core和Collection 是两个核心概念，他们分别用于单机模式和分布式模式（SolrCloud）中，用于管理和组织数据。二，Core 定义&am…...

编程日记 2025/9/9 4:24:12

温湿度监控设备融入智慧物联网

当医院的温湿度监控设备融入智慧物联网，将会带来许多新的体验，可以帮助医院温湿度监控设备智能化管理，实现设备之间的互联互通，方便医院对温湿度数据进行统一管理和分析。添加智慧物联网技术，实现对医院温湿度的实时…...

编程日记 2025/8/26 12:08:02

软件测试的七大误区

随着软件测试对提高软件质量重要性的不断提高，软件测试也不断受到重视。但是，国内软件测试过程的不规范，重视开发和轻视测试的现象依旧存在。因此，对于软件测试的重要性、测试方法和测试过程等方面都存在很多不恰当的认识&#xf…...

编程日记 2025/9/9 5:46:24

Mac 版本地部署deepseek ➕ RAGflow 知识库搭建流程分享（附问题解决方法）

安装： 1、首先按照此视频的流程一步一步进行安装：(macos版）ragflowdeepseek 私域知识库搭建流程分享_哔哩哔哩_bilibili 2、RAGflow 官网文档指南：https://ragflow.io 3、RAGflow 下载地址：https://github.com/infi…...

编程日记 2025/9/8 5:02:13