JavaScript

Electron は、HTML、CSS、JavaScript といった Web 技術を使用して、クロスプラットフォームのデスクトップアプリケーションを開発するための最も人気のあるフレームワークの 1 つです。内部的には、Node.js を実行する メインプロセス（Main Process） と、UI を描画するために Chromium を実行する 1 つ以上の レンダラープロセス（Renderer Process） からなるマルチプロセスアーキテクチャを採用しています。 セキュリティ上のリスクを排除するため、モダンな Electron アプリケーションでは、レンダラープロセスをオペレーティングシステムから隔離しています。つまり、レンダラーの UI から直接 Node.js モジュールやシステムリソース（ファイルの読み込みやデータベースへのクエリなど）にアクセスすることはできません。 このギャップを安全に埋めるために、Electron は プロセス間通信（IPC: Inter-Process Communication） を利用しています。 本ガイドでは、Electron の IPC がどのように動作するのかを解説し、本番環境でそのまま使用できる実用的なコード例とともに、3 つの基本的な通信パターンを紹介します。 1. レンダラープロセスからメインプロセスへ（単方向 / One-Way） このパターンは、レンダラーがレスポンスを待つことなく、メインプロセスにコマンドやアクションを送信したい場合に使用されます。一般的な例としては、UI 上のボタンをクリックしてアプリケーションウィンドウを最小化または閉じる操作が挙げられます。 これらが 3 つの主要なファイル（main.js、preload.js、renderer.js）でどのように実装されるかを見てみましょう。 メインプロセス (main.js) レンダラープロセスからのイベントを監視するために ipcMain.on を使用します。 const { app, BrowserWindow, ipcMain } = require('electron'); const path = require('path'); function createWindow() { const win = new BrowserWindow({ width: 800, height: 600, webPreferences: { preload: path.join(__dirname, 'preload.js'), contextIsolation: true, nodeIntegration: false } }); win.loadFile('index.html'); } // レンダラーからの 'close-app' イベントを購読 ipcMain.on('close-app', () => { app.quit(); }); プリロードスクリプト (preload.js) ipcRenderer モジュール全体をレンダラーに露出させるのではなく、contextBridge.exposeInMainWorld を使って安全なラッパー関数のみを露出させます。