メインコンテンツへスキップ
@capgo/electron-updater アップデート オープンソース

Electron Updater Electron プラグイン

capacitor-updater と同じ API インターフェースを持つ、Electron アプリ向けの OTA ライブアップデート

インストール

bun add @capgo/electron-updater
npm、pnpm、または yarn
  • npm install @capgo/electron-updater
  • pnpm add @capgo/electron-updater
  • yarn add @capgo/electron-updater

ガイド

Electron で Electron Updater を使う方法

@capgo/electron-updater の使い方

@capgo/electron-updater Electron アプリに Capgo と同様のライブアップデートモデルを提供します @capgo/capacitor-updater。メインプロセスで初期化し、preload 経由でレンダラーブリッジを公開して、次を呼び出します notifyAppReady() 起動のたびに実行し、ロールバック保護がバンドルの健全性を確認できるようにします。

インストール

bun add @capgo/electron-updater

メインプロセスのセットアップ

import { app, BrowserWindow } from 'electron';
import path from 'node:path';
import { ElectronUpdater, setupEventForwarding, setupIPCHandlers } from '@capgo/electron-updater';

const updater = new ElectronUpdater({
  appId: 'com.example.desktop',
  autoUpdate: true,
});

app.whenReady().then(async () => {
  const window = new BrowserWindow({
    webPreferences: {
      preload: path.join(__dirname, 'preload.js'),
      contextIsolation: true,
    },
  });

  const builtinPath = path.join(__dirname, 'www/index.html');
  await updater.initialize(window, builtinPath);
  setupIPCHandlers(updater);
  setupEventForwarding(updater, window);

  await window.loadFile(updater.getCurrentBundlePath());
});

Preloadブリッジ

import { exposeUpdaterAPI } from '@capgo/electron-updater/preload';

exposeUpdaterAPI();

レンダラーでの使用方法

import { requireUpdater } from '@capgo/electron-updater/renderer';

const updater = requireUpdater();

await updater.notifyAppReady();

const latest = await updater.getLatest();

if (latest.url && !latest.error) {
  const bundle = await updater.download({
    url: latest.url,
    version: latest.version,
    checksum: latest.checksum,
  });

  await updater.next({ id: bundle.id });
}

アップデートイベントのリスニング

updater.addListener('download', ({ percent }) => {
  console.log('Download progress', percent);
});

updater.addListener('updateFailed', ({ bundle }) => {
  console.error('Update failed', bundle.version);
});

新しいバンドルのデプロイ

bun run build
bunx @capgo/cli@latest bundle upload --channel=production

実践的なアドバイス

  • 必ず呼び出すこと notifyAppReady() ロールバック保護が意図通りに機能するよう、レンダラーの早い段階で実行してください。
  • 組み込みのパスは固定したまま、同梱のバンドルを読み込むかダウンロードしたものを読み込むかの判断はアップデーターに任せてください。
  • Electronアプリのバックエンド・リリースパイプラインが共通している場合は、モバイルで使用しているCapgoチャネルとロールアウトモデルをそのまま再利用してください。

Using @capgo/electron-updater から続きを読む

使用している場合 @capgo/electron-updater の使い方 ネイティブプラグインの作業を計画するには、次と連携してください: @capgo/electron-updater @capgo/electron-updater の実装の詳細については、 Electron Updater の始め方 Electron Updater の Getting Started での実装の詳細については、 Capgo プラグインディレクトリ Capgo プラグインディレクトリのプロダクトワークフローについては、 Capgo による Capacitor プラグイン Capgo による Capacitor Plugins の実装詳細、および プラグインの追加または更新 プラグインの追加または更新に関する実装詳細についてはこちら。

よくある質問

Electron Updater プラグイン FAQ

Electron アプリに Electron Updater プラグインをインストールするにはどうすればよいですか?

"bun add @capgo/electron-updater"(または "npm install @capgo/electron-updater")を実行し、ガイドと GitHub の README にある Electron のセットアップ手順に従ってください。

@capgo/electron-updater は React、Vue、Angular で動作しますか?

はい。Electron Updater は Electron パッケージなので、Electron 内で動作する Web フレームワーク(React、Vue、Angular、Svelte、素の JavaScript)であればどれでも使えます。

@capgo/electron-updater は無料でオープンソースですか?

はい。code のソースコードは GitHub 上の https://github.com/Cap-go/electron-updater/ で公開されており、パッケージは npm から無料でインストールできます。バグ報告やプルリクエストも歓迎です。

アプリの審査を待たずに Electron Updater の変更をリリース

プラグインをストア用ビルドに組み込めば、Capgo live updates で JavaScript、HTML、CSS の変更を数分でユーザーに配信できます

Capgo から始める