Zenn
🤖

Codemagicを使ったFlutterアプリのApp Store自動デプロイ

2024/06/12に公開
Flutter
CI
AppStore
CD
Codemagic
tech

Codemagicを使ったFlutterアプリのApp Store自動デプロイ

導入

FlutterをCI/CDするためのツールとしてはGithub actionsを使う方法もありますが、Codemagicは、Flutterアプリのビルドとデプロイを自動化するために特化してるツールです。

https://codemagic.io/start/

さまざまなツールが用意されており、Github actionsより比較的簡単、高機能にCI/CDを実現することができます。

今回は、Codemagicを使ってFlutterアプリをAppleのapp storeに自動デプロイする方法を紹介します。今回は、yamlファイルを使った方法を紹介します。

以前、androidアプリをGoogle Playに自動デプロイする方法も書いており、そちらはこちらの方になります。

https://zenn.dev/yuki_2021/articles/25849c2aa3479a

準備

必要なツール

  • Codemagicアカウント
  • App Store Connectアカウント
  • Apple Developerアカウント
  • Githubのリポジトリ

実装

Codemagicプロジェクトのセットアップ

以前書いたのでそちらの方を参考してください。

https://zenn.dev/yuki_2021/articles/25849c2aa3479a#プロジェクトのセットアップ

App Store ConnectでApp Store Connect API keyを作成してCodemagicへ登録する

CodemagicからApp Storeへ接続するためには、App Store Connectで新しくApp Store Connect API Keyを作成する必要があります。

App Store Connect API keyの作成

まずApp Store Connectにアクセスしてログインします。

https://appstoreconnect.apple.com/

[ユーザとアクセス] > [統合]を開きます。

[チームキー]を開きます。

初回の場合にはAppleへ申請を行うのかという表示がありますが、それを順当に進めていきます。

keyを生成します。アクセスについては「App Manager」を設定します。

ダウンロードできる.p8ファイルとIssuer IDとチームIDは保管してどこかに置いておいてください。

CodemagicにApp Store Connect API keyを登録

Codemagicを開きます。そして、左端のメニューから[Teams]そして、開いた画面で使ってるチーム名を開きます。

開いた画面の[Integrations]そして、Developer PotalのManaged keyをクリックします。

そして開かれた次の画面で先ほどApp store connectで作成した、.p8ファイルとIssuer IDとチームIDを登録します。

これでApp Store ConnectをCodemagicに接続することができました。

アプリへの署名を行うために、certificatesファイルとプロビジョニングファイルを発行して、Codemagicに登録する

https://docs.codemagic.io/yaml-code-signing/signing-ios/

certificatesの作成

こちらの方は本来、Apple developerの[Certificates, Identifiers & Profiles]から、発行しないとならないのですが、Codemagicから新しくCertificatesを作成できます。既存のCertificatesを使いたい場合には、上記のURLの該当箇所を参考ください。

Codemagicから新規のcertificatesを作成する方法を説明します。

  1. Codemagicを開きます
  2. [Teams] > [Code signing identities] > [iOS certificates]

  1. [Generate certificate]をクリック
  2. 次のような画面になるので、certificateをダウンロードして登録を行ってください(ファイルは一度しかダウンロードできません)

プロビジョニングファイルの発行とCodemagicへの登録

次はプロビジョニングファイルの発行を行います。こちらのプロビジョニングファイルは、先ほど作成したcertificatesと紐付けを行わねばならず、これができてないと「Not Uploaded」というバツ印が表示されます。この状態だとプロビジョニングファイルの登録はできてもデプロイできません。これで随分と詰まりました。

また、画像付きプッシュ通知を送る「ImageNotication」などで複数のTargetが存在してる場合、複数のプロビジョニングファイルを作成する必要があります。

下記よりプロビジョニングファイルの発行方法を説明します。

  1. apple developerを開きます

https://developer.apple.com/

  1. [Certificates, Identifiers & Profiles] > [Profiles]
  2. プラスボタンを押して新しくプロビジョニングファイルを作成
  3. [Distribution] > [App Store Connect]を選択。その後、[Continue]
  4. APP idを選択するので、今回デプロイを行いたいアプリのTarget名を選択する
  5. 紐付けるcertificatesを選択するので、先ほど作成したcertificatesを選択
  6. プロビジョニングファイルが生成されるのでダウンロード
  7. Codemagicへ移動
  8. [Teams] > [Code signing identities] > [iOS provisioning profiles]
  9. 「.mobileprovision」をアップロードして、適当な変数名を指定する（後からyamlファイルで使う)

Codemagicでの作業

Codemagicのyamlを記述

  1. ビルドトリガーの設定（GitHubのプッシュやプルリクエストなど）。
  2. ビルドスクリプトの作成。
# iOSをビルドしてApp Storeにアップロード
  ios-push-store:
    name: iOS Workflow
    instance_type: mac_mini_m1
    max_build_duration: 120

    # トリガーの設定: GitHubのpushイベント時に自動でビルドを開始 特定のタグのみ
    triggering:
      events:
        - tag
      tag_patterns:
        - pattern: ios-push*
          include: true
      cancel_previous_builds: true # 既存のビルドをキャンセル

    environment:
      flutter: fvm # fvmを使用する
      xcode: latest # xcodeの最新バージョンを使用
      cocoapods: default # cocoapodsのデフォルトバージョンを使用
      ios_signing:
        #プロビジョニングファイルの設定（Codemagicに登録したプロビジョニングファイル名を指定、複数可能)
        provisioning_profiles:
          - provisioning_profile
          - image_notification_provisioning_profile
        #証明書の設定(Codemagicに登録したcertificatesを指定)
        certificates:
          - Codemagic_deploy

    # 公開設定
    integrations:
      app_store_connect: apple_store_conect_API_key
      
    # キャッシュ設定: ビルドの高速化
    cache:
      cache_paths:
        - ~/.pub-cache
        - .dart_tool
        - .packages
        - .flutter-plugins
        - .flutter-plugin-dependencies

    scripts:
      # プロビジョンングファイルでの署名
      - name: Set up code signing settings on Xcode project
        script: |
          xcode-project use-profiles
      # flutterをクリーン
      - name: Flutter clean
        script: flutter clean
      # freezedのコード生成
      - name: Generate freezed code
        script: flutter pub run build_runner build --delete-conflicting-outputs
      # flutterのパッケージを取得
      - name: Get Flutter packages
        script: |
          flutter packages pub get
      # cocoaPodsのインストール
      - name: Install pods
        script: |
          find . -name "Podfile" -execdir pod install \;
      # flutterの公開版ファイルのビルド
      - name: Flutter build ipa and automatic versioning
        script: |
          flutter build ipa --release --export-options-plist=/Users/builder/export_options.plist
      # クラッシュアナリティクス用にdSYMファイルをアップロード
      - name: Upload dSYM files
        script: |
          ios/Pods/FirebaseCrashlytics/upload-symbols -gsp ios/Runner/production/GoogleService-Info.plist -p ios build/ios/archive/Runner.xcarchive/dSYMs
    # app storeに送信するファイル
    artifacts:
      - build/ios/ipa/*.ipa
      - /tmp/xcodebuild_logs/*.log
      - flutter_drive.log
    # デプロイ処理
    publishing:
      # 完了時送信email
      email:
        recipients:
          - test@sample.com
        notify:
          success: true #成功した時に送る
          failure: false #失敗した時は送らない
      app_store_connect:
        auth: integration
        
        # テストフライトに自動デプロイする
        submit_to_testflight: true

テストとデプロイ

テストの実行

Codemagicのビルドログを確認し、エラーがないかチェックします。

まとめ

Codemagicを使うことで、Flutterアプリのビルドとデプロイを自動化することができました。これにより、手動でのデプロイ作業を省略し、開発の効率を大幅に向上させることができます。

参考URL

https://zenn.dev/slowhand/articles/1a6c04185469a1

Discussion