Construction automatique de l'Capacitor IOS avec Codemagic

Livraison continue pour iOS en utilisant Codemagic

Prérequis

Avant de poursuivre avec le tutoriel…

• Membre du programme iOS développeur.
• Souhait de lire 😆…

Informations importantes sur le prix

https://codemagic.io/pricing/

The service is ‘free’ up to 500 minutes de macOS M1 par mois, en fonction de la machine choisie.
Nous allons utiliser une machine macOS M1 , vous pouvez voir dans l'écran son prix et ses limites (tarifs valables à la création de la tutorial, ils pourraient subir des changements à l'avenir)

🔴 Une fois averti des exigences et des prix, si vous le souhaitez, nous continuons…

📣 Dans l'article, on suppose que nous avons créé l'application dans iTunes connect, nous avons les certificats de l'écosystème Apple, tout sera configuré par Codemagic !

Allons-y !

Étapes à suivre dans l'article

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

1. Utiliser App Store Connect API avec Codemagic

À partir de février 2021, l'authentification à deux facteurs ou la vérification à deux étapes est obligatoire pour tous les utilisateurs pour se connecter à App Store Connect. Cette couche supplémentaire de sécurité pour votre ID Apple vous aide à vous assurer que vous êtes la seule personne qui peut accéder à votre compte.
De Support Apple

Commencer avec match nécessite de révoquer vos certificats existants. Mais ne vous inquiétez pas, vous obtiendrez le nouveau directement.

Exigences

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

1. Identifiant de l'émetteur.
2. Identifiant de la clé.
3. Clé de fichier ou contenu de la clé.

Créer une clé d'App Store Connect API

Pour générer des clés, vous devez avoir les droits d'administrateur dans App Store Connect. Si vous n'avez pas ces droits, vous pouvez diriger la personne concernée à cet article et suivre les instructions suivantes.

1 — Se connecter à App Store Connect.

2 — Sélectionner Utilisateurs et accès.

3 — Sélectionner la tabulette des clés API.

4 — Cliquez sur Générer API Clé ou le bouton Ajouter (+).

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

6 — Cliquez sur Générer.

Une API clé ne peut pas avoir des droits d'accès limités à des applications spécifiques.

Les informations de la nouvelle clé, son ID, un lien de téléchargement et d'autres informations apparaissent sur la page.

Récupérez les trois informations nécessaires ici: <1> ID de la demande.
<2> ID de clé.
<3> Cliquez sur « Télecharger la clé API » 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 garde pas de copie de la clé privée. Vous pouvez donc la télécharger qu'une seule fois.

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

Ajouter la clé API d'App Store Connect à Codemagic

1. Ouvrez les paramètres de votre équipe Codemagic Sélectionner les identités de signature code Et télécharger le certificat

2. Cliquez sur Ajoutez la clé . Bouton.

3. Entrez le App Store Connect API key name. C'est un nom lisible par l'homme pour la clé qui sera utilisé pour faire référence à la clé plus tard dans les paramètres de l'application.

4. Entrez le Issuer ID et Key ID valeurs.

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

6. Cliquez Enregistrer.

Maintenant, nous pouvons gérer Codemagic avec la clé d'App Store Connect API, c'est génial !

2. Créez des certificats et des profils de provisionnement

Certificats

Ouvrez XCode et allez à Paramètres > Comptes > Identité Apple > Équipes et sélectionnez votre équipe.

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

Ensuite, vous pouvez créer un nouveau certificat.

Ensuite, vous devez aller dans la clé de chaîne pour télécharger le certificat sous forme de .p12 fichier.

Pour ce faire, vous devez aller dans la clé de chaîne, passer à la session de connexion cléchaines puis la vignette Mes Certificats.

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

Et puis cliquez avec le bouton droit sur le certificat et sélectionnez Exporter.

Sélectionnez le format de fichier Échange de données personnelles (.p12).

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

Profils de provisionnement

Ouvrir Apple Developer et sélectionnez l'équipe appropriée.

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

Et sélectionnez App Store Connect.

Ensuite, vous devez sélectionner l'application appropriée, soyez prudent car vous ne pouvez pas utiliser des caractères génériques sinon la signature ne fonctionnera pas.

Sélectionnez le certificat approprié que vous avez créé avant (cherchez la date d'expiration, elle doit être la même journée et mois que aujourd'hui) et cliquez sur Continuer.

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

Le nom sera utilisé pour identifier le profil dans Codemagic.

Vous pouvez télécharger le profil sous forme de .mobileprovision fichier.

Ajouter le certificat de signature Code

Codemagic vous permet d'uploader des certificats de signature code sous forme d'archives PKCS#12 contenant à la fois le certificat et la clé privée qui est nécessaire pour l'utiliser. Lors de l'upload, Codemagic vous demandera de fournir le mot de passe du certificat (si le certificat est protégé par mot de passe) ainsi qu'un nom de référence unique , qui peut ensuite être utilisé dans laconfiguration pour récupérer le fichier spécifique. codemagic.yaml Reference name

• Charger le certificat
• Générer un nouveau certificat
• Récupérer depuis le Portail des Développeurs

1. Ouvrez vos paramètres d'équipe Codemagic, allez à paramètres de codemagic.yaml > identités de signature Code.
2. Ouvrir certificats iOS onglet.
3. Charger le fichier de certificat en cliquant sur Sélectionnez un fichier .p12 ou .pem ou en le traînant dans la zone indiquée.
4. Entrez le Mot de passe du certificat et choisissez un Nom de référence.
5. Cliquez Ajouter le certificat

La mise en ligne de profil de provisionnement

Le Codemagic vous permet d'uploader un profil de provisionnement à utiliser pour l'application ou de récupérer un profil depuis le Portail du développeur Apple.

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

3. Configuration de Codemagic

Configurer les secrets de Codemagic

Vous vous demandez peut-être où viennent les valeurs de «  ENV ? Eh bien, ce n'est plus un secret – il s'agit de votre secret de projet.

4. Configuration du fichier de flux de travail de Codemagic

Créez un fichier nommé «  codemagic.yml à la racine de votre projet et ajoutez les éléments suivants.

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 tag », si vous avez besoin d'automatiser le tag, veuillez vous référer à « Automatic build and release with __CAPGO_KEEP_0__ actions » Automatic build and release with GitHub actions Automatic build and release with __CAPGO_KEEP_0__ actions

Ensuite, ce flux de travail récupérera vos dépendances NodeJS, les installera et construira votre application JavaScript.

Chaque fois que vous envoyez une nouvelle étiquette, une mise à jour sera créée dans TestFlight.

Votre application n'a pas besoin d'utiliser Ionic, seule la base Capacitor est obligatoire, elle peut avoir des anciens modules Cordova, mais le plugin Capacitor JavaScript est préférable.

5. Déclencher le flux de travail

Déclenchez le flux de travail

Envoi les nouveaux commits vers la branche main ou development pour déclencher le flux de travail.

Après quelques minutes, la mise à jour devrait être disponible dans votre tableau de bord App Store Connect.

Démarrer manuellement

Vous pouvez démarrer le flux de travail manuellement.

Tout d'abord, sélectionnez l'application que vous souhaitez construire, puis cliquez sur Démarrer une nouvelle construction.

Ensuite, sélectionnez la branche que vous souhaitez construire.

Et cliquez sur Démarrer une nouvelle construction.

Ensuite, allez dans la liste des constructions

Et cliquez sur la construction pour voir le résultat.

Can déployer à partir de la machine locale

Oui, vous pouvez, et cela est sans effort.

Vous pouvez utiliser Xcode pour construire et signer votre application, comme toujours.

Merci

Cet article est basé sur les articles suivants :

• Déploiement continu pour IOS en utilisant Codemagic et GitHub actions
• Documentation Codemagic
• Ce GitHub message de @mrogunlana

Keep going from Automatic Capacitor IOS build with Codemagic

Si vous utilisez Automatic Capacitor IOS build with Codemagic pour planifier l'automatisation CI/CD, connectez-le avec Capgo CI/CD pour le flux de travail du produit dans Capgo CI/CD, Capgo Builds natifs pour le flux de travail du produit dans Capgo Builds natifs, Capgo Intégrations pour le flux de travail du produit dans Capgo Intégrations, Intégration CI/CD pour le détail d'implémentation dans Intégration CI/CD, et GitHub Intégration d'actions pour le détail d'implémentation dans GitHub Intégration d'actions.