I have been struggling with Inter-Process Communication (IPC) for 5 days. (Also dealing with COVID too)
Finally, I have understood how to use methods such as 'ipcRenderer.invoke' and 'ipcMain.handle' a bit.
However, there are still many things to learn.
What I did
- Googling about ipcMain.on and event.reply
I couldn't understand event.reply even after using chat-GPT. I referred to the following article and used .invoke and .handle instead.
- Copying and pasting tutorial code and modifying it
And here is what I made:
// main.js console.log("Main process working"); console.log("main.js"); "use strict" const { app, BrowserWindow, ipcMain, dialog} = require('electron'); const path = require('path'); const url = require('url'); let win; function createWindow() { const mainWindow = new BrowserWindow({ width: 400, height: 300, title: 'IPC App', webPreferences: { nodeIntegration: true, contextIsolation: false, } }); ipcMain.handle('open-dialog', async (_e, _arg) => { return "hogehoge" // .showOpenDialog(mainWindow, { // properties: ['openFile'], // }) // .then((result) => { // if (result.cancelled) return "Cancelled hoge"; // return "hoge"; // }); }); mainWindow.loadFile('index.html'); }; app.once('ready', () => { createWindow(); }); app.once('window-all-closed', () => app.quit()); <!-- index.html --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="Content-Security-policy" content="default-src 'self'" /> <meta name="viewport" content="width=device-width, inicial-scale=1.0" /> <title>IPC App</title> <link rel="stylesheet" href="styles.css"> </head> <body> <h2>Input something</h2> URL: <input id="URL"/> <button id="errorBtn">Open</button> <p id="text"></p> <script src="index.js"></script> </body> </html> const {ipcRenderer} = require("electron"); const Button = document.getElementById("Button"); const text = document.getElementById("text"); errorBtn.addEventListener('click', async () => { console.log("index.js"); text.textContent = await ipcRenderer.invoke('open-dialog'); }); I will try to use the packaging function tomorrow.
Top comments (0)