Lompat ke konten utama
CI/CD

Pembangunan Otomatis Capacitor IOS dengan GitHub aksi dengan sertifikat

Cara Mengatur Pipa CI/CD untuk Aplikasi IOS Ionic Anda menggunakan fastlane dan GitHub Actions dalam 5 menit (2024)

Martin Donadieu

Martin Donadieu

Pengembang Konten

Membangun Otomatis Capacitor IOS dengan GitHub aksi dengan sertifikat

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

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

Capgo Build untuk CI/CD oleh Capgo

Lepaskan diri dari pemeliharaan Fastlane, runner Xcode, sertifikat, profil pengaturan, dan skrip unggah. Capgo Pembangunan melakukan pembangunan iOS native yang ditandatangani dari pipeline CI/CD yang ada:

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

Harga

  • Paket Capgo mulai dari $12/bulan
  • Termasuk pembaruan OTA dan sekitar 15 bangun natively per bulan
  • Menit tambahan bangun akan dibebankan melalui kredit per menit

Tetapkan Capgo Bangun di CI/CD

Petunjuk Pengaturan Manual

Berikut adalah apa 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 bagian dari program keanggotaan pengembang iOS.
  • Pastikan Anda telah menginstal Fastlane di mesin pengembangan Anda.

Informasi penting tentang harga

Harga GitHub Aksi

https://github.com/features/actions

Jasa ini adalah ‘gratis’ sampai batas, tergantung pada mesin yang dipilih.
Kita akan menggunakan sebuah mesin macOS , Anda bisa melihat harga dan batasan (harga pada saat pembuatan tutorial, mereka mungkin mengalami perubahan di masa depan)

Setelah diingatkan tentang persyaratan dan harga, mari kita lanjutkan.

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 untuk diikuti dalam pos

  1. Menggunakan App Store Connect API dengan Fastlane
    • Persyaratan:
      • Membuat Kunci App Store Connect API
      • Menggunakan Kunci App Store Connect API
  2. Salin File Fastlane
  3. Konfigurasi 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 memungkinkan Fastlane dapat menggunakan App Store Connect API untuk mengunggah aplikasi Anda, Anda perlu menyediakan hal-hal berikut: tiga hal:

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

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

Akses Pengguna App Store Connect Integrasi API

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

Akses Pengguna App Store Connect API membuat kunci

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

Akses Pengguna App Store Connect API membuat nama kunci

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 Pengelola Aplikasi.

  1. Klik Generate.

Kunci API tidak dapat dibatasi aksesnya hanya untuk aplikasi tertentu.

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

Download Kunci 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 Kunci API” untuk mendownload kunci pribadi API. Tautan download hanya muncul jika kunci pribadi belum pernah didownload. Apple tidak menyimpan salinan kunci pribadi. Jadi, Anda hanya dapat mendownloadnya sekali.

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

Menggunakan Kunci App Store Connect API

File Kunci API (file p8 yang Anda download), ID kunci, dan ID pengembang diperlukan untuk membuat token JWT untuk otorisasi. Ada beberapa cara untuk melewati informasi ini ke Fastlane. Saya memilih untuk menggunakan aksi baru Fastlane app_store_connect_api_key. Anda dapat belajar cara lainnya di Dokumentasi Fastlane. Saya menunjukkan metode ini karena saya pikir cara 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 kunci API, bagus!

2. Sertifikat

Buka XCode dan pergi ke Pengaturan &gt; Akun &gt; ID Apple &gt; 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 + dan pilih Distribusi Apple

Distribusi Apple

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

Untuk melakukan hal itu, Anda perlu pergi ke keychain, kemudian pilih tab login keychain Sertifikat Saya.

Sertifikat Saya

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

Dan kemudian klik kanan pada kunci pribadi pada sertifikat dan pilih Export.

Pilih format file Informasi Pribadi (Personal Information Exchange) (.p12).

Itu akan mengunduh sertifikat sebagai .p12 file.

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

base64 -i BUILD_CERTIFICATE.p12 | pbcopy

Ini akan menjadi rahasmu. Selain itu, ketika diminta, silakan berikan kata sandi sertifikat. Kata sandi ini akan menjadi rahasmu. BUILD_CERTIFICATE_BASE64 3. Profil pengaturan P12_PASSWORD Buka

Pengembang Apple

dan pilih tim yang tepat. Lalu buat profil baru, dengan mengklik pada Buat profil baru

dan pilih tim yang tepat. +

__CAPGO_KEEP_0__

__CAPGO_KEEP_1__ App Store Connect.

Pilih App Store Connect

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

Pilih aplikasi yang tepat

Pilih sertifikat yang tepat yang Anda buat 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 Buat.

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

Buat profil

Anda bisa mengunduh profil sebagai .mobileprovision file.

Unduh profil

Silakan mengubah profil ke Base64 dan simpan sebagai rahasia (BUILD_PROVISION_PROFILE_BASE64).

base64 -i BUILD_PROVISION_PROFILE.mobileprovision | pbcopy

4. Salin file Fastlane

Fastlane adalah sebuah library Ruby yang dibuat untuk otomatisasi 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.

Buat folder Fastlane di root direktori proyek Capacitor/Ionic Anda dan tambahkan file Fastfile di sana:

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

Ini adalah tingkat yang sama dengan package.json, capacitor.config.*, dan folder. ios/ Jangan membuatnya di dalam 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

Aksi GitHub menggunakan rahasia repositori 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 file

berikutnya di samping <project-root>/fastlane/.env . Jangan komit file ini. Tambahkan Fastfileke dalam fastlane/.env pertama (atau pastikan sudah diabaikan). Berikut adalah contoh: .gitignore Mendapatkan 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=

Pergi ke

Pusat Pengembang dan gulir ke bawah ke bagian. Membership details Baca lebih lanjut tentang Team ID adalah nilai yang perlu Anda tetapkan di APP_STORE_CONNECT_TEAM_ID secret.

app-store-connect-team-id

Mendapatkan BUNDLE_IDENTIFIER

  1. Buka Xcode
  2. Klik dua kali pada App di navigator proyek
  3. Lalu klik tab Signing and Capabilities
  4. Salin nilai dari Bundle identifier. Ini adalah nilai yang perlu Anda tetapkan di BUNDLE_IDENTIFIER secret.
bundle-identifier-xcode

6. Membangun Pengolahan

Dalam GitHub Aksi, Biaya Anda berdasarkan menit yang Anda gunakan untuk menjalankan alur kerja CI/CD Anda. Dari pengalaman saya, membutuhkan sekitar 10–15 menit sebelum sebuah bangun dapat diproses di App Store Connect.

Untuk proyek pribadi, biaya perkiraan per bangun 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 menyetel skip_waiting_for_build_processing ke true. Ini akan menyimpan menit bangun dengan tidak menunggu App Store Connect untuk selesai memproses bangun.

Namun, ada pertukaran - Anda harus memperbarui informasi kesesuaian aplikasi Anda di App Store Connect sebelum Anda dapat mendistribusikan bangun ke pengguna.

Optimasi ini lebih berguna untuk proyek pribadi di mana menit bangun berbiaya. Untuk proyek publik/gratis, menit bangun gratis jadi tidak perlu mengaktifkan pengaturan ini. Lihat GitHub’s halaman harga untuk informasi lebih lanjut.

7. Setup GitHub Aksi

Konfigurasi GitHub rahasia

Silakan salin rahasia dari file dan tempelkan ke rahasia __CAPGO_KEEP_0__ di repository. .env file and paste them into the GitHub repository secrets.

Pengaturan &gt; Rahasia dan variabel &gt; Aksi &gt; &gt; Rahasia Repositori Baru

github-rahasia

2. BUILD_CERTIFICATE_BASE64 - Sertifikat yang dikodekan dalam Base64.

3. BUILD_PROVISION_PROFILE_BASE64 - Profil Pengaturan yang dikodekan dalam Base64.

4. BUNDLE_IDENTIFIER - Identifikasi Paket Aplikasi Anda.

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

6. APPLE_ISSUER_ID — Kunci API App Store Connect 🔺ID Penerbit.

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

8. Konfigurasi file GitHub workflow

Buat direktori GitHub workflow.

cd .github/workflows

Dalam folder tersebut, buat file bernama __CAPGO_KEEP_0__ dan tambahkan kode berikut. workflow Alur ini harus diaktifkan setelah setiap __CAPGO_KEEP_0__ tag. build-upload-ios.ymlJika Anda perlu otomatisasi tag, silakan lihat

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

Automatic build dan release dengan GitHub actions pertama. Kemudian, alur ini akan pull dependensi NodeJS, menginstalnya, dan membangun aplikasi JavaScript Anda.Setiap kali Anda mengirimkan commit baru, rilis akan dibangun di TestFlight. Aplikasi Anda tidak perlu menggunakan Ionic, hanya GitHub base yang wajib, dan dapat memiliki modul Cordova lama, tetapi __CAPGO_KEEP_1__ JS plugin lebih disarankan. Create a __CAPGO_KEEP_0__ workflow directory.

Inside the

folder, create a file named

Your App doesn’t need to use Ionic, only Capacitor base is mandatory., it can have old Cordova module, but Capacitor JS plugin should be preferred.

8. Aktifkan alur kerja

Buat Komit

Buat komi , 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, build harus tersedia di dashboard App Store Connect Anda.

Testflight Dashboard

Mengapa saya tidak 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

Platform CI/CD Alternatif

Pembaruan Hidup &amp; Pengembangan

Terima Kasih

Blog ini didasarkan pada artikel berikut:

Teruslah dari Pembangunan IOS Otomatis Capacitor dengan aksi-aksi GitHub dengan sertifikat

Jika Anda menggunakan Pembangunan IOS Otomatis Capacitor dengan aksi-aksi GitHub dengan sertifikat untuk merencanakan otomatisasi CI/CD, hubungkannya dengan Capgo CI/CD untuk alur kerja produk di Capgo CI/CD, Capgo Pembangunan Nativ untuk alur kerja produk di Capgo Pembangunan Asli 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 review normal.

Mulai Sekarang

Terbaru dari Blog Kami

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