正文 2864字数 10,621阅读


在Electron项目中安装了node-machine-id模块
npm install node-machine-id
Run code
Cut to clipboard


    在Electron的主进程中,
    使用node-machine-id模块获取机器码并通过contextBridge传递给渲染进程:
    // main.js (Electron主进程入口文件) const { app, BrowserWindow, ipcMain, contextBridge } = require('electron'); const { machineIdSync } = require('node-machine-id'); function createWindow() { mainWindow = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: false, // 禁用nodeIntegration contextIsolation: true, // 启用contextIsolation preload: path.join(__dirname, 'preload.js'), // 指定preload脚本 }, }); mainWindow.loadFile('index.html'); } app.on('ready', createWindow);
    Run code
    Cut to clipboard


      然后,在Electron主进程的同级目录下创建preload.js文件,
      用于在渲染进程中暴露machineIdSync函数:
      // preload.js const { contextBridge } = require('electron'); const { machineIdSync } = require('node-machine-id'); // 使用contextBridge安全地暴露machineIdSync函数给渲染进程 contextBridge.exposeInMainWorld('myElectronAPI', { machineIdSync: machineIdSync, });
      Run code
      Cut to clipboard


        在Vue.js应用中,
        使用window.myElectronAPI.machineIdSync来获取机器码:
        // 在Vue.js应用中 // 使用window.myElectronAPI.machineIdSync可以安全地在渲染进程中获取机器码 const machineId = window.myElectronAPI.machineIdSync(); console.log('Machine ID:', machineId);
        Run code
        Cut to clipboard


          ===end===

          在 Electron 中,当渲染进程通过 ipcRenderer.invoke() 调用某个方法时,
          需要在主进程的 ipcMain 中注册对应的处理函数。
          在主进程 main.js 中添加对 test1 消息的处理:
          // main.js (Electron主进程入口文件) const { app, BrowserWindow, ipcMain, contextBridge } = require('electron'); const { machineIdSync } = require('node-machine-id'); function createWindow() { mainWindow = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: false, contextIsolation: true, preload: path.join(__dirname, 'preload.js'), }, }); mainWindow.loadFile('index.html'); } // 在主进程中注册对应的处理函数 ipcMain.handle('test1', (event, arg) => { console.log('Received test1 message from renderer:', arg); // 在这里执行对test1消息的处理,并返回结果给渲染进程 return 'Hello from Electron'; }); app.on('ready', createWindow);
          Run code
          Cut to clipboard


            在渲染进程的 preload.js 中
            // preload.js const { contextBridge, ipcRenderer } = require('electron'); const { machineIdSync } = require('node-machine-id'); // 使用contextBridge安全地暴露machineIdSync函数和test1方法给渲染进程 contextBridge.exposeInMainWorld('myElectronAPI', { machineIdSync: machineIdSync, test1: (a) => { return ipcRenderer.invoke('test1', a); }, });
            Run code
            Cut to clipboard


              在 Vue.js 应用中,
              调用 window.myElectronAPI.test1 来触发 test1 方法,
              并获取主进程中处理后的结果:
              // 在Vue.js应用中 async function test1FromElectron() { const result = await window.myElectronAPI.test1('Hello from Vue.js'); console.log('Result from main process:', result); } test1FromElectron();
              Run code
              Cut to clipboard

                现在,应该能够在渲染进程中成功调用主进程中的 test1 方法,并得到返回结果了