메인 콘텐츠로 건너뛰기
CI/CD

Codemagic을 사용하여 자동화된 Capacitor IOS 빌드

Codemagic과 Codemagic을 사용하여 5분 이내에 IOS Ionic 앱의 CI/CD PIPELINE을 설정하는 방법 (2024)

기사 저자

마틴 도나디유

작성자

발레리아

리뷰어

조던

편집자

Codemagic을 사용하여 자동화된 Capacitor IOS 빌드

iOS에서 Codemagic을 사용한 지속적인 배포

필요한 조건

이 튜토리얼을 계속 진행하기 전에…

  • iOS 개발자 프로그램 회원입니다.
  • 읽고 싶은 마음이 드는…

가격에 대한 중요한 점

가격 Codemagic Action

https://codemagic.io/pricing/

서비스는 '월 500개의 macOS M1 분/월, 선택한 기기를 따라서 무료입니다. 우리는 다음을 사용할 것입니다
We are going to use a macOS M1 기기, 스크린샷에 보이는 가격과 제한 (가격은 이 글을 작성할 당시의 가격이며 미래에 변경될 수 있음)

🔴 요구 사항과 가격에 대해 경고된 후, 만약에 좋다면 계속…

📣 이 글에서 우리는 iTunes Connect에 앱을 생성했으며 Apple 생태계의 인증서를 가지고 있다고 가정합니다. 모든 설정은 Codemagic에 의해 수행됩니다!

들어가 봅시다!

이 글에서 따르는 단계

  1. App Store Connect API을 사용하여 Codemagic
  2. 요구 사항
  3. App Store Connect API 키 생성
  4. App Store Connect API 키 사용
  5. Fastlane 파일 복사
  6. Codemagic 설정

1. App Store Connect API을 사용하여 Codemagic

2021년 2월부터 모든 사용자가 App Store Connect에 로그인하기 위해 2단계 인증 또는 2단계 인증이 필요합니다. 이 추가 보안 계층은 Apple ID에 대한 보안을 강화하여 계정에 액세스할 수 있는 사람을 단일 개인으로만 보장합니다.
From Apple Support

match에 대한 시작을 위해 existing certificates를 취소해야 하지만, 걱정하지 마세요. 새로운 인증서를 직접 받을 것입니다.

Requirements

App Store Connect API을 사용하려면 Codemagic은 세 가지 Issuer ID.

  1. Key ID.
  2. Key file 또는 Key content.
  3. three

애플 스토어 연결 API 키를 생성하는 중입니다.

App Store Connect 키를 생성하려면, App Store Connect에서 Admin 권한이 있어야 합니다. 권한이 없다면, 이 문서를 공유하고 아래의 지침을 따라야 합니다.

1 — 애플 스토어 연결에 로그인합니다. 애플 스토어 연결.

2 — 사용자 및 액세스 애플 스토어 연결 사용자 액세스.

3 — __CAPGO_KEEP_0__ 키 탭을 선택합니다.

애플 스토어 연결 API 키

4 — API 키 생성 또는 (+) 버튼을 클릭합니다.

App Store Connect API 키 생성

5 — 키 이름을 입력하고 액세스 수준을 선택합니다. 우리는 선택을 }API 추천합니다.

__CAPGO_KEEP_0__ App Manager 접근 권한, Apple Developer Program 역할 권한에 대한 자세한 내용을 읽어보세요. 여기

App Store Connect API 키 이름을 생성하세요.

6 — Generate을 클릭하세요.

API 키의 접근 권한은 특정 앱으로 제한할 수 없습니다.

__CAPGO_KEEP_0__ 키의 이름, 키 ID, 다운로드 링크 및 기타 정보가 페이지에 나타납니다.

App Store Connect에서 키 다운로드

필요한 세 가지 정보를 모두 여기서 확인하세요: <1> Issue ID.
<2> Key ID.
<3> API 키를 다운로드하려면 "API" 개인 키 다운로드"를 클릭하세요. 개인 키가 다운로드되지 않은 경우만 다운로드 링크가 나타납니다. Apple은 개인 키의 복사본을 보관하지 않습니다. 따라서 개인 키를 한번만 다운로드할 수 있습니다.

🔴 개인 키를 안전한 곳에 저장하세요. 키를 공유하지 마세요, 키를 code 저장소에 저장하지 마세요, 또는 code에 키를 포함하지 마세요.

App Store Connect API 키를 Codemagic에 추가하세요.

  1. Codemagic 팀 설정을 열어 주세요. 팀 통합 선택 팀 열기 code 인증서 선택 code 인증서 선택 인증서 업로드 인증서 업로드

  2. 버튼을 클릭하세요. 키 추가 이름을 입력하세요. 이 키는 애플리케이션 설정에서 나중에 키를 참조할 때 사용됩니다.

  3. 이름을 입력하세요. 이 키는 애플리케이션 설정에서 나중에 키를 참조할 때 사용됩니다. App Store Connect API key name이름을 입력하세요. 이 키는 애플리케이션 설정에서 나중에 키를 참조할 때 사용됩니다.

  4. 자동 설정을 입력하세요. Issuer IDKey ID 파일을 선택하세요.

  5. 또는 App Store Connect __CAPGO_KEEP_0__ 키를 업로드하기 위해 파일을 드래그하세요. 클릭 or drag the file to upload the App Store Connect API key downloaded earlier.

  6. App Store Connect __CAPGO_KEEP_0__ 키를 사용하여 Codemagic을 관리할 수 있습니다. 좋습니다! 2. 인증서 및 배포 프로파일을 생성하세요..

Now we can manage Codemagic with the App Store Connect API key, great!

XCode를 열고

goto

저장 설정 > 계정 > 애플 ID > 팀을 선택하세요.

Code 서명 식별자

클릭 인증서 관리 > + 그리고 선택하세요 애플 배포.

애플 배포

그런 다음 새로운 인증서를 만들 수 있습니다.

그런 다음 인증서를 다운로드하기 위해 키 체인으로 이동해야 합니다. 인증서를 파일로 다운로드할 수 있습니다. .p12 이 작업을 수행하려면 키 체인으로 이동하여 로그인 키 체인으로 switch해야 합니다. 그런 다음 탭으로 이동하여

로그인 로그인 그런 다음 탭 내 인증서.

내 인증서

그런 다음 다운로드할 인증서를 선택할 수 있습니다. (인증서의 날짜를 확인하세요)

그리고 인증서를 오른쪽 클릭하고 선택하세요. Export.

파일 형식을 선택하세요. 개인 정보 교환 (.p12).

인증서를 파일로 다운로드합니다. .p12 배포 프로파일

열기

애플 개발자 올바른 팀을 선택하세요. 그런 다음 새로운 프로파일을 만들기 위해 클릭하세요.

Create a new profile +

Create a new profile

그리고 선택하세요 애플 스토어 연결.

애플 스토어 연결을 선택하세요

그런 다음 올바른 앱을 선택해야 합니다. 주의해야 합니다. 와일드 카드를 사용하면 서명이 실패할 것입니다.

올바른 앱을 선택하세요

애플 스토어 연결에서 올바른 인증서를 선택하세요. 만료일을 확인하세요. 오늘 날짜와 월이 같아야 합니다. 계속하기.

올바른 인증서를 선택하세요

마지막으로 프로필 이름을 입력하고 프로필 생성.

이름은 Codemagic에서 프로필을 식별하는 데 사용됩니다.

프로필을 생성하세요

다운로드 프로필을 파일 형식으로 받을 수 있습니다. .mobileprovision 파일.

프로필 다운로드

Code 서명 인증서를 추가합니다.

Codemagic은 PKCS#12 아카이브에 인증서와 개인 키가 포함된 code 서명 인증서를 업로드할 수 있게 해줍니다. 업로드 시, 인증서가 암호화된 경우 인증서 암호를 제공하도록 요청하고, 고유한 참조 이름, 이 참조 이름을 사용하여 codemagic.yaml 설정에서 특정 파일을 가져올 수 있습니다.

  • 인증서 업로드
  • 새 인증서 생성
  • 개발자 포털에서 가져오기
  1. Codemagic 팀 설정을 열고, 자동화된 Capacitor iOS 빌드 - Codemagic > Code 서명 식별자.
  2. 열기 iOS 인증서 탭.
  3. 인증서 파일을 업로드하려면 Choose a .p12 or .pem 파일 또는 지정된 프레임에 파일을 끌어다 놓습니다.
  4. Enter the 인증서 비밀번호Reference name.
  5. Click 인증서 추가

프로비전 프로파일 추가

Codemagic은 애플리케이션을 위한 프로비전 프로파일을 업로드하거나 애플리케이션 개발자 포털에서 프로파일을 가져올 수 있도록 허용합니다.

프로파일의 유형, 팀, 번들 ID, 만료일은 Code 서명 식별자에 추가된 각 프로파일에 표시됩니다. 또한, Codemagic은 code 서명 인증서가 Code 서명 식별자 (프로파일 추가란의 녹색 체크 마크)에서 사용할 수 있는지 여부를 알려줍니다. 인증서 3. Codemagic 설정

Codemagic 비밀 설정

프로젝트의 비밀에서 오는 건 비밀이 아니야 – 프로젝트의 비밀에서 오는 거야!

Ever wonder where the values of the ENV are coming from? Well, it’s not a secret anymore – it’s from your project’s secret. 🤦

4. Codemagic 워크플로우 파일을 구성하십시오.

Create a file named codemagic.yml 프로젝트의 루트 폴더에 이 파일을 생성하고 다음을 추가하십시오.

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

이 워크플로우는 수동으로 또는 각 GitHub 태그자동화 태그를 원한다면, __CAPGO_KEEP_0__ Automatic build and release with GitHub actions 먼저.

그런 다음 이 워크플로우는 NodeJS 의존성을 가져와 설치하고 JavaScript 앱을 빌드하십시오.

새로운 태그를 전송할 때마다 테스트 플라이트에서 릴리즈가 빌드됩니다.

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.

기반만 필요합니다. 오래된 Cordova 모듈을 사용할 수 있지만 __CAPGO_KEEP_1__ JS 플러그인은 선호됩니다.

작업 흐름을 트리거하세요.

새로 업데이트된 커밋을 branch로 푸시하세요. main 또는 development 작업 흐름을 트리거하세요.

or

작업 흐름을 트리거하세요.

or

or

or

or or.

or

그런 다음 선택하고 싶은 branch를 선택하세요.

Branch 선택

그리고 새로운 빌드를 시작하세요.

그런 다음 빌드 목록으로 가세요.

빌드 목록

그리고 빌드 결과를 확인하기 위해 빌드를 클릭하세요.

빌드 결과

로컬 머신에서 배포할 수 있습니다.

네, 가능합니다. 그리고 그것은 매우 쉬워요.

Xcode를 사용하여 앱을 빌드하고 서명할 수 있습니다. 항상 그대로입니다.

감사합니다

이 블로그는 다음 기사에 기반합니다.

자동 Capacitor IOS 빌드와 Codemagic

자동 __CAPGO_KEEP_0__ IOS 빌드와 Codemagic CI/CD 자동화 계획을 만드는 경우 Capacitor CI/CD와 연결하세요. __CAPGO_KEEP_0__ CI/CD Capgo CI/CD에서 제품 워크플로우 Capgo Native Builds Capgo Native Builds에서 제품 워크플로우 Capgo Capgo 통합 Capgo 제품 워크플로우를 위한 Capgo 통합 CI/CD 통합 Capgo 빌더 / 네이티브 클라우드 빌드 제품 페이지에서 CI/CD 통합 GitHub Actions Integration for the implementation detail in GitHub Actions Integration.

Capacitor 앱에 대한 실시간 업데이트

웹-layer 버그가 생기면 Capgo을 통해 즉시 수정할 수 있습니다. 앱 스토어 승인 기다리지 않고, 사용자는 배경에서 업데이트를 받을 수 있습니다.

__CAPGO_KEEP_0__의 최고의 통찰력을 제공하여真正의 전문가 모바일 앱을 만들 수 있도록 도와줍니다.

시작하기

최신 블로그

Capgo은 최고의 통찰력을 제공하여真正의 전문가 모바일 앱을 만들 수 있도록 도와줍니다.