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

Capacitorの自動IOSビルド

CodemagicとCodemagicを使用した5分以内にIOS IonicアプリのCI/CDパイプラインの設定方法

記事のクレジット

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

ライター

バレリア

レビュアー

ジョーダン

編集者

Capacitorの自動IOSビルド

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

前提条件

このチュートリアルに進む前に…

  • iOS開発者プログラムの会員資格
  • 読むのが欲しい😆…

価格についての重要なこと

価格Codemagicアクション

https://codemagic.io/pricing/

サービスは月に500時間まで無料 macOS M1の使用時間は、選択したマシンに応じて、500時間まで無料です。
このチュートリアルでは 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 について始めるには、既存の証明書を取り消す必要がありますが、心配はいりません。新しい証明書は直接取得できます。

要件

Codemagic が App Store Connect API を使用できるようにするには、3 つのものが必要です。 発行者 ID キー ID

  1. キー ファイルまたはキー コンテンツ
  2. 3
  3. Key file or Key content.

App Store Connect API Keyの作成

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

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

2 — Users and Accessを選択 App Store Connectのユーザー権限.

3 — __CAPGO_KEEP_0__ Keysタブを選択

App Store ConnectのAPI Keys

4 — Generate API KeyまたはAdd(+)ボタンをクリック

App Store ConnectのAPI キーを作成

App Store Connect API keys create

__CAPGO_KEEP_0__ App Manager アクセス権限、Apple Developer Programの役割権限についてもっと読む ここ

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

6 — 生成をクリック。

API キーのアクセスは、特定のアプリに制限できない。

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

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

必要な情報をすべてここに取得する: <1> 問題番号。
<2> キーアイデンティファー。
<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. Capgoの設定に Issuer IDKey ID 値を入力してください。

  5. アップロードする App Store Connectの.p8ファイルを選択してください または、App Store ConnectのAPIキーをアップロードするには、ファイルをここにドラッグしてください。

  6. アップロード 保存.

App Store ConnectのAPIキーをアップロードできました!

2. 証明書とプロビジョニングプロファイルを作成する

証明書

XCodeを開いて 設定 > アカウント > Apple ID > チーム チームを選択してください。

Code署名のID

Click on 証明書を管理 > + そして選択 Apple配布.

Apple配布

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

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

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

Then you can create a new certificate.

Then you need to go to keychain to download the certificate as a file.

そして右クリックして証明書を選択 __CAPGO_KEEP_0__.

形式を選択 Personal Information Exchange (.p12).

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

Open

Apple Developer 適切なチームを選択してください。 新しいプロファイルを作成するには、右クリックして

__CAPGO_KEEP_1__ +

__CAPGO_KEEP_2__

そして選択 App Store Connect.

App Store Connectを選択

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

正しいアプリを選択

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

正しい証明書を選択

最後に、プロファイルの名前を入力してください、および Generate.

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

プロファイルを生成

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

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

Codeの署名証明書を追加

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

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

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

Codemagicでは、Codemagicアプリケーションに使用するプロビジョニング プロファイルをアップロードするか、Apple Developer Portalからプロファイルを取得することができます。

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

このワークフローは、手動でトリガーするか、各 GitHub タグの後で実行されるようにしてください。 タグを自動化するには、まずを参照してください。 Automatic build and release with GitHub actions 各タグの送信ごとに、テストフライトでリリースがビルドされます。

アプリは Ionic を使用する必要はありません。ただし、__CAPGO_KEEP_0__ ベースは必須です。古い Cordova モジュールを使用してもかまいませんが、__CAPGO_KEEP_1__ 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 ワークフローをトリガーする

ワークフローを手動でトリガーする

コミットで始めた

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

テストフライト ダッシュボード

手動で開始する

ワークフローを手動で開始できます。 まず、ビルドしたいアプリを選択し、.

新しいビルドを開始する

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

ブランチを選択

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

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

ビルドリスト

そして、ビルド結果を確認するには、ビルドをクリックしてください。

ビルド結果

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

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

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

感謝します

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

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

Codemagicを使用している場合 Automatic Capacitor IOS build with Codemagic __CAPGO_KEEP_0__を使用したCI/CDの計画 Capgo CI/CD Capgo CI/CDの製品ワークフロー Capgoネイティブビルド Capgoネイティブビルドの製品ワークフロー Capgo 連携 Capgo 連携の製品ワークフローに CI/CD 連携 __CAPGO_KEEP_0__ アクション連携 GitHub アクション連携の実装詳細 GitHub アクション連携の実装詳細

Live updates for Capacitor apps

ウェブ層のバグが生じた場合、修正をCapgoで配信し、App Storeの承認待ちの日数を省く。ユーザーはバックグラウンドで更新を受け取り、ネイティブの変更は通常のレビュー経路で進む。

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

始めましょう

最新のブログ

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