electron进程通信

博丽七七2024-05-28 21:48

1.渲染进程对主进程通信

主进程

javascript 复制代码

ipcMain.on("saveFile" , ()=>{
    console.log(1)
})
//对外暴露api

预加载脚本

javascript 复制代码

//主进程和渲染进程的桥梁
const { ipcRenderer, contextBridge } = require('electron')

contextBridge.exposeInMainWorld("api" , {    //对外暴露api
    hd: () => {
        ipcRenderer.send("saveFile")
        //调用主进程api
    }
})

渲染进程

javascript 复制代码

window.addEventListener("DOMContentLoaded" , ()=>{
    window.api.hd()
})

2.主进程对渲染进程通信

主进程

javascript 复制代码

win.webContents.send("test" , 1)
//win为起作用的页面

预加载脚本

javascript 复制代码

contextBridge.exposeInMainWorld("api" , {
    counter:( callback )=>{
        ipcRenderer.on("test",(event, value)=>{
            callback(value)
        })
    }
})

渲染进程

javascript 复制代码

window.api.counter((value)=>{
    btn.innerHTML = value
})

3.invoke,handle双向通信

主进程使用handle暴露

预加载脚本使用invoke获取

这样连接的api主进程的return会直接渲染到前端控制台