Build iOS automatica di Capacitor con Codemagic

Continuous Delivery per iOS con Codemagic

Prerequisiti

Prima di continuare con il tutorial…

• Iscrizione al programma per sviluppatori iOS.
• Voglia di leggere 😆…

Da sapere sul prezzo

https://codemagic.io/pricing/

Il servizio è ‘gratuito’ fino a 500 minuti macOS M1 al mese, a seconda della macchina scelta.
Useremo una macchina macOS M1 , puoi vedere nello screenshot il prezzo e i limiti (prezzi al momento della creazione del tutorial, potrebbero cambiare in futuro)

🔴 Una volta chiariti requisiti e costi, se vi va, procediamo…

📣 Nel post diamo per scontato che l'app sia creata su iTunes Connect e che abbiamo già i certificati dell'ecosistema Apple; a tutto il resto penserà Codemagic!

Iniziamo! 🤿

Cosa imparerai in questo post

1. Usare API di App Store Connect con Codemagic
2. Requisiti
3. Creazione di una API Key per App Store Connect
4. Usare una API Key di App Store Connect
5. Copia i file Fastlane
6. Configura Codemagic

1. Usare API di App Store Connect con Codemagic

Da febbraio 2021, l'autenticazione a due fattori o la verifica in due passaggi è obbligatoria per accedere ad App Store Connect. Questo livello di sicurezza extra per il tuo Apple ID garantisce che solo tu possa accedere al tuo account.
Da Supporto Apple

Per iniziare con match dovrai revocare i certificati esistenti. Non preoccuparti, riceverai subito quelli nuovi.

Requisiti

Per poter utilizzare API di App Store Connect, Codemagic ha bisogno di tre cose.

1. ID dell'issuer.
2. ID chiave.
3. File della chiave o contenuto della chiave.

Creazione di una API Key per App Store Connect

Per generare le chiavi devi avere i permessi di Admin in App Store Connect. Se non li hai, puoi indicare questo articolo alla persona responsabile e seguire le istruzioni qui sotto.

1 — Accedi a App Store Connect.

2 — Seleziona Utenti e accesso.

3 — Seleziona la scheda API Keys.

4 — Clicca su Generate API Key o sul pulsante Add (+).

5 — Inserisci il nome della chiave e seleziona un livello di accesso. Consigliamo di scegliere App Manager diritti di accesso, scopri di più sui permessi dei ruoli dell'Apple Developer Program qui

6 — Clicca su Generate.

L'accesso di una chiave API non può essere limitato a singole app.

Nella pagina compaiono il nome della nuova chiave, il key ID, il link per il download e altre informazioni.

Recupera qui tutte e tre le informazioni necessarie: <1> Issue ID.
<2> Key ID.
<3> Clicca su “Download API Key” per scaricare la tua API private key. Il link per il download compare solo se la private key non è ancora stata scaricata. Apple non conserva una copia della private key. Quindi puoi scaricarla una sola volta.

🔴 Conserva la tua private key in un luogo sicuro. Non condividere mai le chiavi, non salvarle in un repository code e non includerle nel code lato client.

Aggiunta della chiave API di App Store Connect a Codemagic

1. Apri le impostazioni del Team su Codemagic, Seleziona le identità di firma code E carica il certificato

2. Clicca sul Aggiungi chiave pulsante.

3. Inserisci i App Store Connect API key nameSi tratta di un nome leggibile per la chiave, che verrà utilizzata per fare riferimento ad essa nelle impostazioni dell'applicazione.

4. Inserisci i Issuer ID e Key ID valori.

5. Clicca su Seleziona un file .p8 o trascina il file per caricare la chiave API di App Store Connect scaricata in precedenza.

6. Clicca su Salva.

Ora possiamo gestire Codemagic con la chiave API di App Store Connect, ottimo!

2. Crea certificati e provisioning profiles

Certificati

Apri Xcode e vai su Impostazioni > Account > Apple ID > Team e seleziona il tuo team.

Clicca su Gestisci certificati > + e selezionare Distribuzione Apple.

Poi puoi creare un nuovo certificato.

Poi devi andare su Keychain per scaricare il certificato come un .p12 file.

Per farlo, devi andare su keychain e passare a login keychain e poi vai sulla scheda I miei certificati.

Poi puoi selezionare il certificato che desideri scaricare. (Cerca in base alla data del certificato)

Poi fai clic destro sul certificato e seleziona Esporta.

Scegli il formato del file Scambio di informazioni personali (.p12).

Questo scaricherà il certificato come un .p12 file.

Profili di provisioning

Apri Apple Developer e seleziona il team corretto.

Poi crea un nuovo profilo cliccando su +

E seleziona App Store Connect.

Poi seleziona l'app corretta; fai attenzione a non usare i wildcard, altrimenti la firma fallirà.

Seleziona il certificato creato in precedenza (controlla la data di scadenza: deve coincidere con il giorno e il mese odierni) e clicca su Continua.

Infine, inserisci il nome del profilo e clicca su Genera.

Il nome verrà usato per identificare il profilo in Codemagic.

Puoi scaricare il profilo come .mobileprovision file.

Aggiunta del certificato di firma Code

Codemagic ti permette di caricare i certificati di firma code come archivi PKCS#12, contenenti sia il certificato che la chiave privata necessaria. Durante l'upload, Codemagic ti chiederà la password del certificato (se protetto) e un Nome di riferimento, che potrai poi utilizzare nella codemagic.yaml configurazione per recuperare il file specifico.

• Upload certificato
• Genera nuovo certificato
• Recupera dal Developer Portal

1. Apri le impostazioni del team su Codemagic, vai in impostazioni codemagic.yaml > identità di firma Code.
2. Apri Certificati iOS scheda.
3. Carica il file del certificato cliccando su Scegli un file .p12 o .pem o trascinandolo nel riquadro indicato.
4. Inserisci il Password del certificato e scegli un Nome di riferimento.
5. Clicca su Aggiungi certificato

Aggiunta del provisioning profile

Codemagic ti permette di caricare un provisioning profile da usare per l'app o di scaricarne uno direttamente dall'Apple Developer Portal.

Per ogni profilo aggiunto alle identità di firma di Code, vengono visualizzati tipo, team, bundle ID e data di scadenza. Inoltre, Codemagic ti segnalerà se è disponibile un certificato di firma code corrispondente nelle identità di firma di Code (con un segno di spunta verde nel Certificato campo) o meno.

3. Configura Codemagic

Configura i secret di Codemagic

Ti sei mai chiesto da dove vengono i valori di ENV vengono? Beh, non è più un segreto: vengono dai secret del tuo progetto. 🤦

4. Configura il file di workflow di Codemagic

Crea un file chiamato codemagic.yml nella root del tuo progetto e aggiungi quanto segue.

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

Questo workflow dovrebbe essere attivato manualmente o dopo ogni GitHub tag, se hai bisogno di automatizzare i tag, consulta Build e release automatiche con le action di GitHub prima.

Questo workflow recupererà le dipendenze NodeJS, le installerà e farà la build della tua app JavaScript.

Ogni volta che invii un nuovo tag, verrà creata una release in TestFlight.

La tua app non deve usare Ionic, è obbligatoria solo la base di Capacitor; può avere vecchi moduli Cordova, ma è preferibile il plugin JS di Capacitor.

5. Trigger del workflow

Triggera il workflow

Pusha i nuovi commit sul branch main o development per triggerare il workflow.

Dopo pochi minuti, la build sarà disponibile nella dashboard di App Store Connect.

Avvia manualmente

Puoi avviare il workflow manualmente.

Seleziona prima l'app che vuoi buildare, poi clicca su Avvia nuova build.

Poi seleziona il branch da buildare.

E clicca su Avvia nuova build.

Poi vai alla lista dei build

E clicca sul build per vedere il risultato.

Puoi deployare dalla tua macchina locale

Sì, puoi farlo, ed è semplicissimo.

Puoi usare Xcode per buildare e firmare la tua app, come sempre.

Grazie

Questo blog si basa sui seguenti articoli:

• Continuous delivery per iOS usando Codemagic e le action di GitHub
• Documentazione Codemagic
• Questo messaggio GitHub di @mrogunlana

Continua con l'automatico Capacitor IOS build con Codemagic

Se stai usando Build iOS automatica di Capacitor con Codemagic per pianificare l'automazione CI/CD e connetterla a CI/CD con Capgo per il workflow del prodotto in Capgo CI/CD, Capgo Native Build per il workflow di prodotto in Capgo Native Builds, Integrazioni Capgo per il workflow di prodotto in Integrazioni Capgo, Integrazione CI/CD per i dettagli implementativi in CI/CD Integration, e Integrazione GitHub Actions per i dettagli implementativi in GitHub Actions Integration.