javascript - Send environment variable value to renderer thread in Electron app - Stack Overflow

admin管理员组

文章数量:1336632

I have an Electron app. I need to get the value of an environment variable from my local machine to use on the renderer thread. I want to pass this value to the renderer thread when the app starts. I know in the main.js file, I can get the environment variable like this:

main.js

const createWindow = () => {
    const win = new BrowserWindow({
        width: 800,
        height: 600
    });
  
    win.loadFile('index.html');

    // Retrieve the environment variable value
    const variableValue = process.env.MY_ENVIRONMENT_VARIABLE;
    console.log(`Variable value: ${variableValue}`);

    // Send the variable and it's value to the renderer.
    win.webContents.send('initialize', { 'variableName':variableValue });
}

The above successfully prints the environment variable's value to the terminal window. However, I need to use this value in the browser side of the ball. How do I get the variable's value there?

Thank you!

I have an Electron app. I need to get the value of an environment variable from my local machine to use on the renderer thread. I want to pass this value to the renderer thread when the app starts. I know in the main.js file, I can get the environment variable like this:

main.js

const createWindow = () => {
    const win = new BrowserWindow({
        width: 800,
        height: 600
    });
  
    win.loadFile('index.html');

    // Retrieve the environment variable value
    const variableValue = process.env.MY_ENVIRONMENT_VARIABLE;
    console.log(`Variable value: ${variableValue}`);

    // Send the variable and it's value to the renderer.
    win.webContents.send('initialize', { 'variableName':variableValue });
}

The above successfully prints the environment variable's value to the terminal window. However, I need to use this value in the browser side of the ball. How do I get the variable's value there?

Thank you!

• javascript
• electron

Share Improve this question Follow asked Dec 2, 2021 at 17:06 DevDev 1,22344 gold badges1919 silver badges4040 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

This can't be done directly from the renderer process (with nodeIntegration off), since it has no direct access to the Node.js process variable.

The most straightforward way to do this is via the BrowserWindow's preload script, which allows you to expose arbitrary data to the renderer process via Electron's contextBridge API. An example:

// Main Process
const win = new BrowserWindow({
  width: 800,
  height: 600,
  webPreferences: {
    preload: path.join(__dirname, 'preload.js'); // require `path` if you haven't already
  }
});

// Preload Script
const { contextBridge } = require('electron');

// this should print out the value of MY_ENVIRONMENT_VARIABLE
console.log(process.env.MY_ENVIRONMENT_VARIABLE);

contextBridge.exposeInMainWorld('envVars', {
  myEnvironmentVariable: process.env.MY_ENVIRONMENT_VARIABLE
});

// Renderer Process
console.log(window.envVars.myEnvironmentVariable)

See the contextBridge API docs: https://www.electronjs/docs/latest/api/context-bridge

本文标签： javascriptSend environment variable value to renderer thread in Electron appStack Overflow