跳过主要内容
CI/CD

使用Codemagic自动构建Capacitor IOS

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

马丁·多纳迪厄

马丁·多纳迪厄

内容营销人员

Automatic Capacitor IOS build with Codemagic

使用 Codemagic 实现 iOS 持续交付

前提条件

继续教程之前…

  • iOS 开发者计划会员资格
  • 愿意阅读 😆…

价格的重要性

Codemagic Action 的价格

https://codemagic.io/pricing/

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

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

📣 在文章中,我们假设我们已经在iTunes Connect中创建了应用,我们有Apple生态系统的证书,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 有助于确保您是唯一能够访问帐户的人。
来自 Apple 支持

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

要求

要使用 App Store Connect API,Codemagic 需要 三个 事物。

  1. 发行者 ID。
  2. 密钥 ID。
  3. 密钥文件或密钥内容。

创建 App Store Connect API 密钥

要生成密钥,您必须在 App Store Connect 中具有管理员权限。如果您没有该权限,请将相关人员指向此文章并遵循以下说明。

1 — 登录到 App Store Connect.

2 — 选择 用户和访问.

App Store Connect 用户访问

3 — 选择 API 密钥选项卡

App Store Connect API Keys

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

App Store Connect API 密钥创建

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

App Store Connect API 密钥创建名称

6 — 点击生成。

一个 API 密钥的访问权限无法限制到特定的应用。

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

App Store Connect 下载密钥

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

🔴 在安全的地方存储您的私钥。您不应共享您的密钥,存储密钥在 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 > 团队 并选择您的团队。

Code signing identities

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

Apple Distribution

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

然后您需要去钥匙串下载证书作为 .p12 文件

要做到这一点,您需要切换到 登录 __CAPGO_KEEP_0__和然后再打开标签 我的证书.

我的证书

然后你可以选择你想下载的证书(按证书的日期排列)

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

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

这将下载证书作为 .p12 文件

配置文件

打开 Apple Developer 选择合适的团队

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

创建新配置文件

并选择 App Store Connect.

选择 App Store Connect

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

选择正确的应用程序

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

选择正确的证书

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

配置文件的名称将用于在 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签名证书(框架内的绿色勾选标记)或否。 证书 Adding the provisioning profile

3. 配置 Codemagic

配置 Codemagic 秘密

你曾经想知道这些值是从哪里来的? ENV 好吧,不是秘密了 – 这是来自你的项目的秘密。 🤦

4. 配置 Codemagic 工作流文件

在项目根目录创建一个名为 codemagic.yml 的文件并添加以下内容。

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

This workflow should be triggered manually or after each GitHub 标签后触发,如果你需要自动化标签,请参见 Automatic build and release with GitHub actions 进行自动化构建和发布

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

每次您发送一个新的标签,TestFlight 中将会构建一个发布。

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

5. 触发工作流程

触发工作流程

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

使用的提交

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

Testflight 控制台

手动启动

您可以手动启动工作流程。

首先选择您要构建的应用,然后点击 开始新建.

选择应用

然后选择您要构建的分支。

选择分支

然后点击 开始新建.

然后前往构建列表

构建列表

然后点击构建以查看结果。

构建结果

Can deploy from local machine

是的,您可以,而且这非常简单。

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

感谢

本博客基于以下文章:

从Codemagic的自动Capacitor IOS构建中继续

如果您正在使用 Codemagic的自动Capacitor IOS构建 来规划CI/CD自动化,连接它 Capgo CI/CD 为产品工作流程在 Capgo CI/CD 中 Capgo 原生构建 为产品工作流程在 Capgo 原生构建 中 Capgo 集成 为产品工作流程在 Capgo 集成 中 CI/CD 集成 CI/CD 集成的实现细节 GitHub Actions 集成 for the implementation detail in GitHub Actions Integration.

为 Capacitor 应用提供实时更新

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

立即开始

最新博客

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