Automatic Capacitor IOS build with Codemagic

Penyaluran Terus-menerus untuk iOS menggunakan Codemagic

Prasyarat

Sebelum melanjutkan dengan tutorial...

• Anggota program pengembang iOS.
• Keinginan untuk membaca 😆…

Hal yang penting tentang harga

https://codemagic.io/pricing/

Pelayanan ini adalah ‘gratis’ sampai dengan 500 menit macOS M1 per bulan, tergantung pada mesin yang dipilih.
Kami akan menggunakan sebuah macOS M1 mesin, Anda dapat melihat di screenshot harga dan batasan-batasannya (harga sesuai dengan waktu pembuatan tutorial, mereka mungkin mengalami perubahan di masa depan)

🔴 Setelah diingatkan tentang spesifikasi dan harga, jika Anda suka, kita melanjutkan…

📣 Dalam postingan ini kita asumsikan bahwa kita telah memiliki aplikasi yang dibuat di iTunes connect, kita memiliki sertifikat dari ekosistem Apple, semua akan diatur oleh Codemagic!

Mari kita mulai 🤿

Langkah-langkah untuk diikuti dalam postingan ini

1. Menggunakan App Store Connect API dengan Codemagic
2. Persyaratan
3. Membuat Kunci App Store Connect API
4. Menggunakan Kunci App Store Connect API
5. Mengcopy File Fastlane
6. Mengonfigurasi Codemagic

1. Menggunakan App Store Connect API dengan Codemagic

Mulai Februari 2021, verifikasi dua faktor atau verifikasi dua langkah diperlukan untuk semua pengguna untuk masuk ke App Store Connect. Layer keamanan tambahan untuk ID Apple Anda membantu memastikan bahwa Anda adalah satu-satunya orang yang dapat mengakses akun Anda.
Dari Bantuan Apple

Mulai dengan match memerlukan Anda untuk membatalkan sertifikat yang sudah ada. Tapi jangan khawatir, Anda akan mendapatkan yang baru secara langsung.

Persyaratan

Untuk dapat menggunakan App Store Connect API, Codemagic memerlukan tiga hal.

1. ID Issuer.
2. ID Kunci.
3. File kunci atau Konten kunci.

Membuat Kunci App Store Connect API

Untuk menghasilkan kunci, Anda harus memiliki izin Admin di App Store Connect. Jika Anda tidak memiliki izin tersebut, Anda dapat mengarahkan orang yang relevan ke artikel ini dan mengikuti instruksi yang berikut.

1 — Masuk ke App Store Connect.

2 — Pilih Pengguna dan Akses.

3 — Pilih tab Kunci API.

4 — Klik Generate API Kunci atau tombol (+) Tambah.

5 — Masukkan nama untuk kunci dan pilih tingkat akses. Kami merekomendasikan memilih App Manager hak akses, baca lebih lanjut tentang peran izin Apple Developer Program di sini Kunci __CAPGO_KEEP_0__ App Store Connect membuat nama

7 — Masukkan nama untuk kunci dan pilih tingkat akses. Kami merekomendasikan memilih

Sebuah API kunci tidak dapat di batasi aksesnya hanya untuk aplikasi tertentu.

Nama kunci baru, ID kunci, tautan download, dan informasi lainnya muncul di halaman.

Ambil semua informasi yang diperlukan di sini: <1> ID masalah.
<2> ID kunci.
<3> Klik "Unduh API Kunci" untuk mengunduh kunci pribadi API. Tautan download hanya muncul jika kunci pribadi belum diunduh. Apple tidak menyimpan salinan kunci pribadi. Jadi, Anda hanya dapat mengunduhnya sekali.

🔴 Simpan kunci pribadi Anda di tempat yang aman. Anda tidak boleh berbagi kunci, menyimpan kunci di code repository, atau termasuk kunci di sisi klien code.

Menambahkan kunci API App Store Connect ke Codemagic

1. Buka pengaturan Tim Codemagic Anda. Pilih identitas tanda tangan code Dan unggah sertifikat

2. Klik tombol Tambah kunci button.

3. Masukkan App Store Connect API key name . Ini adalah nama yang dapat dibaca manusia untuk kunci yang akan digunakan untuk mengacu pada kunci kemudian dalam pengaturan aplikasi.

4. Masukkan Issuer ID dan Key ID nilai-nilai.

5. Klik pada Pilih file .p8 atau drag file untuk mengunggah kunci App Store Connect API yang telah didownload sebelumnya.

6. Klik Simpan.

Kini kita dapat mengelola Codemagic dengan menggunakan kunci App Store Connect API, hebat!

2. Buat sertifikat dan profil pengaturan

Sertifikat

Buka XCode dan pergi ke Pengaturan > Akun > ID Apple > Tim dan pilih tim Anda.

Klik pada Pengelola sertifikat > + dan pilih Distribusi Apple.

Maka Anda dapat membuat sertifikat baru.

Kemudian Anda perlu pergi ke keychain untuk mengunduh sertifikat sebagai .p12 file.

Untuk melakukan hal ini, Anda perlu pergi ke keychain, ubah ke keychain login, kemudian tab keychain login keychain login keychain login.

Dan kemudian klik kanan pada sertifikat dan pilih

Export Pilih format file.

Pilih Personal Information Exchange (.p12) keychain login.

akan mengunduh sertifikat sebagai sebuah .p12 file.

Profil Pengaturan

Buka Pengembang Apple dan pilih tim yang tepat.

Kemudian buat profil baru, dengan mengklik pada +

dan pilih Pengaturan App Store.

Kemudian Anda perlu memilih aplikasi yang tepat, berhati-hatilah karena Anda tidak dapat menggunakan wildcard lainnya, karena proses signing akan gagal.

Pilih sertifikat yang tepat yang telah Anda buat sebelumnya (carilah tanggal kadaluarsa, harus sama hari dan bulan dengan hari ini) dan klik pada Teruskan.

Masukkan akhirnya nama profil dan klik pada Generate.

Nama profil akan digunakan untuk mengidentifikasi profil di Codemagic.

Anda dapat mengunduh profil sebagai .mobileprovision file.

Menambahkan sertifikat tanda tangan Code

Codemagic memungkinkan Anda mengunggah sertifikat code tanda tangan sebagai arsip PKCS#12 yang berisi baik sertifikat dan kunci pribadi yang diperlukan untuk menggunakan itu. Ketika mengunggah, Codemagic akan meminta Anda untuk menyediakan kata sandi sertifikat (jika sertifikat dilindungi kata sandi) bersama dengan nama referensi unik Nama Referensi, yang kemudian dapat digunakan dalam codemagic.yaml konfigurasi untuk mengambil file yang spesifik.

• Unggah Sertifikat
• Generasi Sertifikat Baru
• Dapatkan dari Portal Pengembang

1. Buka pengaturan tim Codemagic Anda, pergi ke pengaturan codemagic.yaml > Identitas Tanda Tangan Code.
2. Buka Sertifikat iOS tab.
3. Unggah file sertifikat dengan mengklik pada Pilih file .p12 atau .pem atau dengan menariknya ke dalam frame yang ditunjuk.
4. Masukkan Sandi sertifikat dan pilih Nama referensi.
5. Klik Tambahkan sertifikat

Mengatur profil pengaturan

Codemagic memungkinkan Anda untuk mengunggah profil pengaturan ke aplikasi atau untuk mengambil profil dari Portal Pengembang Apple.

Jenis profil, tim, ID paket, dan tanggal kedaluwarsa profil yang ditambahkan ke identitas tanda tangan Code ditampilkan. Selain itu, Codemagic akan memberitahu Anda apakah ada sertifikat tanda tangan code yang sesuai tersedia di identitas tanda tangan Code (tanda centang hijau di bidang) Sertifikat 3. Mengatur Codemagic

Mengatur rahasia Codemagic

Jadi, Anda penasaran dari mana nilai dari bidang

berasal? Nah, itu tidak lagi rahasia – itu dari rahasia proyek Anda. ENV 4. Mengatur file aliran Codemagic

Membuat file bernama

di root proyek Anda dan tambahkan kode berikut. codemagic.yml Aliran ini harus diaktifkan secara manual atau setelah setiap __CAPGO_KEEP_0__

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 tagjika Anda memerlukan untuk mengautomatisasi tag, silakan refer ke Automatic build dan release dengan GitHub actions pertama.

Kemudian alur kerja ini akan menarik dependensi NodeJS Anda, menginstalnya, dan membangun aplikasi JavaScript Anda.

Setiap kali Anda mengirimkan tag baru, rilis akan dibangun di TestFlight.

Aplikasi Anda tidak perlu menggunakan Ionic, hanya Capacitor base yang wajib, aplikasi dapat memiliki modul Cordova lama, tetapi Capacitor JS plugin yang disarankan.

5. Aktifkan alur kerja

Aktifkan alur kerja

Push perubahan kode ke cabang main atau development context: HTML teks fragmen dari string UI Capgo yang lebih panjang (parent key `alternatives_cta_questions`). Halaman/area: Halaman perbandingan live-update Capacitor. Peran: Paragraf pemasaran atau hukum yang panjang. Dilihat di: halaman alternatives.astro. Simpan Capgo produk/merek dan istilah pengembang secara tepat. Kunci pesan `alternatives_cta_questions` (Pertanyaan Tindakan Alternatif). | HTML teks fragmen dari string UI Capgo yang lebih panjang (parent key `appflow_cta_questions`). Halaman/area: Halaman perbandingan/migrasi pemasaran Appflow. Peran: Paragraf pemasaran atau hukum yang panjang. Dilihat di: halaman ionic-appflow.astro. Simpan Capgo produk/merek dan istilah pengembang secara tepat. Kunci pesan `appflow_cta_questions` (Pertanyaan Tindakan Appflow). | HTML teks fragmen dari string UI Capgo yang lebih panjang (parent key `capwesome_cta_questions`). Halaman/area: Halaman perbandingan Capawesome. Peran: Paragraf pemasaran atau hukum yang panjang. Dilihat di: halaman capwesome.astro. Simpan Capgo produk/merek dan istilah pengembang secara tepat. Kunci pesan `capwesome_cta_questions` (Pertanyaan Tindakan Capwesome). | Halaman/area: Halaman perbandingan/migrasi pemasaran Appflow. Peran: Label UI singkat atau item navigasi. Dilihat di: halaman ionic-appflow.astro, halaman ionic-enterprise-plugins.astro, halaman solusi/ionic-enterprise-plugins.astro. Kunci pesan `appflow_plugins_or` (Appflow Plugins Atau). | Aktifkan alur kerja.

Setelah beberapa menit, build harus tersedia di dashboard App Store Connect Anda.

Mulai secara manual

Kamu bisa memulai workflow secara manual.

Pilih terlebih dahulu aplikasi yang ingin kamu bangun, kemudian klik pada context: Halaman/area: Pembangun Capgo / produk halaman build cloud native. Peran: Label UI singkat atau item navigasi. Pesan kunci `native_build_builder_credit_first` (Kredit Pembangun Build Native Pertama)..

Pilih aplikasi

Pilih cabang Kemudian klik pada.

Maka silakan lihat daftar build

Dan klik pada build untuk melihat hasilnya.

Apakah bisa mengdeploy dari mesin lokal?

Ya, kamu bisa, dan itu sangat mudah.

Kamu bisa menggunakan Xcode untuk membangun dan menandatangani aplikasi kamu, seperti biasa.

Saya berterima kasih

Blog ini didasarkan pada artikel berikut:

• Pengiriman terus-menerus untuk IOS menggunakan Codemagic dan GitHub aksi
• Dokumentasi Codemagic
• Pesan GitHub dari @mrogunlana

Teruskan dari Pembangunan IOS Otomatis Capacitor dengan Codemagic

Jika Anda menggunakan Pembangunan IOS Otomatis Capacitor dengan Codemagic untuk merencanakan otomatisasi CI/CD, hubungkannya dengan Capgo Otomatisasi CI/CD untuk alur kerja produk di Capgo Otomatisasi CI/CD, Capgo Pembangunan Asli untuk alur kerja produk di Capgo Pembangunan Asli, Capgo Integrasi for the product workflow in Capgo Integrations, untuk alur kerja produk di __CAPGO_KEEP_0__ Integrasi, Integrasi CI/CD GitHub Aksi Integrasi untuk detail implementasi di GitHub Aksi Integrasi.