Passer à la navigation

Getting Started

GitHub

Vous pouvez utiliser notre configuration assistée par l'IA pour installer le plug-in. Ajoutez les Capgo compétences à votre outil IA en utilisant la commande suivante :

Fenêtre de terminal
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Ensuite, utilisez la prompt suivante :

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-updater` plugin in my project.

Si vous préférez la configuration manuelle, installez le plug-in en exécutant les commandes suivantes et suivez les instructions spécifiques au plateforme ci-dessous :

Fenêtre de terminal
bun add @capgo/capacitor-updater
bunx cap sync

Pour la plupart des utilisateurs, nous recommandons de suivre le guide de démarrage rapide qui couvre à la fois l'installation du plugin et Capgo l'intégration cloud.

Ce guide de démarrage se concentre sur les détails techniques du plugin pour les utilisateurs avancés qui souhaitent comprendre les mécanismes sous-jacents ou mettre en œuvre des mises à jour auto-hébergées.

Le plugin de mise à jour Capacitor permet des mises à jour en ligne (OTA) pour vos applications Capacitor. Cela vous permet de pousser des mises à jour vers votre application sans passer par les examens des magasins d'applications.

  1. Téléchargement du paquet: Le plugin télécharge les paquets de mise à jour (fichiers ZIP contenant vos actifs web)
  2. Extraction: Les paquets sont extraits sur le stockage du dispositif
  3. Rechargement en direct: L'application passe au nouveau bundle sans nécessiter un redémarrage
  4. Mode de reversion: Si une mise à jour échoue, l'application revient à la version précédente fonctionnelle

La façon la plus simple d'utiliser le plugin avec une gestion automatique de mise à jour :

import { CapacitorUpdater } from '@capgo/capacitor-updater';
// Plugin handles everything automatically
// Configure in capacitor.config.ts

Ajouter à votre capacitor.config.ts:

{
plugins: {
CapacitorUpdater: {
autoUpdate: 'atBackground',
updateUrl: 'https://your-update-server.com/api/updates'
}
}
}

Pour un contrôle avancé du processus d'actualisation :

import { CapacitorUpdater } from '@capgo/capacitor-updater';
// Download an update
const bundle = await CapacitorUpdater.download({
url: 'https://your-server.com/updates/v1.0.1.zip',
version: '1.0.1'
});
// Set the bundle (will be used on next app start)
await CapacitorUpdater.set({
id: bundle.id
});
// Or reload immediately
await CapacitorUpdater.reload();

Android

Section intitulée “iOS”

import { CapacitorUpdater } from '@capgo/capacitor-updater';
const bundle = await CapacitorUpdater.download({
url: 'https://example.com/update.zip',
version: '1.0.1'
});
console.log('Downloaded bundle:', bundle.id);
// Set bundle to be used on next app start
await CapacitorUpdater.set({
id: bundle.id
});
// Reload app immediately with new bundle
await CapacitorUpdater.reload();
const { bundles } = await CapacitorUpdater.list();
console.log('Available bundles:', bundles);
await CapacitorUpdater.delete({
id: 'bundle-id'
});
const { bundle } = await CapacitorUpdater.current();
console.log('Current bundle:', bundle.version);

Écouter les événements de mise à jour :

import { CapacitorUpdater } from '@capgo/capacitor-updater';
// Listen for download progress
CapacitorUpdater.addListener('download', (info) => {
console.log('Download progress:', info.percent);
});
// Listen for download completion
CapacitorUpdater.addListener('downloadComplete', (bundle) => {
console.log('Download complete:', bundle.version);
});
// Listen for update failures
CapacitorUpdater.addListener('updateFailed', (error) => {
console.error('Update failed:', error);
});
// Listen for successful updates
CapacitorUpdater.addListener('updateAvailable', (info) => {
console.log('Update available:', info.version);
});

Configurez le plugin dans votre capacitor.config.ts:

{
plugins: {
CapacitorUpdater: {
// Auto-update settings
autoUpdate: 'atBackground',
updateUrl: 'https://api.example.com/updates',
// Update behavior
resetWhenUpdate: true,
// Version settings
version: '1.0.0',
// Security
allowModifyUrl: false,
// Stats collection
statsUrl: 'https://api.example.com/stats',
// Channel (for Capgo cloud)
defaultChannel: 'production'
}
}
}

La meilleure façon de commencer :

// Install the Capgo CLI
bun add -g @capgo/cli
// Login to Capgo
npx @capgo/cli login
// Upload your first bundle
npx @capgo/cli bundle upload
// The plugin auto-updates from Capgo cloud

Consultez le guide de démarrage rapide principal Détails.

Héberger votre propre serveur de mise à jour :

// Configure your update endpoint
{
plugins: {
CapacitorUpdater: {
autoUpdate: 'atBackground',
updateUrl: 'https://your-server.com/api/check-update'
}
}
}

Votre serveur doit retourner :

{
"version": "1.0.1",
"url": "https://your-server.com/updates/1.0.1.zip"
}

Voir Mode auto-hébergé Détails complets.

Contrôle total sur les mises à jour :

import { CapacitorUpdater } from '@capgo/capacitor-updater';
async function checkAndUpdate() {
// Check for updates from your server
const response = await fetch('https://api.example.com/check-update');
const { version, url } = await response.json();
// Download the update
const bundle = await CapacitorUpdater.download({
url,
version
});
// Notify bundle is ready
await CapacitorUpdater.notifyAppReady();
// Set as next version
await CapacitorUpdater.set({ id: bundle.id });
// Reload when ready
await CapacitorUpdater.reload();
}
  • Appeler toujours notifyAppReady() lorsque votre application se charge avec succès
  • Tester les mises à jour soigneusement avant de les envoyer en production
  • Implémenter une gestion des erreurs appropriée pour les échecs de réseau
  • Utiliser des numéros de version de manière cohérente
  • Conserver les tailles des bundles petites pour des téléchargements plus rapides
  • Surveiller les taux de réussite des mises à jour

Étapes suivantes

Étape suivante

Si vous utilisez Démarrage pour planifier le travail de plugin natif, le connecter avec En utilisant @capgo/capacitor-mise-à-jour pour la capacité native dans En utilisant @capgo/capacitor-mise-à-jour, Répertoire de Plugin Capgo pour le flux de travail du produit dans Répertoire de Plugin Capgo, Plugins Capacitor par Capgo pour le détail d'implémentation dans Plugins Capacitor par Capgo, Ajouter ou Mettre à Jour les Plugins pour le détail d'implémentation dans Ajouter ou Mettre à Jour les Plugins, et Alternatives de Plugin d'Entreprise Ionic pour le flux de travail du produit dans Alternatives de Plugin d'Entreprise Ionic.