Build iOS Capacitor automatique avec Codemagic

Livraison continue pour iOS avec Codemagic

Prerequisites

Avant de poursuivre le tutoriel…

• Une adhésion au programme développeur iOS.
• L’envie de lire 😆…

Note importante sur le prix

https://codemagic.io/pricing/

Le service est «gratuit » jusqu’à 500 minutes macOS M1 / mois, selon la machine choisie.
Nous allons utiliser une macOS M1 dont vous pouvez voir le prix et les limites sur la capture d'écran (tarifs au moment de la création du tutoriel, susceptibles d'évoluer)

🔴 Une fois les prérequis et les tarifs présentés, si vous le souhaitez, nous continuons…

📣 Dans cet article, nous partons du principe que l’application a déjà été créée dans App Store Connect et que vous disposez des certificats de l’écosystème Apple. Codemagic s’occupe de toute la configuration !

Plongeons dans le vif du sujet 🤿

Étapes à suivre dans l'article

1. Utiliser App Store Connect API avec Codemagic
2. Prérequis
3. Créer une clé API App Store Connect
4. Utiliser une clé API App Store Connect
5. Copier les fichiers Fastlane
6. Configurer Codemagic

1. Utiliser App Store Connect API avec Codemagic

Depuis février 2021, l'authentification à deux facteurs ou la vérification en deux étapes est obligatoire pour que tous les utilisateurs puissent se connecter à App Store Connect. Cette couche de sécurité supplémentaire pour votre identifiant Apple garantit que vous êtes la seule personne à pouvoir accéder à votre compte.
Depuis Support Apple

Pour commencer avec match, vous devrez révoquer vos certificats actuels. Pas d'inquiétude, vous recevrez directement les nouveaux.

Prérequis

Pour pouvoir utiliser App Store Connect API, Codemagic a besoin trois choses.

1. ID de l’émetteur.
2. ID de la clé.
3. Fichier de clé ou contenu de la clé.

Créer une clé API App Store Connect

Pour générer des clés, vous devez disposer de la permission Admin dans App Store Connect. Si vous ne l'avez pas, vous pouvez transmettre cet article à la personne concernée et lui demander de suivre les instructions ci-dessous.

1 — Connectez-vous à App Store Connect.

2 — Sélectionnez Utilisateurs et accès.

3 — Sélectionnez l’onglet Clés API.

4 — Cliquez sur Generate API Key ou sur le bouton Add (+).

5 — Saisissez le nom de la clé et sélectionnez un niveau d’accès. Nous recommandons de choisir App Manager droits d’accès, en savoir plus sur les rôles et permissions du programme Apple Developer ici

6 — Cliquez sur Generate.

L'accès à une clé API ne peut pas être limité à des apps spécifiques.

Le nom de la nouvelle clé, son ID, un lien de téléchargement et d'autres informations s'affichent sur la page.

Récupérez ici les trois informations nécessaires : <1> L'ID de l'issue.
<2> ID de la clé.
<3> Cliquez sur « Download API Key » pour télécharger votre clé privée API. Le lien de téléchargement n'apparaît que si la clé privée n'a pas encore été téléchargée. Apple ne conserve pas de copie de la clé privée. Vous ne pouvez donc la télécharger qu'une seule fois.

🔴 Stockez votre clé privée dans un endroit sûr. Vous ne devez jamais partager vos clés, les stocker dans un dépôt code ou les inclure dans du code côté client.

Ajout de la clé API App Store Connect à Codemagic

1. Ouvrez les paramètres de votre équipe Codemagic, Sélectionnez les identités de signature code Et l’upload du certificat

2. Cliquez sur les Ajouter une clé .

3. Saisissez le App Store Connect API key name. C’est un nom lisible par un humain pour la clé, qui servira à y faire référence plus tard dans les paramètres de l’application.

4. Saisissez le Issuer ID et Key ID valeurs.

5. Cliquez sur Choisissez un fichier .p8 ou glissez le fichier pour envoyer la clé App Store Connect API téléchargée précédemment.

6. Cliquez Enregistrer.

Nous pouvons maintenant gérer Codemagic avec la clé App Store Connect API, super !

2. Créer les certificats et les profils de provisionnement

Certificats

Ouvrez Xcode et allez dans Paramètres > Comptes > Apple ID > Équipes et sélectionnez votre équipe.

Cliquez sur Gérer les certificats > + et sélectionnez Distribution Apple.

Vous pouvez ensuite créer un nouveau certificat.

Ensuite, vous devez vous rendre dans le trousseau pour télécharger le certificat en tant que .p12 fichier.

Pour ce faire, allez dans le trousseau et basculez sur le session trousseau, puis sur l'onglet Mes certificats.

Vous pouvez ensuite sélectionner le certificat que vous souhaitez télécharger. (Recherchez par date de validité du certificat)

Ensuite, faites un clic droit sur le certificat et sélectionnez Exporter.

Choisir le format de fichier Échange d'informations personnelles (.p12).

Cela téléchargera le certificat sous forme de .p12 fichier.

Profils de provisionnement

Ouvrez Apple Developer et sélectionnez la bonne équipe.

Ensuite, créez un nouveau profil en cliquant sur +

Et sélectionnez App Store Connect.

Ensuite, vous devez sélectionner la bonne application. Attention, vous ne pouvez pas utiliser de joker, sinon la signature échouera.

Sélectionnez le certificat que vous avez créé précédemment (vérifiez la date d'expiration : elle doit tomber le même jour et le même mois qu'aujourd'hui) et cliquez sur Continuer.

Enfin, saisissez le nom du profil et cliquez sur Générer.

Ce nom servira à identifier le profil dans Codemagic.

Vous pouvez télécharger le profil en tant que .mobileprovision fichier.

Ajout du certificat de signature Code

Codemagic vous permet d’uploader les certificats de signature code au format PKCS#12, qui contiennent à la fois le certificat et la clé privée nécessaire à son utilisation. Lors de l’upload, Codemagic vous demande de fournir le mot de passe du certificat (s’il est protégé) ainsi qu’un identifiant unique Nom de référence, qui peut ensuite être utilisé dans la codemagic.yaml configuration pour récupérer le fichier spécifique.

• Uploader le certificat
• Générer un nouveau certificat
• Récupérer depuis le Developer Portal

1. Ouvrez les paramètres d’équipe Codemagic, allez dans les paramètres codemagic.yaml > Identités de signature Code.
2. Ouvrez Certificats iOS .
3. Envoyez le fichier du certificat en cliquant sur Choisissez un fichier .p12 ou .pem ou en le faisant glisser dans le cadre indiqué.
4. Saisissez le Mot de passe du certificat et choisissez un Nom de référence.
5. Cliquez Ajouter un certificat

Ajout du profil de provisionnement

Codemagic vous permet d'envoyer un profil de provisionnement à utiliser pour l'application, ou de récupérer un profil depuis l'Apple Developer Portal.

Le type de profil, l'équipe, le bundle ID et la date d'expiration s'affichent pour chaque profil ajouté aux identités de signature de Code. De plus, Codemagic vous indiquera si un certificat de signature code correspondant est disponible dans les identités de signature de Code (une coche verte dans le Certificat champ) ou non.

3. Configurer Codemagic

Configurer les secrets Codemagic

Vous vous demandez d'où viennent les valeurs de ENV ? Eh bien, ce n'est plus un secret : elles viennent des secrets de votre projet. 🤦

4. Configurer le fichier workflow Codemagic

Créez un fichier nommé codemagic.yml à la racine de votre projet et ajoutez ce qui suit.

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

Ce workflow doit être déclenché manuellement ou après chaque GitHub balise, si vous souhaitez automatiser les tags, veuillez vous référer à Build et release automatiques avec les actions GitHub d'abord.

Ensuite, ce workflow récupère vos dépendances NodeJS, les installe et compile votre application JavaScript.

Chaque fois que vous envoyez un nouveau tag, une release est compilée dans TestFlight.

Votre application n’a pas besoin d’utiliser Ionic, seule la base Capacitor est obligatoire ; elle peut contenir d’anciens modules Cordova, mais le plugin JS Capacitor est à privilégier.

5. Déclencher le workflow

Déclencher le workflow

Pousser les nouveaux commits sur la branche main ou development pour déclencher le workflow.

Après quelques minutes, le build devrait être disponible dans votre dashboard App Store Connect.

Démarrer manuellement

Vous pouvez démarrer le workflow manuellement.

Sélectionnez d’abord l’app que vous souhaitez compiler, puis cliquez sur Démarrer un nouveau build.

Sélectionnez ensuite la branche que vous souhaitez compiler.

Et cliquer sur Démarrer un nouveau build.

Ensuite, accédez à la liste des builds

Et cliquez sur le build pour voir le résultat.

Peut être déployé depuis une machine locale

Oui, c'est possible et sans effort.

Vous pouvez utiliser Xcode pour compiler et signer votre app, comme d'habitude.

Merci

Cet article s'appuie sur les articles suivants :

• Livraison continue pour iOS avec Codemagic et les actions GitHub
• Documentation Codemagic
• Ce message GitHub de @mrogunlana

Continuez à partir du build iOS automatique Capacitor avec Codemagic

Si vous utilisez Build iOS Capacitor automatique avec Codemagic pour planifier l'automatisation CI/CD, et le connecter avec CI/CD Capgo pour le workflow produit dans le CI/CD de Capgo, Capgo Native Build pour le workflow produit dans les Native Builds de Capgo, Intégrations Capgo pour le workflow produit dans les intégrations de Capgo, Intégration CI/CD pour le détail d'implémentation dans l'intégration CI/CD, et Intégration GitHub Actions pour les détails d'implémentation de l'intégration GitHub Actions.