メインコンテンツにジャンプします
CI/CD

Codemagicを使用した自動Capacitor IOSビルド

CodemagicとCodemagicを使用して5分でIOS IonicアプリのCI/CDパイプラインを設定する方法 (2024)

記事のクレジット

マーティン・ドナディュー

ライター

ヴァレリア

レビュアー

ジョーダン

編集者

Codemagicを使用した自動Capacitor IOSビルド

iOS向けの継続的なデリバリーをCodemagicで

前提条件

チュートリアルを続ける前に…

  • 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にサインインするために2要素認証または2段階認証が必要です。この追加のセキュリティ機能により、Apple IDのアクセス権を保証するのに役立ちます。
From Apple Support

matchの使用を開始するには、既存の証明書を削除する必要がありますが、心配はいりません。新しい証明書が直接提供されます。

Requirements

App Store Connect API を使用するには、Codemagic が必要な 3 つのものがあります。 3 発行者 ID。

  1. キー ID。
  2. キー ファイルまたはキー コンテンツ。
  3. __CAPGO_KEEP_0__

App Store Connect API Keyの作成

App Store Connectのキーを生成するには、Adminの権限が必要です。権限がない場合は、この記事を参照し、以下の手順に従ってください。

1 — App Store Connectにログイン App Store Connect.

2 — "ユーザーとアクセス"を選択 App Store Connectのユーザーとアクセス.

3 — __CAPGO_KEEP_0__ Keysタブを選択

App Store ConnectのAPI Keys

4 — "API Keyを生成"または(+)ボタンをクリック

App Store ConnectのAPI キーを作成

App Store Connect API keys create

App Store Connectの__CAPGO_KEEP_0__ キーを作成 App Manager Apple Developer Programのロール権限について詳しく知りたい場合は、権限のアクセス権を参照してください。 ここ

App Store Connect API キーを作成する名前

6 — 生成をクリックしてください。

API キーのアクセス権は、特定のアプリに制限することができません。

新しいキーの名前、キーアイデンティティ、ダウンロードリンク、他の情報がページに表示されます。

App Store Connectからキーをダウンロード

必要な情報をすべてここに取得してください: <1> Issue ID.
<2> Key ID.
<3> API プライベートキーをダウンロードするには、「ダウンロード API キー」をクリックしてください。ダウンロードリンクは、プライベートキーがまだダウンロードされていない場合にのみ表示されます。Appleはプライベートキーのコピーを保管していないため、プライベートキーを一度だけダウンロードできます。

🔴 Store your private key in a safe place. You should never share your keys, store keys in a code repository, or include keys in client-side code.

App Store Connect API キーをCodemagicに追加

  1. Codemagic Teamの設定を開いてください チーム統合を選択 チームを開いてください codeの署名IDを選択 codeの署名IDを選択 証明書をアップロードしてください 証明書をアップロード

  2. ボタンをクリック キーを追加 ボタンをクリック

  3. キー名を入力してください。 このキー名は、後でアプリケーションの設定で参照するときに使用されます。 App Store Connect API key nameボタンをクリック

  4. Enter the Issuer IDKey ID values.

  5. Click on .p8ファイルを選択 or drag the file to upload the App Store Connect API key downloaded earlier.

  6. Click Save.

Now we can manage Codemagic with the App Store Connect API key, great!

Page/area: Capgo marketing website. Role: Short UI label or navigation item. Message key `save` (Save).

Now we can manage Codemagic with the App Store Connect __CAPGO_KEEP_0__ key, great!

2. Create certificates and provisioning profiles 設定 > アカウント > Apple ID > チーム とチームを選択してください。

Code署名のID

クリックしてください 証明書を管理 > + と選択 Apple Distribution.

Apple Distribution

すると新しい証明書を作成できます。

すると証明書をダウンロードするためにキーチェーンに移動する必要があります。 .p12 証明書をファイルとしてダウンロードするには、キーチェーンに移動し、ログイン

キーチェーンのタブに切り替えます。 マイ・サertificate マイ・サertificate すると、ダウンロードしたい証明書を選択できます。(証明書の日付で検索してください).

__CAPGO_KEEP_0__

__CAPGO_KEEP_1__

And then right-click on the certificate and select エクスポート.

ファイル形式を選択 Personal Information Exchange (.p12).

証明書がファイルとしてダウンロードされます。 .p12 プロビジョニング プロファイル

開く

Apple Developer チームを選択 次に、新しいプロファイルを作成するには、

プロファイルの作成 +

をクリックしてください。

And __CAPGO_KEEP_0__を選択 App Store Connect.

App Store Connectを選択

次に、正しいアプリを選択してください。注意してください。ワイルドカードを使用すると署名が失敗します。

正しいアプリを選択

正しい証明書を選択してください (有効期限の日付を確認してください。今日と同じ日と月でなければなりません) および 続行.

正しい証明書を選択

最後に、プロファイルの名前を入力し、 生成.

プロファイルの名前はCodemagicでプロファイルを識別するために使用されます。

プロファイルを生成

Capgoのプロファイルをダウンロードできます。 .mobileprovision ファイルとして。

プロファイルをダウンロード

Codeの署名証明書を追加

Codemagicでは、PKCS#12アーカイブに署名証明書と秘密鍵が含まれる場合、codeの署名証明書をアップロードできます。これをアップロードする際、Codemagicは証明書のパスワードを求めます(証明書がパスワード保護されている場合)。アップロードの際に、ユニークな 参照名,を指定する必要があります。これにより、特定のファイルを取得するために使用できる codemagic.yaml 設定を取得できます。

  • 証明書をアップロード
  • 新しい証明書を生成
  • 開発者ポータルから取得
  1. Codemagicチームの設定を開き、 コードマジック設定 > Code署名のID.
  2. 開く iOS証明書 タブ。
  3. 証明書ファイルをアップロードするには、次のボタンをクリックしてください。 または、指定されたフレームにドラッグしてください。 入力する
  4. 証明書パスワード と、 選択してください Reference name.
  5. クリック 証明書の追加

プロビジョニング プロファイルの追加

Codemagicでは、Apple Developer Portalからプロファイルを取得することもできます。

プロファイルのタイプ、チーム、バンドル ID、有効期限は、Code署名の識別子に追加された各プロファイルで表示されます。また、Codemagicは、code署名証明書がCode署名の識別子に存在する場合 (緑のチェックマークが表示される場合) または存在しない場合を知らせます。 証明書 3. Codemagicの設定

Codemagicのシークレットの設定

プロジェクトのシークレットから値が来ているのを気にしていたら、もう秘密ではない – それはプロジェクトのシークレットからです。 🤦

Ever wonder where the values of the __CAPGO_KEEP_0__ are coming from? Well, it’s not a secret anymore – it’s from your project’s __CAPGO_KEEP_1__. ENV Adding the provisioning profile

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

このワークフローは、手動でトリガーするか、各 GitHub タグの後で実行されるように設定してください。タグを自動化する必要がある場合は、 Automatic build and release with __CAPGO_KEEP_0__ actionsを参照してください。 Automatic build and release with GitHub actions 各タグを送信すると、テストフライトでリリースが作成されます。

アプリはIonicを使用する必要はありません。ただし、Capacitorベースが必須であり、古いCordovaモジュールを使用してもかまいませんが、Capacitor JS プラグインを使用することをお勧めします。

5. ワークフローをトリガーする

Your App doesn’t need to use Ionic, only Capacitor base is mandatory, it can have old Cordova module, but Capacitor JS plugin should be preferred.

__CAPGO_KEEP_1__

ワークフローをトリガーする

新しいコミットをブランチにプッシュする main または development Capacitorライブアップデートの代替手段を比較するページ

Capacitorライブアップデートの代替手段を比較するページ

Capacitorライブアップデートの代替手段を比較するページ

Capacitorライブアップデートの代替手段を比較するページ

Capacitorライブアップデートの代替手段を比較するページ

Capacitorライブアップデートの代替手段を比較するページ

ワークフローをトリガーする コミットが開始された.

数分後、ビルドはApp Store Connectダッシュボードで利用可能になります。

次に、ビルドしたいブランチを選択してください。

ブランチを選択

そして 新しいビルドを開始.

次に、ビルドリストに移動してください。

ビルドリスト

ビルド結果を確認するには、

ビルド結果

ローカルマシンからデプロイすることはできますか。

はい、できます。とても簡単です。

Xcodeを使用してアプリをビルドおよび署名することはいつもと同じです。

感謝します

このブログは以下の記事に基づいています。

CodemagicとCapacitorを使用した自動iOSビルド

Codemagicを使用している場合 CodemagicとCapacitorを使用した自動iOSビルド __CAPGO_KEEP_0__ CI/CDを使用して製品ワークフローを接続 Capgo CI/CDで製品ワークフロー Capgoネイティブビルド Capgoネイティブビルドで製品ワークフロー Capgo CI/CD Capgo 連携 Capgo 連携の製品ワークフローに CI/CD 連携 __CAPGO_KEEP_0__ アクション連携 GitHub アクション連携の実装詳細 for the implementation detail in GitHub Actions Integration.

Live updates for Capacitor apps

When a web-layer bug is live, ship the fix through Capgo instead of waiting days for app store approval. Users get the update in the background while native changes stay in the normal review path.

マーティンによる人間のサポート

今すぐ始めよう

最新のブログ記事

Capgo gives you the best insights you need to create a truly professional mobile app.