es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Solicite una variable definida en el renderizador desde la precarga.

Con:

  • contextIsolation = true
  • nodeIntegration = false

¿Cuál es la mejor manera de pedir el valor de una variable definida en el contexto del renderer desde el contexto de preload?

Estoy desarrollando una aplicación para gestionar colecciones de fotos.

En mi main.js hay un elemento de menú para importar fotos, la función de clic para esta entrada de menú es:

click() {
  dialog.showOpenDialog(mainWindow, {
    title: 'Importar',
    properties: ['openFile&##39;, 'multiSelections']
  }).then(result => {
    if (result.filePaths.length) {
      mainWindow.webContents.send('import', result.filePaths);
    }
  });
}

en preload.js:

ipcRenderer.on('import', (ev, origins) => {
  origins.forEach(origin => {
    files.importPhoto(origin, dir);
  });
});

el atributo ‘dir’ en la función de preload es la carpeta de destino para copiar las fotos y es el valor que necesito obtener de app.js en el renderer.

Tags:  ,

Answer

  1. Avatar for davy.ai

    Dado que hemos configurado nodeIntegration en false y contextIsolation en true, necesitamos usar IPC (Comunicación entre Procesos) para comunicarnos entre los contextos del renderer y preload.

    Para obtener el valor de una variable definida en el contexto del renderer desde el contexto del preload, podemos definir un canal IPC en el archivo preload.js utilizando el método contextBridge.exposeInMainWorld() de contextBridge. El código se vería así:

    const { contextBridge, ipcRenderer } = require('electron');
    
    contextBridge.exposeInMainWorld('myAPI', {
      getDir: () => ipcRenderer.invoke('get-dir')
    });
    

    Aquí, hemos expuesto un nuevo objeto llamado myAPI al contexto del renderer con un método getDir(). Este método utiliza ipcRenderer.invoke() para enviar un mensaje asíncrono al proceso principal para obtener el valor de dir.

    En el archivo main.js, necesitamos escuchar el canal get-dir y enviar de vuelta el valor de dir al contexto del preload. El código se vería así:

    ipcMain.handle('get-dir', (event) => {
      return dir;
    });
    

    Aquí, estamos usando ipcMain.handle() para escuchar el canal get-dir y enviar el valor de dir de vuelta al contexto del preload.

    Finalmente, en el archivo preload.js, podemos llamar al método getDir() de myAPI para obtener el valor de dir. El código actualizado se vería así:

    const { myAPI, ipcRenderer } = require('electron');
    
    ipcRenderer.on('import', (ev, origins) => {
      origins.forEach(origin => {
        files.importPhoto(origin, myAPI.getDir());
      });
    });
    

    Aquí, estamos usando el método getDir() de myAPI para obtener el valor de dir y pasarlo al método importPhoto().

    De esta manera, podemos comunicarnos de manera segura entre los contextos del renderer y preload sin comprometer la seguridad de la aplicación.

Comments are closed.