Sharing between main and renderer process

In short

In main process:

global.something = value;

In renderer process:

const remote = require('electron').remote;
var something = remote.getGlobal('something');

Longer version

To use same instance between main and renderer process, you can use global object from Node. To demonstrate this, let’s add logger to sample Todo application.

In main.js we’re going to create logger instance which can be required and used in all other renderers. For logging I’m using winston:

const logger = require('winston');
logger.level = 'debug';

Also, let’s add logging to file:

var logFolder = path.join(app.getPath("userData"), "logs");
var logFile = new Date().toISOString().replace(/:/g, '.') + '.log';
logger.add(logger.transports.File, { filename: path.join(logFolder, logFile) });

This should create timestamped log file for each session in log folder in your user data folder.
Note: All : chars needs to be escaped, since it will create problems on Windows.

Finally, save logger instance to global object:

global.logger = logger;

Now that logger is accessible in global object, in renderer you can fetch it by using remote module. Following code will fetch logger instance and inject it in Angular for use throughout the app:

const {remote} = require('electron');
const logger = remote.getGlobal('logger');
angular
    .module('app')
    .value('logger', logger);

Final note:

Although winston does create one instance which can be used throughout your app, this doesn’t apply when you have main and renderer process architecture like is in Electron. That's why I had to inject single instance in each renderer.

You can see it in action in standard example project.

Hope it helps, cheers!

About Vjekoslav Ratkajec

Software developer from Zagreb, Croatia. Love programming, running, hiking and biking. Adore nature and animals. Also author of this blog.

Comments