跳过主要内容
CI/CD

使用Codemagic实现自动Capacitor IOS构建

如何在5分钟内使用Codemagic和Codemagic设置IOS Ionic应用的CI/CD管道(2024)

马丁·多纳迪厄

马丁·多纳迪厄

内容营销人员

使用Codemagic实现自动Capacitor IOS构建

使用Codemagic实现iOS的持续交付

前提条件

继续教程之前,请注意…

  • 拥有iOS开发者计划会员资格
  • 想看吗 😆…

关于价格的重要提示

价格Codemagic Action

https://codemagic.io/pricing/

该服务是 ‘免费的’ 每月500个macOS M1分钟,取决于选择的机器.
我们将使用一个 macOS M1 机器,截图中可以看到其价格和限制(价格截至教程创建时间,可能会在未来发生变化)

🔴 一旦提醒了要求和价格,如果您喜欢,我们继续…

📣 在这篇文章中,我们假设我们已经在iTunes Connect中创建了应用,我们已经拥有了苹果生态系统的证书,Codemagic将为我们设置一切!

让我们开始探索 🤿

本文的步骤

  1. 使用 App Store Connect API 与 Codemagic
  2. 要求
  3. 创建 App Store Connect API 密钥
  4. 使用 App Store Connect API 密钥
  5. 复制 Fastlane 文件
  6. 配置 Codemagic

1. 使用 App Store Connect API 与 Codemagic

从 2021 年 2 月开始,所有用户必须使用两步验证或两因素身份验证登录 App Store Connect。这种额外的安全层对于您的 Apple ID 有助于确保您是唯一可以访问帐户的人。
来自 苹果支持

开始使用 match 需要撤销您的现有证书。但是,不用担心,您将直接获得新的证书。

需求

为了能够使用 App Store Connect API, Codemagic 需要 三个 证书颁发者 ID。

  1. 密钥 ID。
  2. 密钥文件或密钥内容。
  3. 创建 App Store Connect __CAPGO_KEEP_0__ 密钥

Creating an App Store Connect API Key

1 — 登录到

App Store Connect App Store Connect.

2 — 选择 用户和访问.

App Store Connect 用户访问

3 — 选择 API 密钥选项卡。

App Store Connect API 密钥

4 — 点击生成 API 密钥或添加 (+) 按钮。

App Store Connect API 密钥创建

5 — 输入密钥名称并选择访问级别。我们建议选择 App Manager 访问权限,了解更多关于 Apple Developer Program 角色权限 这里

App Store Connect API 密钥创建名称

6 — 点击生成。

一个 API 的访问权限不能被限制到特定的应用程序。

新建的 __CAPGO_KEEP_0__ 的名称、__CAPGO_KEEP_0__ ID、下载链接和其他信息将出现在页面上。

App Store Connect 下载密钥

获取以下三个必要信息: <1> 问题 ID。
<2> __CAPGO_KEEP_0__ ID。
<3> 点击“下载 API 密钥”以下载您的 API 私有密钥。下载链接仅在私有密钥尚未下载时才会出现。Apple 不会保留私有密钥的副本。因此,您只能下载一次。

🔴 请将您的私有密钥存储在安全的地方。您不应共享您的密钥、将密钥存储在 code 仓库中或将密钥包含在客户端 code 中。

将 App Store Connect API 密钥添加到 Codemagic

  1. 打开您的 Codemagic 团队设置 选择团队集成 打开团队 选择 code 签名身份 选择 code 签名身份 并上传证书 上传证书

  2. 点击 添加密钥 按钮。

  3. 输入 App Store Connect API key name。 这是用于在应用设置中引用密钥的可读人名。

  4. 输入 Issuer IDKey ID 值。

  5. 点击 选择一个 .p8 文件 或将文件拖拽到上传 App Store Connect API 密钥

  6. 点击 保存.

现在我们可以使用 App Store Connect API 密钥管理 Codemagic,太棒了!

2. 创建证书和配置文件

证书

打开 XCode 并前往 设置 > > > Apple ID > Teams 选择您的团队。

Code 签名身份

点击 管理证书 > + 选择 Apple Distribution.

Apple Distribution

然后您可以创建一个新证书。

然后你需要去到钥匙串中下载证书作为一个 .p12 文件。

要做到这一点,你需要去到钥匙串切换到 登录 钥匙串 我的证书.

我的证书

然后你可以选择你要下载的证书。 (通过证书的日期来查找)

然后右击证书并选择 导出.

选择文件格式 个人信息交换 (.p12).

将下载证书作为 .p12 一个文件。

配置文件

打开 苹果开发者 并选择正确的团队。

然后创建一个新的配置文件,点击 +

创建一个新的配置文件

并选择 App Store Connect.

选择 App Store Connect

然后您需要选择正确的应用程序,注意您不能使用通配符否则签名会失败。

选择正确的应用

选择之前创建的正确证书(查找有效期,应与今天相同的日期和月份)并点击 继续.

选择正确的证书

最后输入配置文件的名称并点击 生成.

配置文件的名称将用于在 Codemagic 中识别配置文件。

生成配置文件

您可以将配置文件下载为一个 .mobileprovision 文件。

下载配置文件

添加Code签名证书

Codemagic允许您上传code签名证书作为包含证书和私钥的PKCS#12存档。上传时,Codemagic将要求您提供证书密码(如果证书受密码保护),以及一个唯一的 参考名称,然后可以在 codemagic.yaml 配置中使用它来获取特定的文件。

  • 上传证书
  • 生成新证书
  • 从开发者门户获取
  1. 打开您的Codemagic团队设置,前往 codemagic.yaml设置 > Code签名身份.
  2. 打开 iOS 证书 选项卡。
  3. 通过点击上传证书文件 选择一个 .p12 或 .pem 文件 或将其拖拽到指示的框架中。
  4. 输入 证书密码 并选择一个 参考名称.
  5. 点击 添加证书

添加分发配置文件

Codemagic允许您上传一个用于应用程序的配置文件,或从Apple Developer Portal中获取一个配置文件。

添加到Code签名身份中的配置文件的类型、团队、包ID和过期日期将被显示。另外,Codemagic将告知您是否在code签名身份中有匹配的Code签名证书(签名身份字段中的绿色勾选)或没有。 证书 3. 配置Codemagic

配置Codemagic密钥

您是否曾经想知道

的值是从哪里来的?答案不再是秘密了,它来自您的项目的密钥。 🤦 ENV 4. 配置Codemagic工作流文件

创建一个名为

的文件并将其放在您的项目的根目录中,然后添加以下内容。 codemagic.yml 这个工作流应该在手动或每次__CAPGO_KEEP_0__后触发。

workflows:
  ionic-capacitor-ios-workflow:
    name: Capacitor iOS Workflow
    max_build_duration: 120
    instance_type: mac_mini_m1
    integrations:
      app_store_connect: CodeMagic
    environment:
      ios_signing:
        distribution_type: app_store
        bundle_identifier: YOUR_BUNDLE_IDENTIFIER
      vars:
        XCODE_WORKSPACE: ios/App/App.xcworkspace
        XCODE_SCHEME: App
        APP_STORE_APP_ID: YOUR_APP_STORE_APP_ID
      node: v20.14.0
      xcode: 15.4
      cocoapods: default
    triggering:
      events:
        - tag
      tag_patterns:
        - pattern: '*'
          include: true
    scripts:
      - name: Install dependencies
        script: |
          npm install
      - name: Cocoapods installation
        script: |
          cd ios/App && pod install
      - name: Update dependencies and copy web assets to native project
        script: |
          npm run build
          npx cap sync ios
      - name: Set up code signing settings on Xcode project
        script: |
          xcode-project use-profiles
      - name: Increment build number
        script: |
          cd $CM_BUILD_DIR/ios/App
          LATEST_BUILD_NUMBER=$(app-store-connect get-latest-app-store-build-number "$APP_ID")
          agvtool new-version -all $(($LATEST_BUILD_NUMBER + 1))
      - name: Build ipa for distribution
        script: |
          xcode-project build-ipa \
            --workspace "$XCODE_WORKSPACE" \
            --scheme "$XCODE_SCHEME"
    artifacts:
      - build/ios/ipa/*.ipa
      - /tmp/xcodebuild_logs/*.log
      - $HOME/Library/Developer/Xcode/DerivedData/**/Build/**/*.app
      - $HOME/Library/Developer/Xcode/DerivedData/**/Build/**/*.dSYM
    publishing:
      email:
        recipients:
          - YOUR_EMAIL
        notify:
          success: true # To not receive a notification when a build succeeds
          failure: false # To not receive a notification when a build fails
      app_store_connect:
        auth: integration
        # Configuration related to TestFlight (optional)
        # Note: This action is performed during post-processing.
        submit_to_testflight: true
        # Configuration related to App Store (optional)
        # Note: This action is performed during post-processing.
        submit_to_app_store: false

GitHub 标签, 如果您需要自动化标签,请参阅 自动构建和发布与 GitHub 动作 首先。

然后,这个工作流程将拉取您的 NodeJS 依赖项,安装它们并构建您的 JavaScript 应用程序。

每次您发送一个新标签,测试飞行中的一个发布将被构建。

您的应用程序不需要使用Ionic,只需 Capacitor 基础即可,且可以使用旧的Cordova模块,但 Capacitor JS插件应优先使用。

5. 触发工作流程

触发工作流程

推送新提交到分支 maindevelopment 触发工作流程

开始了一个提交

几分钟后,构建应该在您的 App Store Connect 控制台中可用。

Testflight 控制台

手动启动

您可以手动启动工作流。

首先选择要构建的应用,然后点击 上下文:Capgo Builder / 原生云构建产品页面。角色:短 UI 标签或导航项。消息键 `native_build_builder_credit_first` (原生构建构建者首先)。.

开始新构建

选择应用

然后选择要构建的分支。

选择分支 然后点击.

然后去你构建列表

构建列表

并点击构建以查看结果

构建结果

可以从本地机器部署

是的,你可以,而且这很容易

你可以使用Xcode来构建和签署你的应用,正如往常一样

感谢

本博客基于以下文章

继续使用自动化Capacitor IOS构建与Codemagic

如果您正在使用 自动化Capacitor IOS构建与Codemagic 将其与__CAPGO_KEEP_0__ CI/CD 连接到产品工作流程中的Capgo CI/CD Capgo Native Builds 用于产品工作流程中的Capgo Native Builds Capgo Integrations 用于产品工作流程中的Capgo Integrations for the product workflow in Capgo Integrations, 用于CI/CD集成的实施细节 用于CI/CD集成的实施细节 GitHub Actions Integration 为 GitHub Actions Integration 的实现细节。

Live updates for Capacitor apps

当 web-layer bug 活跃时,通过 Capgo 直接将修复推送给用户,而不是等待 App Store 审核几天。用户在后台接收更新,而原生变化仍在正常审查路径中。

Get Started Now

最新博客

Capgo 给您所需的最佳见解,帮助您创建真正专业的移动应用。

2-Way Communication in Capgo Apps