electron webcontents_inspectable webcontents_webcontents.executejavascript - 腾讯云开发者社区

有如下几种解决方法：使用@electron/remote模块替代使用IPC传递数据使用@electron/remote模块替代安装 npm install --save @electron/remote...const remote = require("@electron/remote/main") remote.initialize() //... remote.enable(mainWindow.webContents...require("@electron/remote") 实例 main.js const { app,BrowserWindow,ipcMain,shell} = require("electron")...() rtmpWindow.webContents.on('did-finish-load', () => { //下面的这行代码要在上面的BrowserWindow加载完成之后调用 rtmpWindow.webContents.send...('distributeIds',{ win2Id : win2.id }); win2.webContents.send('distributeIds',{ win1Id : win1

1.6K3 0

自己实现一个Electron跨进程消息组件（新书自荐）

我们知道开发Electron应用，难免要涉及到跨进程通信，以前Electron内置了remote模块，极大的简化了跨进程通信的开发工作，但这也带来了很多问题，具体的细节请参与我之前写的文章： https...://www.cnblogs.com/liulun/p/15217180.html Electron团队把remote模块拿掉之后，开发者就只能使用ipcRenderer，ipcMain，webContents..., ipcMain, webContents } = require('electron') 我们假定这个组件的类名为Eventer，我们在这个类的构造函数中，实例化了一个EventEmitter对象，...这里我们通过e.sender.id来判断消息是从哪个渲染进程发来的，当转发这个消息给其他webContents时，要排除掉那个发来消息的webContents。...对象，如果当前进程是主进程，则找到WebContents对象，并调用它的send方法发送消息；如果当前进程是渲染进程，则使用ipcRenderer的sendTo方法发送给目标WebContents对象。

1.2K2 1

您找到你想要的搜索结果了吗？

是的

没有找到

Electron入门教程3 ——进程通信

欢迎来到Electron入门教程的第三期教程，这一节非常重要！进程间通信(IPC)是在Electron中构建功能丰富的桌面应用程序的关键部分。...ipcMain.on('set-title', (event, title) => { const webContents = event.sender const win...= BrowserWindow.fromWebContents(webContents) win.setTitle(title) }) 每当消息通过set-title通道传入时...这是在Electron 7之前通过IPC进行异步双向通信的推荐方式。...消息需要通过主进程的WebContents实例发送到渲染进程。这个WebContents实例包含一个sent方法，可以像ipcReender .send那样使用它。

1.1K4 0

Electron 进程通信

上面说了渲染进程如何向主进程发送消息，但主进程也可以主动向渲染进程发送消息在主进程中，我们会创建一个 BrowserWindow 对象，这个对象有 webContents 属性。...当然 webContents 对象远不止这两个通信方法，具体可以看 webContents 下面是官方文档提供的使用 webContents 实现通信的例子： // In the main process...('did-finish-load', () => { win.webContents.send('ping', 'whoooooooh!')...}) 注意，webContents.on 监听的是已经定义好的事件，如上面的 did-finish-load。...因此，event.sender 发送的消息在主进程中还是需要通过 ipcMain.on 方法来监听，而不是通过 webContents.on 方法。 2.

1.5K1 0

Electron 应用奔溃问题排查与解决方法

相关 Bug 地址：https://github.com/electron/electron/issues/155381.2 设备访问权限Mac 下未做摄像头、麦克风授权，直接访问时，可能导致 Electron...2.2.1 开启 Electron Crash Reporter开起后，可以收集 Electron 应用的奔溃堆栈，Electron Crash Reporter 支持将奔溃堆栈上传到在线的第三方服务平台...主进程窗口加载完页面后，增加如下代码：mainWindow.webContents.on('did-finish-load', function(event){ mainWindow.webContents.send...console.warn('app:gpu-process-crashed', event, kill);});app.on('renderer-process-crashed', (event, webContents...', (event, webContents, details) => { console.warn('app:render-process-gone', event, webContents, details

9.3K2 0

Electron快速入门，聊聊跨进程通信那些事儿

') // 渲染进程打开开发者工具 remote.getCurrentWindow().webContents.openDevTools() 结论：通过 remote 模块，我们可以方便的访问主进程的模块...主进程TO渲染进程渲染进程是由主进程控制的，通过创建的渲染进程的窗口win.webContents对象，可以轻易地访问渲染进程相关内容。这里官网的相关事例说明相对完善，可以自行查看。...每个窗口 webContents.getProcessId() 或者 webContents.id 即可获得对应窗口的id。...伪代码如下： // win1窗口发送消息 ipcRenderer.sendTo(win2.webContents.id, 'send-msg', params1, params2) // win2...// 监听右键菜单触发 win.webContents.on('context-menu', (event, params) => { const selectEnabled = !!

1.7K2 0

electron开发客户端注意事项

窗口间通信的问题 electron窗口通信比nwjs要麻烦的多 electron分主进程和渲染进程，渲染进程又分主窗口的渲染进程和子窗口的渲染进程主窗口的渲染进程给子窗口的渲染进程发消息 subWin.webContents.on...('dom-ready', () => { subWin.webContents.send('message', { title: self....' ipcMain.on('articleRefreshMain', (event, message) => { mainWindow.webContents.send('contentRefreshRenderer...（就是electron的版本号）。...因为我用的electron-vue，他又两种模式，生产模式和开发模式在生产模式下没任何问题在开发模式下，它其实是起了一个webserver，让electron加载一个localhost的地址这样做主要是为了使用

2.2K4 0

Electron webview完全指南

一.webview标签 Electron提供了webview标签，用来嵌入Web页面： Display external web content in an isolated frame and process...实际上，这个问题与Electron关系不大，与Chromium有关 Chromium在设计上分为六个概念层： ?...as devtools P.S.当然，Electron的webContents与Chromium的webContents确实有紧密联系，但二者从概念上和实现上都是完全不同的，Chromium的webContents...明显是负责干活的，而Electron的webContents只是个EventEmitter，一方面把内部状态暴露出去（事件），另一方面提供接口允许从外部影响内部状态和行为（方法） Frame 除了webContents...十.Demo地址 GitHub仓库：ayqy/electron-webview-quick-start 一个简单的单tab浏览器，本文中提到的所有内容在Demo中都有涉及，注释详尽参考资料 Electron

7.3K3 1

Electron加载插件支持Flash

不显示菜单栏 const electron = require('electron') /*获取electron窗体的菜单栏*/ const Menu = electron.Menu /*隐藏electron...//mainWindow.webContents.openDevTools() } const ipcMain = require('electron').ipcMain let new_win; ipcMain.on...所以我们就要在主进程中做如下操作最外层 BrowserWindow 的 webContents 上监听 did-attach-webview 事件，获取新挂上去的的 webContents...｡使用获取到的 webContents 监听 will-navigate事件。...//mainWindow.webContents.openDevTools() addListener(mainWindow); } const ipcMain = require('electron

3.7K4 0

Electron启程

webContents 渲染以及控制 web 页面。 Renderer Process 模块 desktopCapturer 从桌面上捕获音频和视频的媒体源信息。...() rtmpWindow.webContents.on('did-finish-load', () => { //下面的这行代码要在上面的BrowserWindow加载完成之后调用 rtmpWindow.webContents.send...', 'ping') // 在主进程中 ipcMain.on('ping-event', (event, arg) => { yourWindow.webContents.send('pong-event...').remote.getGlobal('winIds').win1Id 第二种是：主进程创建事件，发送信息(不推荐) // 主进程中 win1.webContents.send('distributeIds...',{ win2Id : win2.id }); win2.webContents.send('distributeIds',{ win1Id : win1.id }); 页面数据共享

5.6K3 0

electron 模块BrowserWindow

const { app, BrowserWindow } = require('electron') app.on('ready', () => { // 创建一个宽800高600的窗口...const { app, BrowserWindow } = require('electron') app.on('ready', () => { // 创建一个窗口 const win...您可以根据 Electron 的文档详细了解每个事件的用法和触发时机。...webContents 返回窗口的 WebContents 对象，它提供了对窗口中加载的网页内容的控制和交互。 close() 关闭窗口。 destroy() 销毁窗口及其关联的资源。...webContents 属性当我们在 Electron 中创建一个窗口时，窗口中的网页内容由 WebContents 对象表示。

3791 0

electron 配置使用NodeJS API

从Electron 9中开始，官方已经计划移除 remote 模块，并且在Electron 14完成移除，引起目前我们默认情况下已经不能再使用该模块。...如果非要使用的话，可以手动安装该模块，步骤如下：安装 @electron/remote模块 npm i @electron/remote 在主进程中初始化@electron/remote/main app.on...(win.webContents) }) 在渲染进程中使用它 = 14.0.0，您必须使用新的enableAPI 为每个需要的WebContents单独启用远程模块：require("@electron/remote/main")....enable(webContents).

4171 0

Electron各版本API变更及版本升级报错汇总

It is replaced by the @electron/remote module. // Deprecated in Electron 12: const { app, dialog } =...window.require('electron').remote 替换方式安装依赖 npm install --save @electron/remote 主进程 // In the main process...: require('@electron/remote/main').initialize() //创建每一个窗口后，都要调用 require("@electron/remote/main").enable...(win.webContents); 渲染进程 // Replace with: const { app, dialog } = window.require('@electron/remote');...} = require('electron') remote.webContents.fromId(webview.getWebContentsId()) 错误汇总 require 引用时报错 const

1.8K2 0

开发笔记：基于Electon的图片采集工具

技术架构： Electron＋Nodejs 1 实现思路： 1.1 监听webview事件，注入js代码利用electron的webContents，监听需要获取图片的网页，当网页加载完成，促发‘dom-ready...主要用了这个api： webContents.executeJavaScript(code[,userGesture,callback]) 如： win.webContents.on('dom-ready...', () => { win.webContents.executeJavaScript(code[,userGesture,callback]) })； 1.2 遍历HTML中的图片URL 这里要注意...往webview中注入的代码可以通过return返回，也可以通过在注入代码中写入： electron.remote.getGlobal(‘webWin').webContents.send('autoChat...的加密由于electron打包后的程序都是直接暴露源代码的，就在resources文件夹里的app文件夹。

1.2K12 0

electron 运行 dist 文件

本文，我们来讲讲如何通过 electron 运行打包文件。...我们将其放在新建 electron 项目根目录下，以备后用。新建 electron 项目我们根据创建您的第一个 electron 应用程序就可以很轻松的创建 electron 应用。...{ label: '返回', click: () => { if (mainWindow && mainWindow.webContents.canGoBack...()) { mainWindow.webContents.goBack(); } } }, {...{ label: '控制台', click: () => { BrowserWindow.getFocusedWindow().webContents.openDevTools

5422 0

electron 自动更新以及手动更新

从搭建开始使用的是electron-vue 毕竟方便一点如果只想安装electron 请参见我的另一个文章 https://segmentfault.com/a/11......首先安装Electron: vue init simulatedgreg/electron-vue project1 cd project1 npm install //第一次安装的伙伴需要访问外国网站...安装的时候安装了 vue electron vue-router 不安装 vuex 打包选择的是: electron-builder 下次有时间再扯electron-packager...' // 注意这个autoUpdater不是electron中的autoUpdater import {autoUpdater} from "electron-updater" /** * Set...更新下载进度事件 autoUpdater.on('download-progress', function (progressObj) { mainWindow.webContents.send

2.7K6 0

electron开发技术知识点笔记

if(BrowserWindow.getAllWindows().length === 0) { createWindow(); }});webContents 事件// 控制右键操作wc.on...editMenu'}]);// 控制右键操作 wc.on('context-menu', (e, params) => { // 显示 });程序崩溃处理 const wc = mainWindow.webContents...download>Download Image// 下载资源session.defaultSession.on('will-download', (e, downloadItem, webContents...) .then(() => { console.log('cookie1 set'); getCookies(); }); mainWindow.webContents.on...electron.powerMonitor.on('resume', e => { if(!

1.5K5 0

基于ElectronEgg&Python，从零开始打造一款免费的PDF桌面工具

前端ElectronEgg 前端GUI页面主要使用 Electron + Vue3 实现，前端和后端的通信主要使用 Node 中的 child_process 实现，前端页面的通信使用 IPC 实现。...主要使用技术有： • nodejs • electron • vue • vue-router • pinia • naiveui • python • pymupdf • nuitkia 打包工具 IPC...默认情况下，渲染器进程没有权限访问 Node.js 和 Electron 模块。作为应用开发者，您需要使用 contextBridge API 来选择要从预加载脚本中暴露哪些 API。...此 WebContents 实例包含一个 send方法，其使用方式与 ipcRenderer.send 相同。...1、在主线程中通过 mainWindow.webContents.send 发送事件 // 发送主进程的错误信息给渲染进程 mainWindow.webContents.send(IPC_EVENT.EVENT_PROCESS_ERROR

6211 0

18.7.5日报

DDS_videoPlayer")会崩溃的问题 * 增加const utf8* wkeGetUserAgent(wkeWebView webView);接口 * 跟进百度百科选中图片会白屏的问题 * 修复electron...模式的WebContents.prototype.loadFile问题，以及增加了WebContents的几个api * 增加electron的loadFile

3392 0

一文搞懂Electron的四种视图容器和它们之间的IPC通信机制

Webcontents，它相当于一个独立的渲染上下文，在Chrome里，每增加一个tab就会创建一个独立的WebContents，它们可以加载各自不同的url，彼此互相独立。...在Electron里，当我们创建一个基础窗口对象，就能够通过它的引用拿到WebContents。...此外，Electron还给每个webcontents对象提供了一个上下文隔离（Isolated Context）的预加载环境，并且在其中执行开发者指定的preload脚本。...在Electron里，iframe没有webContents，而是以宿主页面contents下面的一个frame的形式存在。1....注意，Electron里的tag是基于chrome app的标准开发的，由于后者已经被Chrome抛弃，所以Electron开发者也无法保证后续版本的可用性。

9.5K7 5

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

Electron中remote模块的替代方案

自己实现一个Electron跨进程消息组件（新书自荐）

Electron入门教程3 ——进程通信

Electron 进程通信

Electron 应用奔溃问题排查与解决方法

Electron快速入门，聊聊跨进程通信那些事儿

electron开发客户端注意事项

Electron webview完全指南

Electron加载插件支持Flash

Electron启程

electron 模块BrowserWindow

electron 配置使用NodeJS API

Electron各版本API变更及版本升级报错汇总

开发笔记：基于Electon的图片采集工具

electron 运行 dist 文件

electron 自动更新以及手动更新

electron开发技术知识点笔记

基于ElectronEgg&Python，从零开始打造一款免费的PDF桌面工具

18.7.5日报

一文搞懂Electron的四种视图容器和它们之间的IPC通信机制

扫码

相关资讯

热门标签

活动推荐

运营活动

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐