外国的html 素材网站,学技术的培训机构,网站营销管理培训班,网站建设网站网页模板文章目录 渲染进程到主进程#xff08;单向#xff09;渲染进程到主进程#xff08;双向#xff09;主进程到渲染进程 #xff08;单向#xff0c;可模拟双向#xff09; 渲染进程到主进程#xff08;单向#xff09;
send #xff08;render 发送#xff09;on 单向渲染进程到主进程双向主进程到渲染进程 单向可模拟双向 渲染进程到主进程单向
send render 发送on main 监听
// main.js 主要代码// electron/main includes types for all main process modules.
const { app, ipcMain } require(electron/main)
app.whenReady().then((){// 需要在 HTML 文件加载之前监听保证从渲染器调用之前处理程序能够准备就绪。ipcMain.on(set-title, (event, title) {const webContents event.senderconst win BrowserWindow.fromWebContents(webContents)win.setTitle(title)})createWindow(); // 创建窗口
})// preload.js // electron/renderer includes types for all renderer process modules.
const { contextBridge, ipcRenderer } require(electron/renderer)
contextBridge.exposeInMainWorld(electronAPI, (){setTitle: (title) ipcRenderer.send(set-title,title)
})// renderer.js// 插入html中的js, 运行于渲染程序中
const setButton document.getElementById(btn)
const titleInput document.getElementById(title)
setButton.addEventListener(click, () {const title titleInput.valuewindow.electronAPI.setTitle(title)
})渲染进程到主进程双向
invokerender 发送handlemain 监听
const { app, ipcMain, dialog } require(electron/main)
app.whenReady().then((){// 需要在 HTML 文件加载之前监听保证从渲染器调用之前处理程序能够准备就绪。// IPC 通道名称上的 dialog: 前缀对代码没有影响。 它仅用作命名空间以帮助提高代码的可读性。ipcMain.handle(dialog:openFile, async () {const { canceled, filePaths } await dialog.showOpenDialog()if(!canceled) return filePaths[0]})createWindow(); // 创建窗口
})// preload.js // electron/renderer includes types for all renderer process modules.
const { contextBridge, ipcRenderer } require(electron/renderer)
contextBridge.exposeInMainWorld(electronAPI, (){openFile: () ipcRenderer.invoke(dialog:openFile)
})// renderer.js// 插入html中的js, 运行于渲染程序中
const setButton document.getElementById(btn)
const filePath document.getElementById(filePath)
setButton.addEventListener(click, async () {const path await window.electronAPI.openFile()filePath.innerText path
})主进程到渲染进程 单向可模拟双向
send on
// main.jsconst { app, BrowserWindow, Menu, ipcMain } require(electron/main)
const path require(node:path)function createWindow () {const mainWindow new BrowserWindow({webPreferences: {preload: path.join(__dirname, preload.js)}})const menu Menu.buildFromTemplate([{label: app.name,submenu: [{// 使用 webContents.send API 将 IPC 消息从主进程发送到目标渲染器。// 其使用方式与 ipcRenderer.send 相同。click: () mainWindow.webContents.send(update-counter, 1),label: Increment},{click: () mainWindow.webContents.send(update-counter, -1),label: Decrement}]}])Menu.setApplicationMenu(menu)mainWindow.loadFile(index.html)
}app.whenReady().then(() {// 模拟双向通信接收渲染进程发送的数据update-counter 触发ipcMain.on(counter-value, (_event, value) {console.log(value) })createWindow()
})// preload.jsconst { contextBridge, ipcRenderer } require(electron/renderer)
contextBridge.exposeInMainWorld(electronAPI, {onUpdateCounter: (callback) ipcRenderer.on(update-counter, (event,value) callback(value)),sendCount: (value) ipcRender.send(counter-value, value)
})// render.js
const count document.getElementById(count)
window.electronAPI.onUpdateCounter((value){const newValue Number(count.innerText) value;count.innerText newValue.toString();window.electronAPI.sendCount(newValue)
})
