Electron Datei Öffnen und Inhalt in Script übergeben?

1 Antwort

Um den Inhalt der geöffneten Datei an Ihre Renderer-Prozesse zu übergeben, können Sie die Inter-Process Communication (IPC) in Electron verwenden. Dazu müssen Sie folgende Schritte durchführen:

  1. Ändern Sie Ihre
  2. main.js
  3. Datei wie folgt:

const { app, BrowserWindow, Menu, ipcMain } = require('electron');

const { mainMenu } = require('./menu');

const path = require('path');

let mainWindow;

const createWindow = () => {

 mainWindow = new BrowserWindow({

  width: 800,

  height: 600,

  webPreferences: {

   preload: path.join(__dirname, 'preload.js'),

   // Aktivieren Sie die nodeIntegration, um auf das ipcMain-Modul zugreifen zu können

   nodeIntegration: true

  },

 });

 Menu.setApplicationMenu(mainMenu);

 mainWindow.loadFile(path.join(__dirname, "src/index.html"));

 // Hinzufügen eines IPC-Listeners, um den Dateiinhalt an den Renderer-Prozess zu senden

 ipcMain.on('fileContent', (event, content) => {

  mainWindow.webContents.send('fileContent', content);

 });

};

// ...

  1. In Ihrer
  2. menu.js
  3. Datei, rufen Sie den
  4. ipcRenderer
  5. in der Renderer-Prozess-Datei auf und senden den Dateiinhalt an den Hauptprozess:

const { app, Menu, dialog, ipcRenderer } = require('electron');

const fs = require('fs');

const template = [

 {

  label: 'Datei',

  submenu: [

   {

    label: 'Öffnen',

    accelerator: 'CmdOrCtrl+O',

    click: async () => {

     const files = await dialog.showOpenDialog({

      properties: ['openFile'],

      filters: [

       { name: 'Json', extensions: ['json'] },

       { name: 'Alle Dateien', extensions: ['*'] }

      ]

     });

     if (!files || files.canceled || files.filePaths.length === 0) return;

     const file = files.filePaths[0];

     const fileContent = fs.readFileSync(file, 'utf-8');

     // Senden Sie den Dateiinhalt an den Hauptprozess

     ipcRenderer.send('fileContent', fileContent);

    }

   }

  ]

 }

]

// ...

  1. In Ihrer
  2. index.html
  3. Datei, fügen Sie einen Listener hinzu, um den Dateiinhalt vom Hauptprozess zu empfangen und ihn in Ihrer Seite anzuzeigen:

<!DOCTYPE html>

<html lang="en">

<head>

 <!-- ... -->

</head>

<body>

 <h1>Seite</h1>

 <script>

  const { ipcRenderer } = require('electron');

  ipcRenderer.on('fileContent', (event, content) => {

   console.log(content); // Konsolenausgabe des Dateiinhalts

   // Hier können Sie den Inhalt der Datei in Ihrem HTML-Dokument anzeigen oder weiterverarbeiten

  });

 </script>

</body>

</html>

Durch diese Änderungen sollte der Inhalt der geöffneten Datei im Renderer-Prozess verfügbar sein und Sie können ihn in Ihrem HTML-Dokument anzeigen oder weiterverarbeiten.