Electron-arkitektur: Hoved- og renderer-prosesser

Electron er et rammeverk som kombinerer Chromium (for gjengivelse av webinnhold) med Node.js (for tilgang til native API-er), slik at utviklere kan bygge plattformuavhengige skrivebordsapplikasjoner ved hjelp av velkjente webteknologier. React-appen kjører i et Chromium-nettleservindu, mens Node.js gir tilgang til funksjoner i operativsystemet.

Hovedprosessen er startpunktet for en Electron-applikasjon – den administrerer applikasjonens livssyklus, oppretter og styrer vinduer og håndterer samhandling med operativsystemet. Den starter renderer-prosesser og har full tilgang til Node.js-API-er og det underliggende operativsystemet.

Hver BrowserWindow starter sin egen renderer-prosess, som kjører Chromium og utfører React-applikasjonen din. Det finnes én renderer-prosess per vindu, og den oppfører seg omtrent som en vanlig nettleserfane – den gjengir HTML, CSS og JavaScript.

Fordi hovedprosessen har full tilgang til Node.js, kan den lese og skrive til filsystemet, opprette native menyer, administrere systemstatusfeltet, starte underprosesser og samhandle med maskinvare. Disse mulighetene er som standard ikke tilgjengelige i renderer-prosessen av sikkerhetsgrunner.

Når contextIsolation er satt til true, kjører renderer-prosessen i en sandkasse og kan ikke få direkte tilgang til Node.js-API-er. Denne sikkerhetsmodellen hindrer skadelig webinnhold i å få tilgang til filsystemet eller kjøre vilkårlige systemkommandoer.

Kommunikasjon mellom prosesser (IPC) er mekanismen som lar hovedprosessen og renderer-prosessen utveksle meldinger. Hovedprosessen bruker ipcMain til å lytte etter og svare på meldinger, mens renderer-prosessen bruker ipcRenderer til å sende dem – all kommunikasjon er asynkron og meldingsbasert.

Preload-skriptet har en særstilling: Det kjører i konteksten til renderer-prosessen, men har fortsatt tilgang til Node.js-API-er før sideinnholdet lastes inn. Dette gjør det til den sikre broen mellom den sandkassebaserte renderer-prosessen og den privilegerte hovedprosessen.

contextBridge.exposeInMainWorld lar preload-skriptet selektivt eksponere et trygt og nøye utvalgt API for renderer-prosessen. Renderer-prosessen kan kalle de eksponerte funksjonene uten å få direkte tilgang til Node.js eller interne Electron-funksjoner, noe som opprettholder en tydelig sikkerhetsgrense.

Når contextBridge har eksponert et API under et navn som "api", kan React-komponentene dine kalle det via window.api.myFunction(). Dette føles akkurat som å kalle en vanlig JavaScript-funksjon, men i bakgrunnen går kallet via IPC til hovedprosessen.

Electron-sikkerhetsmodellen forbyr uttrykkelig direkte Node.js-tilgang i renderer-prosessen når contextIsolation er aktivert. Alle privilegerte operasjoner må gå gjennom preload-skriptet og contextBridge, slik at selv et XSS-angrep i renderer-prosessen ikke får tilgang til filsystemet.

En typisk samhandling foregår slik: React-komponenten kaller window.api.readFile() → preload-skriptet kaller ipcRenderer.invoke() → hovedprosessens ipcMain.handle() utfører fs.readFile() → resultatet returneres som et Promise til renderer-prosessen. Denne arkitekturen holder renderer-prosessen ryddig og sikker.

Electron kombinerer Chromium og Node.js: Hovedprosessen administrerer applikasjonens livssyklus og har full tilgang til operativsystemet, mens renderer-prosessene kjører React-grensesnittet ditt i et sandkassebasert miljø. Preload-skriptet og contextBridge utgjør den sikre broen, og IPC muliggjør trygg kommunikasjon mellom den privilegerte hovedprosessen og den isolerte renderer-prosessen.