Lompat ke konten utama
Integrasi CI/CD

Build IOS otomatis dengan Capacitor dan GitHub dengan sertifikat

Bagaimana cara mengatur pipeline CI/CD untuk aplikasi IOS Ionic Anda menggunakan fastlane dan GitHub Actions dalam waktu 5 menit (2024)

Martin Donadieu

Martin Donadieu

Pemasar Konten

Build IOS otomatis dengan Capacitor dan GitHub dengan sertifikat

Mengatur CI/CD untuk aplikasi Capacitor dapat rumit dan memakan waktu. Berikut ini yang perlu Anda ketahui:

Sekarang kami merekomendasikan penggunaan Capgo Build dengan Capgo dan CLI untuk pembangunan asli Capacitor. Petunjuk Fastlane ini disimpan untuk tim yang memelihara pipeline aksi GitHub yang sudah ada, tetapi pembangunan iOS baru harus menggunakan Capgo CLI sehingga Anda tidak perlu memelihara Fastlane, pengguna Xcode, sertifikat, dan skrip unggah sendiri.

Pembangunan Capgo untuk CI/CD oleh Capgo

Lepaskan pemeliharaan Fastlane, pengguna Xcode, sertifikat, profil pengaturan, dan skrip unggah. Pembangunan Capgo melakukan pembangunan iOS yang ditandatangani secara asli dari pipeline CI/CD yang sudah ada:

  • Bekerja dengan pipeline AndaTrigger Pembangunan Capgo dari GitHub Actions, GitLab CI, Jenkins, atau skrip lokal setelah pembangunan web Anda dan npx cap sync.
  • Tanda tangan dari rahasia CIPertahankan kunci App Store Connect, sertifikat, profil pengaturan, kata sandi, dan ID tim di rahasia CI Anda sendiri.
  • Tidak ada pemeliharaan pengguna runner asliPembangunan Capgo menyediakan lingkungan pembangunan Apple yang dipelihara, sehingga Anda tidak perlu mengelola pengguna macOS, gambar Xcode, atau jalur Fastlane.
  • Artikel dan pengiriman: Unduh artefak yang ditandatangani untuk QA atau kirimkan rilis build melalui Capgo CLI.

Pengaturan Harga

  • Capgo rencana mulai dari $12/bulan
  • Mengandung pembaruan OTA dan sekitar 15 build asli per bulan
  • Menit tambahan build yang dikenakan biaya per menit melalui kredit

Set up Capgo Build di CI/CD

Panduan Setup Manual

Ini yang perlu Anda lakukan:

Pengiriman Terus-menerus untuk iOS menggunakan Fastlane dan GitHub Aksi dan sertifikat

Prasyarat

Sebelum melanjutkan dengan tutorial:

  • Pastikan Anda telah menginstal Fastlane di mesin pengembangan Anda. Pastikan Anda merupakan anggota program pengembang iOS.
  • Informasi penting tentang harga

Harga __CAPGO_KEEP_0__ Action

https://GitHub.com/features/actions

https://github.com/features/actions

gratis’sampai batas tertentu, tergantung pada mesin yang dipilih. Kami akan menggunakan sebuah
macOS macOS Mesin, Anda dapat melihat harga dan batasan (harga pada saat pembuatan tutorial, mereka mungkin mengalami perubahan di masa depan)

Setelah diberi peringatan tentang persyaratan dan harga, mari kita melanjutkan.

Catatan: Dalam postingan saya, saya asumsikan Anda telah membuat aplikasi di App Store Connect. Informasi penting akan dicopy oleh Fastlane!

Apa yang akan Anda pelajari dalam tutorial ini

Langkah-langkah yang harus diikuti dalam postingan ini

  1. Menggunakan App Store Connect API dengan Fastlane
    • Persyaratan:
      • Membuat Kunci App Store Connect API
      • Menggunakan Kunci App Store Connect API
  2. Mengcopy File Fastlane
  3. Mengkonfigurasi GitHub Actions

1. Menggunakan App Store Connect API dengan Fastlane

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 Dukungan Apple

Persyaratan

Untuk Fastlane dapat menggunakan App Store Connect API untuk mengunggah aplikasi Anda, Anda perlu menyediakan hal-hal berikut tiga hal:

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

Menghasilkan 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.

  1. Masuk ke App Store Connect.

  2. Pilih Pengguna dan Akses.

Akses pengguna App Store Connect

3 — Pilih tab Integrasi.

App Store Connect API Integrasi

  1. Klik Generate API Key atau tombol (+) Tambah.

App Store Connect API kunci membuat

  1. Masukkan nama untuk kunci. Nama hanya untuk referensi Anda dan bukan bagian dari kunci itu sendiri.

App Store Connect API kunci membuat nama

6 — Di bawah Akses, pilih peran untuk kunci. Peran yang berlaku untuk kunci sama dengan peran yang berlaku untuk pengguna di tim Anda. Lihat izin akses. Kami merekomendasikan untuk memilih Manajer Aplikasi.

  1. Klik Generate.

Akses API sebuah kunci tidak dapat dibatasi pada aplikasi tertentu.

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

Kunci Download App Store Connect

Anda dapat mengambil semua tiga informasi yang diperlukan di sini.
<1> ID Masalah. (APPLE_ISSUER_ID rahasia)
<2> ID Kunci. (APPLE_KEY_ID rahasia)
<3> Klik "Download API Key" untuk mengunduh kunci API pribadi Anda. 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.

Menggunakan API Key App Store Connect

File API Key (p8 file yang Anda download), ID kunci, dan ID pengembang adalah diperlukan untuk membuat token JWT untuk otorisasi. Ada beberapa cara informasi ini dapat dimasukkan ke dalam Fastlane. Saya memilih untuk menggunakan aksi baru Fastlane app_store_connect_api_keySaya dapat menunjukkan cara lainnya di Dokumentasi FastlaneSaya menunjukkan metode ini karena saya pikir ini adalah cara yang paling mudah untuk bekerja dengan CI yang paling umum, di mana Anda dapat menetapkan variabel lingkungan.

Silakan mengonversi file p8 yang Anda download ke Base64 dan simpan sebagai rahasia (APPLE_KEY_CONTENT).

base64 -i APPLE_KEY_CONTENT.p8 | pbcopy

Sekarang kita dapat mengelola App Store Connect dengan Fastlane menggunakan API key, bagus!

2. Sertifikat

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

Code identitas tanda tangan

Klik pada Kelola sertifikat.

Jika Anda belum menciptakan sertifikat, Anda dapat membuat sertifikat baru.

Klik pada + Anda harus memilih Apple Distribution

Apple Distribution

Lalu Anda perlu pergi ke keychain untuk mendownload sertifikat sebagai .p12 file.

Untuk melakukan hal ini, Anda perlu pergi ke keychain, kemudian pilih tab login keychain dan kemudian tab My Certificates.

My Certificates

Lalu Anda dapat memilih sertifikat yang ingin Anda download. (Cari berdasarkan tanggal sertifikat)

Dan kemudian klik kanan pada kunci privat sertifikat dan pilih Ekspor.

Pilih format file Personal Information Exchange (.p12).

File tersebut akan didownload sebagai .p12 file.

Silakan buka file tersebut di terminal dan gunakan perintah berikut untuk mengubahnya ke Base64:

base64 -i BUILD_CERTIFICATE.p12 | pbcopy

Ini akan menjadi rahasmu. Selain itu, ketika diminta, silakan berikan password sertifikat. Password tersebut akan menjadi rahasmu. BUILD_CERTIFICATE_BASE64 3. Profil Pengaturan P12_PASSWORD Buka

Pengembang Apple

Profil Pengaturan Ekspor dan pilih tim yang tepat.

Lalu buatlah profil baru dengan mengklik pada +

Buat Profil Baru

Dan pilih App Store Connect.

Pilih App Store Connect

Lalu Anda harus memilih aplikasi yang tepat, berhati-hatilah karena Anda tidak bisa menggunakan wildcard lainnya, karena proses signing akan gagal.

Pilih Aplikasi yang Tepat

Pilih sertifikat yang tepat yang telah dibuat sebelumnya (lihat tanggal kadaluarsa, harus sama hari dan bulan dengan hari ini) dan klik pada Lanjutkan.

Pilih Sertifikat yang Tepat

Akhirnya masukkan nama profil dan klik pada Membuat.

Nama ini akan digunakan untuk mengidentifikasi profil di Fastlane, di bawah nilai APPLE_PROFILE_NAME.

Membuat profil

Anda dapat mengunduh profil sebagai .mobileprovision berkas.

Mengunduh profil

Toh, konversi profil ke Base64 dan simpan sebagai rahasia (BUILD_PROVISION_PROFILE_BASE64).

base64 -i BUILD_PROVISION_PROFILE.mobileprovision | pbcopy

4. Salin file-file Fastlane

Fastlane adalah sebuah library Ruby yang dibuat untuk mengotomasi tugas pengembangan mobile yang umum. Dengan menggunakan Fastlane, Anda dapat mengonfigurasi jalur kustom yang dapat menggabungkan serangkaian aksi yang melakukan tugas yang biasanya Anda lakukan menggunakan Android Studio. Anda dapat melakukan banyak hal dengan Fastlane, tetapi untuk tujuan tutorial ini, kita hanya akan menggunakan beberapa aksi inti.

Create the Fastlane folder at the root of your Capacitor/Ionic project and add the Fastfile there:

  • Folder: <project-root>/fastlane/
  • File: <project-root>/fastlane/Fastfile

This is the same level as package.json, capacitor.config.*, dan folder yang sama. ios/ folder. Jangan buat di dalamnya 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. Mengatur rahasia

GitHub Aksi menggunakan rahasia repository yang Anda konfigurasi di langkah berikutnya. Anda hanya memerlukan file lokal jika Anda ingin menjalankan atau menguji Fastlane dari mesin sendiri. .env Untuk pengujian lokal, buat

di samping <project-root>/fastlane/.env . Jangan komit file ini. Tambahkan Fastfileke dalam fastlane/.env pertama kali (atau pastikan sudah diabaikan). Berikut adalah contoh: .gitignore Mendapatkan nilai APP_STORE_CONNECT_TEAM_ID

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=

Getting the APP_STORE_CONNECT_TEAM_ID

Pergi ke Pusat Pengembang dan gulir ke bawah ke Membership details bagian. Nilainya adalah nilai yang perlu Anda atur dalam Team ID rahasia. APP_STORE_CONNECT_TEAM_ID app-store-connect-team-id

Mendapatkan BUNDLE_IDENTIFIER

Buka Xcode

  1. Dengan mengklik dua kali pada
  2. di navigator proyek App Lalu klik pada tab
  3. ]} (Note: The translation is based on the provided source text and may not be perfect. It's always recommended to have a native speaker review the translation for accuracy and cultural relevance.) The protected tokens were left unchanged as per the request. The translation was done in a way that it is natural for the user cultural context. The idioms, grammar, tone, and phrasing were adapted instead of translating word for word. The brand names, product names, developer terms, URLs, code identifiers, file paths, package names, language codes, numbers, punctuation, and whitespace meaning were preserved. The literal tokens were left unchanged as per the request. The placeholders were copied exactly as written. The translation is in the same order as the input. The translation is in Indonesian as per the request. The translation is in JSON format with exactly one key named Signing and Capabilities
  4. Salin nilai dari Bundle identifier. Ini adalah nilai yang perlu Anda tetapkan di BUNDLE_IDENTIFIER rahasia.
bundle-identifier-xcode

6. Proses Pengolahan

Dalam GitHub Aksi, biaya yang Anda bayar berdasarkan menit yang telah digunakan untuk menjalankan alur kerja CI/CD Anda. Dari pengalaman saya, membutuhkan waktu sekitar 10–15 menit sebelum proses pengolahan dapat dilakukan di App Store Connect.

Untuk proyek pribadi, biaya perkiraan per proses dapat mencapai $0.08/min x 15 menit = $1.2, atau lebih, tergantung pada konfigurasi dan dependensi proyek Anda.

Jika Anda khawatir tentang biaya untuk proyek pribadi, Anda dapat mengatur skip_waiting_for_build_processing To dapat menghemat waktu pembangunan menit dengan tidak menunggu App Store Connect untuk selesai memproses pembangunan. trueNamun, ada pertukaran - Anda harus memperbarui informasi kesesuaian aplikasi Anda secara manual di App Store Connect sebelum Anda dapat mendistribusikan pembangunan ke pengguna.

Optimasi ini lebih berguna untuk proyek pribadi di mana waktu pembangunan menit berbiaya.

This optimization is mainly useful for private projects where build minutes cost money. For public/free projects, the build minutes are free so there’s no need to enable this setting. See GitHub’s Lihat halaman harga __CAPGO_KEEP_0__ untuk informasi lebih lanjut. 7. Konfigurasi __CAPGO_KEEP_0__ Actions

Konfigurasi rahasia GitHub

Silakan salin rahasia dari file dan tempelkan ke rahasia GitHub di repository.

Pergi ke .env file and paste them into the GitHub repository secrets.

Konfigurasi __CAPGO_KEEP_0__ secrets Konfigurasi rahasia __CAPGO_KEEP_0__ &gt; Rahasia dan Variabel &gt; Aksi &gt; Rahasia Repositori Baru

github-rahasia

2. BUILD_CERTIFICATE_BASE64 - Sertifikat yang dikodekan Base64.

3. BUILD_PROVISION_PROFILE_BASE64 - Profil Pengaturan yang dikodekan Base64.

4. BUNDLE_IDENTIFIER - Identifikasi Paket Aplikasi Anda.

5. APPLE_KEY_ID — Kunci API App Store Connect 🔺ID Kunci.

6. APPLE_ISSUER_ID — ID Pengirim API App Store Connect 🔺

7. APPLE_KEY_CONTENT — App Store Connect API Kunci 🔺 Isi Kunci .p8, periksa

8. Konfigurasi GitHub file aliran

Buat direktori aliran GitHub.

cd .github/workflows

Dalam direktori tersebut, buat file bernama workflow dan tambahkan kode berikut. build-upload-ios.ymlAliran ini harus diaktifkan setelah setiap __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 , jika Anda perlu mengautomatisasi tag, silakan lihatAutomatic build dan release dengan __CAPGO_KEEP_0__ aksi Automatic build dan release dengan GitHub aksi pertama.

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

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

Aplikasi Anda tidak perlu menggunakan Ionic, hanya dasar Capacitor yang wajib, dan dapat memiliki modul Cordova lama, tetapi plugin JS Capacitor harus dipilih.

8. Aktifkan alur kerja

Buat Komit

Buat komit, Anda harus melihat alur kerja aktif di repository.

Aktifkan alur kerja

Push komit baru ke cabang main atau development untuk mengaktifkan alur kerja.

Dimulai dengan komit

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

Dashboard Testflight

9. Apakah saya bisa mengunduh dari mesin lokal?

Ya, Anda bisa, dan itu sangat mudah.

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

Panduan Pengaturan CI/CD

Alternatif Platform CI/CD

Pembaruan Hidup &amp; Pengembangan

Terima kasih

Blog ini berdasarkan artikel berikut:

Teruslah dari Pembangunan IOS Otomatis Capacitor dengan aksi GitHub dengan sertifikat

Jika Anda menggunakan Pembangunan IOS Otomatis Capacitor dengan aksi GitHub dengan sertifikat untuk merencanakan otomatisasi CI/CD, hubungkannya dengan Capgo Otomatisasi CI/CD untuk alur kerja produk di Capgo Otomatisasi CI/CD, Capgo Pembangunan Native untuk alur kerja produk di Capgo Pembangunan Native, Capgo Integrasi untuk alur kerja produk di Capgo Integrasi, Integrasi CI/CD untuk detail implementasi di Integrasi CI/CD, dan GitHub Integrasi Aksi untuk detail implementasi di GitHub Integrasi Aksi.

Pembaruan Langsung untuk Capacitor aplikasi

Ketika bug layer web masih aktif, kirimkan perbaikan melalui Capgo bukan menunggu hari-hari untuk persetujuan toko aplikasi. Pengguna mendapatkan pembaruan di latar belakang sementara perubahan native tetap dalam jalur ulasan normal.

Mulai Sekarang

Terbaru dari Blog kami

Capgo memberikan Anda wawasan terbaik yang Anda butuhkan untuk menciptakan aplikasi mobile yang benar-benar profesional.