I have an Electron app that can open different windows.
On app launch the app open a set of window(s) (that load the same HTML and JS files) but with params to change ea
For example:
Process script
In your main script write:
global.varsForWindow = {
platform: process.platform
};
Window script
Where you need it in a window script:
var varsFromMainScript = require('electron').remote.getGlobal('varsForWindow');
console.log(varsFromMainScript.platform);
A few methods:
The query string method others have posted seems to work fine. It might even be the easiest.
Electron's documentation says additionalArguments
is:
Useful for passing small bits of data down to renderer process preload scripts.
Main
const win = new BrowserWindow({
width: 800,
height: 600,
backgroundColor: '#000000'
webPreferences: {
additionalArguments: ["myvarvalue", "secondvarvalue", "--another=something"]
}
});
Renderer
window.process.argv
is going to look something like:
["--num-raster-threads=2",
"--enable-gpu-memory-buffer-compositor-resources",
"--enable-gpu-async-worker-context",
...
"--renderer-client-id=4",
"myvarvalue",
"secondvarvalue",
"--another=something"]
It will append an array of strings. You could do something window.process.argv.slice(-3)
to grab the last items in the array.
Like you said, it seems complicated for what you are trying to do, but maybe this helps:
Main
const { ipcMain } = require('electron');
var mainProcessVars = {
somevar: "name",
anothervar: 33
}
ipcMain.on('variable-request', function (event, arg) {
event.sender.send('variable-reply', [mainProcessVars[arg[0]], mainProcessVars[arg[1]]]);
});
Renderer
const { ipcRenderer } = electron;
electron.ipcRenderer.send('variable-request', ['somevar', 'anothervar']);
ipcRenderer.on('variable-reply', function (event, args) {
console.log(args[0]); // "name"
console.log(args[1]); // 33
});
This way allows you to send data besides strings.
Using query string along with win.loadFile()
,
// main process or renderer process 1
data = {"age": 12, "healthy": true}
let win = new BrowserWindow({
webPreferences: {
nodeIntegration: true
}
});
win.loadFile("public/print.html", {query: {"data": JSON.stringify(data)}});
// renderer process 2
const querystring = require('querystring');
let query = querystring.parse(global.location.search);
let data = JSON.parse(query['?data'])
You can share data between main and renderer processor using global
variable:
Main processor:
global.id = 1;
Renderer processor:
let id = remote.getGlobal('id');
We can inject Javascript code execution (on window did-finish-load
event) and trigger react re-rendering with correct redux state portion. But it requires additional lifecycle step in rendered process.
Using hash or query in "local filepath" sounds a little bit weird but in my case it take sense since the hash describe the redux store branch to take in consideration in this window (file://which-code-to-load#which-content
).
So even if i'm not totally at ease with this approach right now I'll take the second option.
It's a shame that the API doesn't provide any way to declare global vars from main process on window opening. I'll post a feature request.
According atom source code the query string method is a reliable way to do that very simply, especially when we only need to pass a unique string param:
// main process
win1.loadURL(`file://${__dirname}/app/app.html?id=${id}`);
// rendered process
console.log(global.location.search);
https://github.com/electron/electron/issues/6504