Comunicación entre procesos en Electron.js

- Andrés Cruz

In english
Comunicación entre procesos en Electron.js

Hay muchos escenarios en los cuales necesitamos comunicar ambos procesos, que al ocurrir un suceso en el proceso principal y/o el proceso de renderizado poder enviar dicho mensaje en cualquier momento para realizar alguna acción determinada; poder enviar mensajes mediante eventos entre procesos es particularmente útil para realizar operaciones que solamente puedan ejecutarse en alguno de los lados pero que necesitamos comunicar al otro lado; por ejemplo: 

  • Si deseamos abrir una nueva ventana al dar un click sobre un botón, en donde el botón obviamente está en la página web, es lógico que desde la página web, debemos de enviar un mensaje al proceso principal para abrir dicha ventana.
  • Si desde el componente principal debemos de pasar datos a la página web que van a ser tomados como referencia para construir la interfaz de la aplicación; estos datos, pueden ser suministrados en cualquier comento, ya sea, cuando carga la página web, al interactuar el usuario con la aplicación, etc.

En resumen, como cualquier otro paradigma, por ejemplo el basado en el cliente y servidor usado por las aplicaciones web, es imprescindible comunicar las capas o procesos que se encuentren involucrados, ya sea de manera directa o indirecta y vamos a conocer en detalle cómo realizar estos procesos.

En Electron, contamos con un solo proceso principal y uno o más procesos de renderizados o páginas web; la comunicación entre ambos, se hacen mediante un par de módulos:

  • ipcMain: Este módulo se utiliza para comunicarse desde el proceso principal a los procesos de renderizado.
  • ipcRenderer: este módulo se utiliza para comunicarse desde los procesos de renderizado al proceso principal.

Analicemos en la práctica cada uno de ellos.

Proceso principal a proceso de renderizado

Para poder enviar un mensaje a la página web desde el proceso principal, tenemos la siguiente función:

<window>.webContents.send(<EVENT>,<VALUE>)

Desde el cliente nos tenemos que suscribir a un evento; necesitamos importar un objeto ipcRenderer desde Electron y escuchar el canal establecido.

const { ipcRenderer } = require('electron')

ipcRenderer.on(<EVENT>, (event, arg) => {
 // TO DO
});

Proceso de renderizado a proceso principal

Para poder enviar mensaje desde el proceso de renderizado o página web, lo tenemos muy sencillo, basta con pasar desde la página web el mensaje:

const { ipcRenderer } = require('electron')
ipcRenderer.send('message', <DATA>)

Desde el proceso principal, tenemos un evento callback:

const {ipcMain} = require('electron')

ipcMain.on('message',(event, arg) => {
   // TO DO
})

Recuerda que el material anterior forma parte sobre mi curso completo sobre Electron.js

Andrés Cruz

Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter

Andrés Cruz en Udemy

Acepto recibir anuncios de interes sobre este Blog.