跳过主要内容
迁移

从 App Center 迁移到 Capgo

在本指南中,我们将逐步完成从 Capgo Live Updates 到 Microsoft CodePush 的迁移。

马丁·多纳迪尤

马丁·多纳迪尤

内容营销人员

从 App Center 迁移到 Capgo

迁移总结

  • Capgo 帮助开发团队将实时应用部署到已部署应用的服务。
  • Capacitor 支持将 jQuery Mobile、Framework 7、Sencha、KendoUI、Ionic 或自定义解决方案编写的 JS 应用进行迁移。.
  • 不需要现有 Ionic 应用。 Colt
提供 App Center Build (构建 Android/iOS 应用) 的等效服务。

注意 migrate to Capacitor 先迁移到 Capgo

然后才能迁移到 Capacitor。

幸运的是,迁移过程很容易,大多数Cordova插件与Capacitor兼容。 开始迁移.

关于Capgo

Capgo处理应用程序随时间的更新。开发团队可以专注于应用程序的独特功能,并将复杂的应用程序交付过程外包给Capgo。

Capgo填补了Web交付和移动之间的空白。

Capgo的先决条件

像App Center一样 Capgo 支持在Azure DevOps、Bitbucket、GitHub和GitLab上的Git存储库中托管的应用程序。

安装Capgo CLI

注意

在开始之前,您需要在计算机上安装Node和NPM。始终使用 当前 LTS 版本 Capgo 不要使用旧版本。

创建 package.json 并 Capacitor 配置文件

注意

在开始之前,我建议在一个新的 Git Branch 上进行更改。

由于 Capgo 创建了 capacitor 应用程序的自动化,因此它需要一个文件,这可能是您的应用程序没有的。首先,创建一个 capacitor.config.json 文件。创建它的最简单方法是在应用程序根目录中运行:

npm install @capacitor/core

然后,使用 CLI 问卷初始化 Capacitor:

npx cap init

CLI 将会问你几个问题,包括你的应用程序名称,以及你希望使用的应用程序 ID。

最后,提交新文件到您的项目:

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

迁移的Code

现在您已经拥有了新需要的文件 Capgo 文件已经放在位子上了,您可以转移注意力到实际的应用本身。 Capgo 期望整个构建好的应用程序都放在一个名为 dist.

如果您的构建好的code不在一个 dist 目录中,请在Capacitor配置文件中修改这个值。

这是应用程序目录结构应该是什么样的:

应用程序结构

Capgo配置

With your app ready for Capgo integration, it’s time to sign up, and get your API key to upload your first version! Begin by Capgo.

Once you’re logged into Capgo, navigate to the Account page then click on API key, then click on the ‘write’ key to copy it to your clipboard.

Install the Capgo SDK

Capacitor

npm i @capgo/capacitor-updater && npx cap sync To install the plugin into your Capacitor app.

And then add to your app this code as replacement of CodePush one:

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

CapacitorUpdater.notifyAppReady()

__CAPGO_KEEP_0__

后,导航到账户页面,点击

__CAPGO_KEEP_1__ Capgo SDK 在您的本机应用程序中监听特定部署通道目的地。 当一个 Web 构建被 assignment 到一个通道目的地时,更新将会被部署到运行配置为监听指定通道目的地的设备的用户设备。

登录到 Capgo CLOUD

首先使用 all apikey 在您的帐户中存在的apikey来使用 CLI 登录:

npx @capgo/cli@latest login YOURKEY

添加您的第一个应用

让我们从创建应用程序在 Capgo Cloud 中开始,使用 CLI。

npx @capgo/cli@latest app add

此命令将使用 Capacitor 配置文件中定义的所有变量来创建应用程序。

上传您的第一个捆绑包

运行命令来构建您的 code 并将其发送到 Capgo:

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

默认情况下,版本名称将是您的 package.json 文件.

检查入 Capgo 如果构建存在.

您甚至可以使用我的移动沙盒应用测试它. 设置默认渠道.

您已经将应用发送到__CAPGO_KEEP_0__后,需要将您的渠道设置为

让应用接收来自Capgo的更新. default to let apps receive updates from Capgo.

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

将此配置添加到主JavaScript文件.

然后执行

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

CapacitorUpdater.notifyAppReady()

然后执行 npm run build && npx cap copy 为了更新您的应用程序。

在设备上接收实时更新

为了让您的应用程序从 Deploy 接收实时更新,您需要在设备或模拟器上运行应用程序。使用以下命令启动本地应用程序在模拟器或连接到计算机的设备上运行是最简单的方法。

npx cap run [ios | android]

打开应用程序,放到后台,然后再次打开应用程序,您应该在日志中看到应用程序已经更新。

恭喜! 🎉 您成功部署了第一个实时更新。这只是您可以使用实时更新的开始。要了解更多信息,请查看完整的 实时更新文档.

移除应用中心依赖项

我们已经集成了 Capgo 的服务后,您应该移除任何应用中心的引用。除了移除未使用的 code/services 是最佳实践外,移除 SDK 还可以减少应用程序的大小。

首先,打开终端,然后卸载应用中心插件:

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

接下来,打开 config.xml 并删除以下 preference 值。它们将类似于:

    <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" />

If you were using App Center Analytics in your app, remove the following preferences 元素: APPCENTER_ANALYTICS_ENABLE_IN_JSAPPCENTER_CRASHES_ALWAYS_SEND.

移除以下 <access /> 元素:

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

移除 CSP 中的 CodePush 引用 meta 标签在 index.html 文件(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 *" />

最后,在您的应用程序中,移除任何 code App Center 服务的引用,例如 codePush.sync();.

下一步

您已经从 App Center 迁移到 Capgo,利用了实时更新。这只是您可以使用 Capgo 的开始。探索服务的其他功能,包括 Channel(多个环境)和覆盖。Cloud CLI 集成,使用 Capgo 在您的 CI/CD 平台(例如 GitHub 动作,GitLab,Jenkins 等)中

自动发送应用程序更新

如果您的code托管在GitHub上,您可以在几步之内设置自动构建和发布,感谢GitHub动作。

我已经写了第二篇文章,允许您这样做。

致谢

非常感谢 Ionic,这篇文章基于 这篇文章 使用Chat-GPT-3重写并适配。

从App Center迁移到Capgo

如果您正在使用 从App Center迁移到Capgo 来规划迁移和企业运营,连接它 Capgo 企业版 为 Capgo 企业版中的产品工作流程 Ionic 企业插件替代品 为 Ionic 企业插件替代品中的产品工作流程 Capgo 替代品 为 Capgo 替代品中的产品工作流程 Capgo 咨询 为 Capgo 咨询中的产品工作流程和 Capgo 高级支持 为 Capgo 高级支持中的产品工作流程。

Capacitor 实时更新

当 web 层 bug 活跃时,通过 Capgo 将修复推送给用户,而不是等待几天的应用商店审批。用户在后台接收更新,而原生变化保持在正常审批路径中。

立即开始

最新博客文章

Capgo 为您提供创建真正专业的移动应用所需的最佳见解。