Zum Hauptinhalt springen
Migration

Migration von App Center zu Capgo

In diesem Leitfaden gehen wir auf die vollständige Migration für Capgo Live Updates ein, eine Alternative zu Microsoft CodePush.

Martin Donadieu

Martin Donadieu

Content-Marketing-Beauftragter

Migration von App Center zu Capgo

Zusammenfassung der Migration

  • Capgo ist ein Dienst, der Entwicklerteams dabei hilft, live-Apps an bereitgestellte Apps zu senden.
  • Capacitor ermöglicht die Migration von JS-Anwendungen, die in jQuery Mobile, Framework 7, Sencha, KendoUI, Ionic oder sogar einer eigenen Custom-Lösung geschrieben sind. Ein bestehendes Ionic-App ist nicht erforderlich..
  • Colt bietet äquivalente Dienste für App Center Build (Erstellung von Android- und iOS-Anwendungen). Für Test-, Diagnose- und Analytics-Dienste.
Hinweis

Wenn Ihr App noch Cordova verwendet, ist es notwendig, zuerst auf Capacitor zu migrieren bevor Sie auf Capgo migrieren.

Mit Capacitor ermöglicht die Ionic-Team eine spirituelle Nachfolge zu Cordova, Capacitor ermöglicht es, das Entwickeln nahe an die nativen Werkzeuge und -Fähigkeiten zu bringen, mit dem Ziel, einen noch besseren Benutzererlebnis und Leistung zu bieten.

Glücklicherweise ist der Migrationsprozess einfach und die meisten Cordova-Plugins sind mit Capacitor rückwärts kompatibel. Hier beginnen Sie mit der Migration.

Über Capgo

Capgo übernimmt die Aktualisierung von Apps im Laufe der Zeit. Entwicklungsteams können sich voll und ganz auf die einzigartigen Funktionen ihrer App konzentrieren und den komplexen App-Delivery-Prozess auf Capgo auslagern.

Füllt Capgo die Lücken zwischen Web-Delivery und Mobilfunk.

Capgo Voraussetzungen

Ähnlich wie App Center, Capgo Unterstützt GitHub-Anwendungen, die in Git-Repositorys auf Azure DevOps, Bitbucket, GitHub, und GitLab gehostet werden.

Installieren Sie Capgo CLI

Hinweis

Stellen Sie sicher, dass Sie Node und NPM auf Ihrem Computer installiert haben, bevor Sie fortfahren. Verwenden Sie immer die aktuelle LTS-Version. __CAPGO_KEEP_0__ verwenden Sie keine älteren Versionen. Capgo do not older versions.

und __CAPGO_KEEP_0__ Konfigurationsdateien package.json and Capacitor config files

Hinweis

Bevor Sie beginnen, empfehle ich Ihnen, Änderungen auf einer frischen Git-Branche vorzunehmen.

Da Capgo wurde capacitor erstellt, um capacitor-Anwendungen zu automatisieren, benötigt es eine Datei, die Ihre Anwendung möglicherweise nicht hat. Erstellen Sie zunächst eine capacitor.config.json Datei. Der einfachste Weg, sie zu erstellen, besteht darin, in der Wurzel Ihrer Anwendung zu laufen:

npm install @capacitor/core

Initialisieren Sie dann Capacitor mithilfe des CLI-Fragebogens:

npx cap init

Der CLI wird Ihnen einige Fragen stellen, beginnend mit dem Namen Ihrer Anwendung und der Paket-ID, die Sie für Ihre Anwendung verwenden möchten.

Schließlich müssen Sie die neuen Dateien in Ihrem Projekt committen:

git add .git commit -m "added package json and capacitor config" && git push

Migrieren Sie die Code

Nachdem Sie die neuen erforderlichen __CAPGO_KEEP_0__ haben Migrieren Sie die Capgo Dateien sind im Ort, Sie können unsere Aufmerksamkeit auf das eigentliche App selbst richten. Capgo erwartet, dass die gesamte gebaute App innerhalb eines Verzeichnisses namens dist.

Wenn Ihre gebaute code nicht in einem dist Verzeichnis ist, ändern Sie diesen Wert im Capacitor Konfigurationsdatei.

Hier ist, was die App-Verzeichnisstruktur aussehen sollte:

App-Struktur

Capgo-Konfiguration

Mit Ihrer App bereit für Capgo Integration, ist es Zeit sich anzumelden und Ihre API-Schlüssel, um Ihre erste Version hochzuladen! Beginnen Sie mit dem Anmelden für ein Capgo-Konto.

Navigieren Sie, sobald Sie sich bei Capgo angemeldet haben, zur Konto-Seite und klicken Sie auf die API Taste, dann klicken Sie auf die 'Schreibe'-Taste, um sie in Ihre Zwischenablage zu kopieren.

Installieren Sie das Capgo SDK

Aus einer Befehlszeile heraus, direkt im Root-Ordner Ihres Capacitor-Anwendungsordners, führen Sie den folgenden Befehl aus:

npm i @capgo/capacitor-updater && npx cap sync Um die Erweiterung in Ihre Capacitor-Anwendung zu installieren.

Und fügen Sie dann zu Ihrer Anwendung diesen code als Ersatz für CodePush ein:

import { CapacitorUpdater } from '@capgo/capacitor-updater'

CapacitorUpdater.notifyAppReady()

Dies wird dem native Plugin mitteilen, dass die Installation erfolgreich war.

Live-Updates (Alternative zu CodePush)

Die Live-Update-Funktion funktioniert, indem sie das installierte Capgo SDK in Ihrer native Anwendung verwendet, um auf eine bestimmte Deploy-Kanal-Zielgruppe zu hören. Wenn eine Web-Ausgabe einer Kanal-Zielgruppe zugewiesen wird, wird diese Aktualisierung an Benutzergeräten ausgeführt, die auf die angegebene Kanal-Zielgruppe konfiguriert sind.

Anmelden bei Capgo CLOUD

Zunächst verwenden Sie das all API-Schlüssel ist in Ihrem Konto vorhanden, um sich mit CLI: anzumelden

npx @capgo/cli@latest login YOURKEY

Hinzufügen Ihres ersten Apps

Lassen Sie uns mit der Erstellung der App in Capgo Cloud beginnen, mit der CLI.

npx @capgo/cli@latest app add

Diese Kommando verwendet alle in der Capacitor Konfigurationsdatei definierten Variablen, um die App zu erstellen.

Hochladen Ihres ersten Bundles

Führen Sie den Befehl aus, um Ihr code zu bauen und es an Capgo zu senden mit:

npx @capgo/cli@latest bundle upload --channel production

Standardmäßig wird der Versionsname der in Ihrem package.json Datei sein.

Überprüfen Sie in Capgo ob das Build vorhanden ist.

Sie können es sogar mit meinem mobil-fähigen Sandbox-App.

Standardkanal einrichten

Nachdem Sie Ihre App an Capgo gesendet haben, müssen Sie Ihren Kanal default um Apps Updates von Capgo zu erhalten.

npx @capgo/cli@latest channel set production -s default

Konfigurieren Sie die App, um Updates zu validieren

Fügen Sie diese Konfiguration in Ihr Haupt-JavaScript-File ein.

import { CapacitorUpdater } from '@capgo/capacitor-updater'

CapacitorUpdater.notifyAppReady()

Dann führen Sie ein npm run build && npx cap copy aus, um Ihre App zu aktualisieren.

Live-Update auf einem Gerät empfangen

Um Ihre Anwendung live von Deploy aktualisieren zu können, müssen Sie die App auf einem Gerät oder einem Emulator ausführen. Der einfachste Weg, dies zu tun, besteht darin, einfach die folgende Kommandozeilenanweisung auszuführen, um Ihre lokale App in einem Emulator oder einem mit Ihrem Computer verbundenen Gerät zu starten.

npx cap run [ios | android]

Öffnen Sie die App, stellen Sie sie in den Hintergrund und öffnen Sie sie erneut, Sie sollten im Protokoll sehen, dass die App die Aktualisierung durchgeführt hat.

Hat ab! Sie haben Ihr erstes Live-Update erfolgreich implementiert. Dies ist nur der Anfang dessen, was Sie mit Live-Updates erreichen können. Um mehr zu erfahren, besuchen Sie die vollständigen Live-Updates-Dokumentation.

Entfernen Sie Abhängigkeiten von App Center

Nachdem wir Capgo’s Dienste integriert haben, sollten Sie alle Verweise auf App Center entfernen. Neben der Praxis, nicht verwendete code/Dienste zu entfernen, sollte die Entfernung der SDK die Größe Ihrer Apps reduzieren.

Zuerst öffnen Sie ein Terminal und deinstallieren Sie die App Center-Plugins:

    cordova plugin remove cordova-plugin-appcenter-analytics cordova-plugin-appcenter-crashes cordova-plugin-code-push

Öffnen Sie als Nächstes config.xml und entfernen Sie die folgenden preference Werte. Sie werden ähnlich aussehen wie:

    <preference name="APP_SECRET" value="0000-0000-0000-0000-000000000000" /><preference name="CodePushDeploymentKey" value="YOUR-ANDROID-DEPLOYMENT-KEY" /><preference name="CodePushPublicKey" value="YOUR-PUBLIC-KEY" />

Wenn Sie App Center Analytics in Ihrer App verwendet haben, entfernen Sie die folgenden preferences Elemente: APPCENTER_ANALYTICS_ENABLE_IN_JS und APPCENTER_CRASHES_ALWAYS_SEND.

Entfernen Sie die folgenden <access /> Elemente:

    <access origin="https://codepush.appcenter.ms" /><access origin="https://codepush.blob.core.windows.net" /><access origin="https://codepushupdates.azureedge.net" />

Entfernen Sie die Referenz auf CodePush in der CSP meta Tag in dem Datei ( index.html Schließlich entfernen Sie innerhalb Ihrer App alle __CAPGO_KEEP_0__-Referenzen auf App Center-Dienste, wie z.B. https://codepush.appcenter.ms):

    <meta http-equiv="Content-Security-Policy" content="default-src https://codepush.appcenter.ms 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *" />

Finally, within your app, remove any code references to App Center services, such as codePush.sync();.

Sie haben sich von App Center auf __CAPGO_KEEP_0__ migriert und nutzen die Live-Updates. Dies ist nur der Anfang dessen, was Sie mit __CAPGO_KEEP_1__ tun können. Erforschen Sie den Rest der Dienste, einschließlich Kanal (Mehrere Umgebungen) und Überschreiben. Cloud __CAPGO_KEEP_2__-Integration, verwenden Sie __CAPGO_KEEP_3__ innerhalb Ihres CI/CD-Plattformen Ihrer Wahl (z.B. __CAPGO_KEEP_4__-Action, GitLab, Jenkins und mehr).

You’ve migrated from App Center to Capgo, utilizing the Live Updates. This is just the beginning of what you can use Capgo for. Explore the rest of the service includes Channel (multiple environments) and override. Cloud CLI integration, use Capgo inside your CI/CD platform of choice (such as GitHub Action, GitLab, Jenkins, and more).

Wenn Ihr __CAPGO_KEEP_0__ auf __CAPGO_KEEP_1__ gehostet ist, können Sie die automatische Build- und Release-Konfiguration in wenigen Schritten durchführen, dank __CAPGO_KEEP_2__-Aktionen.

If your code is hosted on GitHub, you can set up automatic build and release in a few more steps, thanks to GitHub actions.

Kredits

Vielen Dank an

I have made a second article to allow you to so. IonicBasierend auf diesem Artikel Dieser Artikel wurde mit Chat-GPT-3 neu verfasst und angepasst.

Weitermachen von Migrating from App Center zu Capgo

Wenn Sie __CAPGO_KEEP_0__ verwenden Migrating from App Center zu Capgo um die Migration und die Unternehmensoperationen zu planen und zu verbinden, verbinden Sie es mit Capgo Enterprise für den Produktworkflow in Capgo Enterprise für den Produktworkflow in Ionic Enterprise Plugin Alternativen für den Produktworkflow in Ionic Enterprise Plugin Alternativen] Capgo Alternativen für den Produktworkflow in Capgo Alternativen Capgo Beratung für den Produktworkflow in Capgo Beratung und Capgo Premium Support für den Produktworkflow in Capgo Premium Support.

Live-Updates für Capacitor-Apps

Wenn ein Bug im Web-Schicht lebt, liefern Sie die Reparatur über Capgo anstatt Tage auf die Genehmigung des App-Stores zu warten. Die Benutzer erhalten das Update im Hintergrund, während native Änderungen im normalen Review-Path bleiben.

Hilfe von Martin

Los geht's

Neueste aus unserem Blog

Capgo gibt Ihnen die besten Einblicke, die Sie benötigen, um eine wirklich professionelle mobile App zu erstellen.