Passer au contenu principal
CI/CD

La construction automatique d'Capacitor IOS avec GitHub actions avec certificat

Comment configurer une chaîne d'outils CI/CD pour votre application IOS Ionic en utilisant fastlane et GitHub Actions en 5 minutes (2024)

Martin Donadieu

Martin Donadieu

Spécialiste du contenu

La construction automatique d'Capacitor IOS avec GitHub actions avec certificat

Configurer la chaîne d'outils CI/CD pour les applications Capacitor peut être complexe et chronophage. Voici ce que vous devez savoir :

Nous recommandons maintenant d'utiliser Capgo Build avec le Capgo CLI pour les constructions natives Capacitor. Ce guide Fastlane est conservé pour les équipes qui maintiennent des pipelines d'actions GitHub existants, mais les nouvelles builds iOS doivent utiliser le Capgo CLI afin que vous ne deviez pas maintenir Fastlane, les exécutants Xcode, les certificats et les scripts d'envoi vous-même.

Prérequis

Avant de commencer, vous aurez besoin de configurer :

  • Un compte GitHub avec un accès administrateur
  • adhésion au programme de développeur iOS
  • Accès à API App Store Connect avec les permissions appropriées
  • Compréhension des workflows d'actions GitHub
  • Connaissance de la configuration Fastlane
  • Temps pour maintenir et déboguer la pipeline
  • Certificats et profils de provisionnement appropriés

Configuration CI/CD professionnelle par Capgo

Sauter la complexité. Capgo configurez votre pipeline CI/CD directement dans votre plateforme préférée :

  • Indépendance de la plateforme: Fonctionne avec les GitHub Actions, GitLab CI ou d'autres
  • Intégration sans heurt: Pas de changement de plateforme nécessaire, fonctionne avec votre processus actuel
  • Configuration personnalisée: Paramétrage personnalisé correspondant aux besoins de votre projet
  • Conseils d'experts: Nous avons déjà configuré CI/CD pour 50+ applications

Tarifs

  • Frais de configuration unique : 2 600 $
  • Coûts de fonctionnement : ~$300/an
  • Comparez à d'autres solutions propriétaires : $6,000/an
  • Économisez 26 100 $ sur 5 ans

Configurer maintenant la CI/CD

Guide de configuration manuelle

Si vous souhaitez toujours configurer tout vous-même, voici ce dont vous avez besoin de faire :

Livraison continue pour iOS en utilisant Fastlane et GitHub Actions et certificat

Prérequis

Avant de continuer avec le tutoriel :

  • Assurez-vous d'avoir Fastlane installé sur votre machine de développement.
  • Assurez-vous d'être membre du programme de développeur iOS.

Informations importantes sur le prix

Prix GitHub Action

https://github.com/features/actions

Le service est ‘gratuit’ jusqu'à la limite, en fonction de la machine choisie.
Nous allons utiliser un ordinateur macOS machine, vous pouvez le voir dans l'écran d'aperçu son prix et ses limites (tarifs valables à la création de ce tutoriel, ils pourraient subir des changements à l'avenir)

Une fois averti des exigences et des prix, continuons.

Remarque : Dans l'article, je suppose que vous avez créé l'application dans App Store Connect. Les informations importantes seront copiées par Fastlane !

Qu'est-ce que vous apprendrez dans le tutoriel

Étapes à suivre dans l'article

  1. Utilisation de App Store Connect API avec Fastlane
    • Exigences :
      • Création d'une clé App Store Connect API
      • Utilisation d'une clé App Store Connect API
  2. Copier les fichiers Fastlane
  3. Configurer les actions GitHub

1. Utilisation de App Store Connect API avec Fastlane

À 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

Exigences

Pour que Fastlane puisse utiliser App Store Connect API pour télécharger votre application, vous devez fournir les éléments suivants : trois choses :

  1. Identifiant émetteur
  2. Identifiant de clé
  3. Clé de fichier ou Contenu de clé

Obtenir une clé 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.

  1. Se connecter à App Store Connect.

  2. Sélectionner Utilisateurs et Accès.

Accès à l'App Store Connect

3 — Sélectionnez l'onglet Intégration.

App Store Connect API Intégration

  1. Cliquez sur Générer la clé API ou le bouton Ajouter (+).

Les clés App Store Connect API créent

  1. Entrez un nom pour la clé. Le nom est uniquement pour votre référence et n'est pas partie de la clé elle-même.

App Store Connect API clés créent nom

6 — Dans Accès, sélectionnez le rôle pour la clé. Les rôles qui s'appliquent aux clés sont les mêmes rôles qui s'appliquent aux utilisateurs de votre équipe. Voir permissions de rôle. Nous recommandons de sélectionner Gestionnaire d'application.

  1. Clicker Generate.

Un API clé n'a pas accès limité à des applications spécifiques.

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

Télécharger les clés App Store Connect

Vous pouvez obtenir les trois informations nécessaires ici.
<1> ID de l'incident. (APPLE_ISSUER_ID secret)
<2> ID de la clé. (APPLE_KEY_ID secret)
<3> Cliquez sur « Télécharger 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 dépôt code, ou inclure les clés dans un code côté client code.

En utilisant une clé App Store Connect API

The fichier de clé API (fichier p8 que vous téléchargez), l'ID de clé et l'ID émetteur sont nécessaires pour créer le jeton JWT d'autorisation. Il existe plusieurs façons de passer ces informations dans Fastlane. J'ai choisi d'utiliser l'action nouvelle de Fastlane app_store_connect_api_keyVous pouvez apprendre d'autres façons dans la documentation de FastlaneJe montre cette méthode parce que je pense qu'il s'agit de la façon la plus facile de travailler avec la plupart des CI, où vous pouvez définir des variables d'environnement

Veuillez convertir le fichier p8 que vous téléchargez en Base64 et le stocker comme un secret (APPLE_KEY_CONTENT).

base64 -i APPLE_KEY_CONTENT.p8 | pbcopy

Maintenant, nous pouvons gérer App Store Connect avec Fastlane à l'aide de la clé API, c'est génial !

2. Certificats

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

Code identités de signature

Cliquez sur Gérer les certificats.

Si vous n'avez pas encore créé de certificat, vous pouvez créer un nouveau certificat.

Cliquez sur + et sélectionnez Distribution Apple

Distribution Apple

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 vue de la clé de chaîne et connexion __CAPGO_KEEP_0__ Mes Certificats.

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 la clé privée du certificat et sélectionnez Exporter.

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

Cela téléchargera le certificat sous la forme d'un .p12 fichier.

Veuillez ouvrir le fichier dans un terminal et utilisez la commande suivante pour le convertir en Base64 :

base64 -i BUILD_CERTIFICATE.p12 | pbcopy

Cela deviendra votre mot de passe. De plus, lorsque vous y êtes invité, veuillez fournir le mot de passe du certificat. Ce mot de passe sera votre mot de passe. BUILD_CERTIFICATE_BASE64 3. Profils de provisionnement P12_PASSWORD Ouvrir

Apple Developer

et sélectionnez l'équipe appropriée. Ensuite, créez un nouveau profil en cliquant sur Créer un nouveau profil

Et sélectionnez +

App Store Connect

Sélectionnez App Store Connect __CAPGO_KEEP_0__.

secret.

Vous devez ensuite sélectionner l'application appropriée, soyez prudent car vous ne pouvez pas utiliser un joker sinon la signature ne fonctionnera pas.

Sélectionnez l'application appropriée

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

Sélectionnez le bon certificat

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

Le nom sera utilisé pour identifier le profil dans Fastlane, sous la valeur de APPLE_PROFILE_NAME.

Générez le profil

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

Téléchargez le profil

Veuillez convertir le profil en Base64 et le stocker comme un secret (BUILD_PROVISION_PROFILE_BASE64).

base64 -i BUILD_PROVISION_PROFILE.mobileprovision | pbcopy

4. Copiez les fichiers Fastlane

Fastlane est une bibliothèque Ruby créée pour automatiser les tâches de développement mobile courantes. En utilisant Fastlane, vous pouvez configurer des « voies » personnalisées qui rassemblent une série d'« actions » qui exécutent des tâches que vous feriez normalement à l'aide d'Android Studio. Vous pouvez faire beaucoup de choses avec Fastlane, mais pour les besoins de ce tutoriel, nous utiliserons uniquement une poignée d'actions de base.

Créez le dossier Fastlane au niveau de racine de votre projet Capacitor/Ionic et ajoutez-y le fichier Fastfile :

  • Dossier : <project-root>/fastlane/
  • Fichier : <project-root>/fastlane/Fastfile

C'est le même niveau que package.json, capacitor.config.*, et le ios/ dossier. N'oubliez pas de ne pas le créer à l'intérieur de ios/App/.

platform :ios do
  desc 'Export ipa and submit to TestFlight'
  lane :beta do
    keychain_info = { keychain_name: "ios-build-#{Time.now.to_i}.keychain", keychain_password: SecureRandom.uuid }
    
    begin
      setup_signing(keychain_info)
      bump_build_number
      build_app_with_signing(keychain_info)
      submit_to_testflight
    ensure
      cleanup_keychain(keychain_info)
    end
  end

  private_lane :setup_signing do |options|
    create_keychain(
      name: options[:keychain_name],
      password: options[:keychain_password],
      unlock: true,
      timeout: 0,
      lock_when_sleeps: false, 
      add_to_search_list: true
    )
    import_cert(options)
    install_profile
    update_project_settings
  end

  lane :bump_build_number do
		file = File.read('../package.json')
		data_hash = JSON.parse(file)
		api_key = app_store_connect_api_key(
      key_id: ENV['APPLE_KEY_ID'],
      issuer_id: ENV['APPLE_ISSUER_ID'],
      key_content: ENV['APPLE_KEY_CONTENT'],
      is_key_content_base64: true,
      duration: 1200,
      in_house: false
    )
		build_num = app_store_build_number(
      api_key: api_key,
			app_identifier: ENV['BUNDLE_IDENTIFIER'],
			live: false
    )
		build_num = build_num + 1
		UI.message("Bumped build number to #{build_num}")
		increment_build_number(
			build_number: build_num,
			xcodeproj: "./ios/App/App.xcodeproj",
			skip_info_plist: true
		)
	end

  private_lane :import_cert do |options|
    cert_path = "#{Dir.tmpdir}/build_certificate.p12"
    File.write(cert_path, Base64.decode64(ENV['BUILD_CERTIFICATE_BASE64']))
    import_certificate(
      certificate_path: cert_path,
      certificate_password: ENV['P12_PASSWORD'] || "",
      keychain_name: options[:keychain_name],
      keychain_password: options[:keychain_password],
      log_output: true
    )
    File.delete(cert_path)
  end  
  
  private_lane :cleanup_keychain do |options|
    delete_keychain(
      name: options[:keychain_name]
    )
  end  

  private_lane :install_profile do
    profile_path = "#{Dir.tmpdir}/build_pp.mobileprovision"
    File.write(profile_path, Base64.decode64(ENV['BUILD_PROVISION_PROFILE_BASE64']))
    UI.user_error!("Failed to create provisioning profile at #{profile_path}") unless File.exist?(profile_path)
    ENV['PROVISIONING_PROFILE_PATH'] = profile_path
    install_provisioning_profile(path: profile_path)
    File.delete(profile_path)
  end

  private_lane :update_project_settings do
    update_code_signing_settings(
      use_automatic_signing: false,
      path: "./ios/App/App.xcodeproj",
      code_sign_identity: "iPhone Distribution",
      profile_name: ENV['APPLE_PROFILE_NAME'],
      bundle_identifier: ENV['BUNDLE_IDENTIFIER'],
      team_id: ENV['APP_STORE_CONNECT_TEAM_ID']
    )
    update_project_team(
      path: "./ios/App/App.xcodeproj",
      teamid: ENV['APP_STORE_CONNECT_TEAM_ID']
    )
  end

  private_lane :build_app_with_signing do |options|
    unlock_keychain(
      path: options[:keychain_name],
      password: options[:keychain_password],
      set_default: false
    )
    build_app(
      workspace: "./ios/App/App.xcworkspace",
      scheme: "App",
      configuration: "Release",
      export_method: "app-store",
      output_name: "App.ipa",
      export_options: {
        provisioningProfiles: {
          ENV['BUNDLE_IDENTIFIER'] => ENV['APPLE_PROFILE_NAME']
        }
      },
      xcargs: "-verbose",
      buildlog_path: "./build_logs",
      export_xcargs: "-allowProvisioningUpdates",
    )
  end   

  private_lane :submit_to_testflight do
    api_key = app_store_connect_api_key(
      key_id: ENV['APPLE_KEY_ID'],
      issuer_id: ENV['APPLE_ISSUER_ID'],
      key_content: ENV['APPLE_KEY_CONTENT'],
      is_key_content_base64: true,
      duration: 1200,
      in_house: false
    )
    pilot(
      api_key: api_key,
      skip_waiting_for_build_processing: true,
      skip_submission: true,
      distribute_external: false,
      notify_external_testers: false,
      ipa: "./App.ipa"
    )
  end
end

5. Configuration des secrets

Les actions de GitHub utilisent les secrets de votre référentiel que vous configurez dans l'étape suivante. Vous n'avez besoin que d'un fichier local si vous souhaitez exécuter ou tester Fastlane à partir de votre propre machine. .env Actions

Pour les tests locaux, créez <project-root>/fastlane/.env à côté de Fastfile. N'ajoutez pas ce fichier à votre dépôt. Ajoutez fastlane/.env à votre .gitignore premier (ou vérifiez qu'il est déjà ignoré). Voici un exemple :

APP_STORE_CONNECT_TEAM_ID=UVTJ336J2D
BUNDLE_IDENTIFIER=ee.forgr.testfastlane
# See previous section for these secrets
BUILD_CERTIFICATE_BASE64=
BUILD_PROVISION_PROFILE_BASE64=
APPLE_KEY_ID=
APPLE_ISSUER_ID=
APPLE_KEY_CONTENT=
P12_PASSWORD=
APPLE_PROFILE_NAME=

Récupérer l'ID d'équipe d'APP STORE CONNECT

Allez dans Centre de développement et descendez jusqu'à la Membership details section. C'est la valeur que vous devez définir dans le Team ID secret. APP_STORE_CONNECT_TEAM_ID Add

app-store-connect-team-id

Obtenir l'identifiant de l'application

  1. Ouvrir Xcode
  2. Double-cliquez sur le App dans le navigateur de projet
  3. Cliquez ensuite sur l'onglet Signing and Capabilities
  4. Copiez la valeur de l' Bundle identifierC'est la valeur que vous devez saisir dans le BUNDLE_IDENTIFIER secret.
identifiant-de-l-application-xcode

6. Traitement de la mise à jour

Dans les GitHub Actions, Vous êtes facturés en fonction des minutes Vous avez utilisées pour exécuter votre flux de CI/CD. D'après mon expérience, il faut environ 10-15 minutes avant que le build puisse être traité dans App Store Connect.

Pour les projets privés, le coût estimé par build peut aller jusqu'à $0,08/min x 15 min = $1,2, ou plus, en fonction de la configuration et des dépendances de votre projet.

Si vous vous inquiétez des coûts pour les projets privés, vous pouvez définir skip_waiting_for_build_processing à true. Cela sauvegardera les minutes de build en ne faisant pas attendre App Store Connect pour terminer le traitement du build.

Cependant, il y a un compromis - vous devrez mettre à jour manuellement les informations de conformité de votre application dans App Store Connect avant de pouvoir distribuer le build aux utilisateurs.

Cette optimisation est principalement utile pour les projets privés où les minutes de build coûtent de l'argent. Pour les projets publics/gratuits, les minutes de build sont gratuites, il n'y a donc pas besoin d'activer cette fonctionnalité. Voir la page de tarification de GitHub pour plus de détails. pricing page build minutes

7. Configuration GitHub Actions

Configurer GitHub secrets

Veuillez copier les secrets du .env fichier et les coller dans les secrets GitHub du dépôt.

Allez à Paramètres > Secrets et variables > Actions > Nouveau secret de dépôt

github-secrets

2. BUILD_CERTIFICATE_BASE64 - Certificat encodé en Base64.

3. BUILD_PROVISION_PROFILE_BASE64 - Profil de provisionnement encodé en Base64.

4. BUNDLE_IDENTIFIER - l'identifiant de votre application.

5. APPLE_KEY_ID — App Store Connect API Clé 🔺ID de la clé.

6. APPLE_ISSUER_ID — App Store Connect API Clé 🔺ID de l'émetteur.

7. APPLE_KEY_CONTENT — App Store Connect API Clé 🔺Contenu de la clé. .p8, vérifiez-le

8. Configurez le fichier de flux de travail GitHub

Créez un répertoire de flux de travail GitHub.

cd .github/workflows

À l'intérieur du dossier, créez un fichier nommé workflow et ajoutez le contenu suivant. build-upload-ios.ymlCe flux de travail doit être déclenché après chaque __CAPGO_KEEP_0__

name: Build source code on ios

on:
  push:
    tags:
      - '*'

jobs:
  build_ios:
    runs-on: macOS-latest
    steps:
      - uses: actions/checkout@v6
      - name: Set Node.js
        uses: actions/setup-node@v6
        with:
          node-version: 24
          cache: npm
      - name: Install dependencies
        id: install_code
        run: npm ci
      - name: Build
        id: build_code
        run: npm run build
      - uses: actions/cache@v5
        with:
          path: ios/App/Pods
          key: ${{ runner.os }}-pods-${{ hashFiles('**/Podfile.lock') }}
          restore-keys: |
            ${{ runner.os }}-pods-
      - name: Sync
        id: sync_code
        run: npx cap sync
      - uses: ruby/setup-ruby@v1
        with:
          ruby-version: '3.0'
          bundler-cache: true
      - uses: maierj/fastlane-action@v3.1.0
        env:
          APP_STORE_CONNECT_TEAM_ID: ${{ secrets.APP_STORE_CONNECT_TEAM_ID }}
          BUNDLE_IDENTIFIER: ${{ secrets.BUNDLE_IDENTIFIER }}
          BUILD_CERTIFICATE_BASE64: ${{ secrets.BUILD_CERTIFICATE_BASE64 }}
          BUILD_PROVISION_PROFILE_BASE64: ${{ secrets.BUILD_PROVISION_PROFILE_BASE64 }}
          APPLE_KEY_ID: ${{ secrets.APPLE_KEY_ID }}
          APPLE_ISSUER_ID: ${{ secrets.APPLE_ISSUER_ID }}
          APPLE_KEY_CONTENT: ${{ secrets.APPLE_KEY_CONTENT }}
          P12_PASSWORD: ${{ secrets.P12_PASSWORD }}
          APPLE_PROFILE_NAME: ${{ secrets.APPLE_PROFILE_NAME }}
        with:
          lane: ios beta
      - name: Upload release bundle
        uses: actions/upload-artifact@v6
        with:
          name: ios-release
          path: ./App.ipa
          retention-days: 10

This workflow should be triggered after each GitHub tag, si vous avez besoin d'automatiser les balises, veuillez vous référer à Construction automatique et de mise en production avec GitHub actions premier.

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

Chaque fois que vous envoyez un nouveau commit, une mise en production sera construite 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 JS est préféré.

8. Déclencher le flux de travail

Créer un Commit

Faire un commit, vous devriez voir le flux de travail actif dans le dépôt.

Déclenchez le flux de travail

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

Démarré avec le commit

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

Tableau de bord Testflight

9. Puis-je déployer depuis la machine locale ?

Oui, vous pouvez, et cela est sans effort.

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

Guides de configuration CI/CD

Autres plateformes de CI/CD

Mises à jour en temps réel & Déploiement

Merci

Cet article repose sur les articles suivants :

Mises à jour en temps réel pour les applications Capacitor

Lorsqu'un bug de la couche web est en ligne, expédiez la correction par le biais de Capgo au lieu d'attendre des jours pour l'approbation de l'app store. Les utilisateurs reçoivent la mise à jour en arrière-plan tandis que les modifications natives restent dans la voie de revue normale.

Commencez dès maintenant

Dernières actualités de notre blog

Capgo vous offre les meilleures informations nécessaires pour créer une application mobile véritablement professionnelle.