본문으로 이동
@capgo/전자 업데이터 업데이트 오픈 소스

전자 업데이터 Electron 플러그인

전자 앱에 대한 OTA 실시간 업데이트 기능은 capacitor-업데이터와 동일한 API 표면을 제공합니다.

설치

bun add @capgo/electron-updater
npm, pnpm 또는 yarn
  • npm install @capgo/electron-updater
  • pnpm add @capgo/electron-updater
  • yarn add @capgo/electron-updater

가이드

Electron Updater를 Electron에서 사용하는 방법

@capgo/electron-updater를 사용하면

@capgo/electron-updater Electron 앱에 Capgo의 라이브 업데이트 모델을 제공합니다. @capgo/capacitor-updatermain process에서 초기화하고, preload를 통해 렌더러 브리지를 노출하고, notifyAppReady() launch마다 호출하여 롤백 보호가 bundle이 정상인지 알 수 있도록 합니다.

설치

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());
});

프리로드 브리지

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() 렌더러에서 rollback 보호가 작동하도록 하려면
  • 빌드된 경로를 안정적으로 유지하고 업데이터가 shipped 번들을 로드하거나 다운로드한 번들을 로드할지 결정하도록 하세요.
  • Capgo 채널과 롤아웃 모델을 재사용하세요. 모바일에서 이미 사용 중인 것과 동일한 채널과 롤아웃 모델을 재사용하세요. Electron 앱이 백엔드 릴리스 PIPELINE을 공유할 때.

Using @capgo/electron-updater에서 계속하세요.

이러한 기능을 사용 중이라면 @capgo/electron-updater 사용 자연 플러그인 작업을 계획하기 위해 @__CAPGO_KEEP_0__/electron-updater와 연결하세요. @capgo/전자 업데이터 자연 플러그인 작업을 계획하기 위해 @capgo/electron-updater와 연결하세요. Electron Updater 시작하기 Getting Started with Electron Updater Capgo 플러그인 디렉토리 Capgo Plugin Directory Capacitor Capgo의 플러그인 Capacitor Plugins by Capgo 플러그인 추가 또는 업데이트 Capgo 플러그인 구현 세부 사항에 대한 정보입니다.

FAQ

Electron Updater 플러그인 FAQ

Electron 앱에 Electron Updater 플러그인을 설치하는 방법은?

Electron Updater 플러그인을 설치하려면 "bun add @capgo/electron-updater" (또는 "npm install @capgo/electron-updater") 명령어를 실행하고, Electron 설정 단계를 따라서 guide와 GitHub README를 참조하십시오.

@capgo/electron-updater는 React, Vue 및 Angular과 함께 작동합니까?

예. Electron Updater는 Electron 패키지이므로, React, Vue, Angular, Svelte 및 단순한 JavaScript와 함께 작동합니다.

@capgo/electron-updater는 무료이며 오픈 소스입니까?

예. 소스 code는 GitHub에 공개되어 있으며 https://github.com/Cap-go/electron-updater/에서 확인할 수 있습니다. 또한 npm에서 무료로 설치할 수 있습니다. 버그 리포트 및 Pull Request는 환영합니다.

앱 리뷰 기다리지 않고 Electron 업데이터 변경을 배포하세요.

플러그인이 스토어 빌드에 포함되면 Capgo 라이브 업데이트에서 사용자에게 JavaScript, HTML 및 CSS 변경을 몇 분 안에 푸시합니다.

Capgo로 시작하세요.