gpt4 book ai didi

javascript - 将数据从 main 传递到渲染器 (electron-js)

转载 作者:行者123 更新时间:2023-12-01 22:56:30 34 4
gpt4 key购买 nike

我正在摆弄 Electron 。在我的应用程序中,我有一个 Javascript 对象,其中包含我的应用程序的所有设置。这个对象有一个名为“渲染器”的键,我想将其传递给渲染窗口,以便将所有设置保存在一个方便的地方。

我一直在查看文档,发现的最佳方法如下(除了通过 BrowserWindow 的附加参数通过 process.argv 传递变量之外)。

在 main.js 中:

ipcMain.handle('getSettings', () => {
return settings.renderer
})

预加载.js

contextBridge.exposeInMainWorld('bridge', {
getSettings: () => ipcRenderer.invoke('getSettings')
})

渲染器.js

    function getSettings() {
settings = window.bridge.getSettings().then(response => {
console.log(response)
})
}

getSettings()

有没有更方便的方法来完成这个,在那个方面,这是否有可能以同步方式完成?

最佳答案

创建并加载窗口后,您可以立即将设置对象发送到渲染进程IPC。


main.js(主进程)

// Import required electron modules
const electronApp = require('electron').app;
const electronBrowserWindow = require('electron').BrowserWindow;

// Import required Node modules
const nodePath = require('path');

// Prevent garbage collection
let window;

// Settings object
let settings = {
'renderer': {
'key1': 'value1',
'key2': 'value2'
}
}

function createWindow() {
const window = new electronBrowserWindow({
x: 0,
y: 0,
width: 800,
height: 600,
show: false,
webPreferences: {
nodeIntegration: false,
contextIsolation: true,
preload: nodePath.join(__dirname, 'preload.js')
}
});

window.loadFile('index.html')
.then(() => { window.webContents.send('sendSettings', settings.renderer); })
.then(() => { window.show(); });

return window;
}

electronApp.on('ready', () => {
window = createWindow();
});

electronApp.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
electronApp.quit();
}
});

electronApp.on('activate', () => {
if (electronBrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});

preload.js(主进程)

// Import the necessary Electron modules
const contextBridge = require('electron').contextBridge;
const ipcRenderer = require('electron').ipcRenderer;

// Exposed protected methods in the render process
contextBridge.exposeInMainWorld(
// Allowed 'ipcRenderer' methods
'bridge', {
// From main to render
sendSettings: (message) => {
ipcRenderer.on('sendSettings', message);
}
}
);

index.html(渲染过程)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Electron Test</title>
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';"/>
</head>

<body>
<p>See Developer Tools -> Console</p>
</body>

<script>
window.bridge.sendSettings((event, settings) => {
console.log(settings);
});
</script>
</html>

关于javascript - 将数据从 main 传递到渲染器 (electron-js),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/73128159/

34 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com