메인 콘텐츠로 바로가기
CI/CD

자동 Capacitor IOS 빌드와 Codemagic

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

마틴 도나디우

마틴 도나디우

콘텐츠 마케터

자동 Capacitor IOS 빌드와 Codemagic

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

준비 사항

이 튜토리얼을 계속하기 전에...

  • iOS 개발자 프로그램 회원 가입
  • 읽고 싶은 욕망 😆…

가격에 대한 중요한 것

가격 Codemagic Action

https://codemagic.io/pricing/

서비스는 ‘무료’ 월 500개 이하의 macOS M1 분/월, 선택한 기계에 따라 달라집니다.
우리는 macOS M1 기계를 사용할 것입니다, 스크린샷에 보이는 가격과 제한 (가격은 튜토리얼이 생성된 시점의 가격이며 미래에 변경될 수 있습니다) 요구 사항과 가격에 대해 경고한 후, 만약 좋다면, 계속하겠습니다…

🔴 포스트에서는 iTunes Connect에서 앱을 생성했으며 Apple 생태계의 인증서를 가지고 있다고 가정합니다. 모든 설정은 Codemagic에 의해 설정됩니다!

📣 우리가 사용할 macOS M1 기계의 가격과 제한을 스크린샷에 보입니다 (가격은 튜토리얼이 생성된 시점의 가격이며 미래에 변경될 수 있습니다)

🤿에 들어가 봅시다

게시물에서 따르는 단계

  1. Codemagic과 함께 App Store Connect API 사용하기
  2. 필수 조건
  3. App Store Connect API 키 만들기
  4. App Store Connect API 키 사용하기
  5. Fastlane 파일 복사하기
  6. Codemagic 설정하기

1. Codemagic과 함께 App Store Connect API 사용하기

2021년 2월 이후로 모든 사용자는 App Store Connect에 로그인하기 위해 2단계 인증 또는 2단계 인증이 필요합니다. Apple ID에 대한 추가 보안层는 계정에 접근할 수 있는 사람을 보장하기 위해 도움이 됩니다.
출처 Apple Support

match를 사용하기 위해 시작하려면 기존 인증서를 취소해야 합니다. 그러나 걱정하지 마십시오. 새로운 인증서를 직접 받을 것입니다.

Requirements

App Store Connect API를 사용할 수 있도록 하려면, Codemagic은 API를 사용할 수 있어야 합니다. 세 가지가 필요합니다. Issuer ID.

  1. Key ID.
  2. Key file 또는 Key content.
  3. App Store Connect __CAPGO_KEEP_0__ Key를 생성하는 방법

Creating an App Store Connect API Key

1 — App Store Connect에 로그인하십시오.

1 — App Store Connect에 로그인하십시오. three.

2 — 사용자 선택 사용자 및 액세스.

애플 스토어 연결 사용자 액세스

3 — API 키 탭을 선택하세요.

애플 스토어 연결 API 키

4 — API 키 생성하기 또는 (+) 버튼을 클릭하세요.

애플 스토어 연결 API 키 생성

5 — 키 이름을 입력하고 액세스 권한을 선택하세요. 우리는 Apple Developer Program 역할 권한에 대해 더 많이 읽으실 수 있습니다. App Manager __CAPGO_KEEP_0__ 키 이름 6 — 생성하기를 클릭하세요.

App Store Connect API keys create name

애플 개발자 프로그램 역할 권한에 대해 더 많이 읽으실 수 있습니다.

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

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

애플 스토어 연결 다운로드 키

다음 세 가지 정보를 모두 가져오세요: 1. 이슈 ID.
2. 키 ID.
3. "API 키 다운로드"를 클릭하여 API 개인 키를 다운로드하세요. 다운로드 링크는 개인 키가 아직 다운로드되지 않은 경우에만 나타납니다. 애플은 개인 키의 복사본을 유지하지 않습니다. 따라서 개인 키를 한 번만 다운로드할 수 있습니다.

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

애플 스토어 연결 API 키를 코덤판지에 추가합니다.

  1. 코덤판지 팀 설정을 열어주세요. 팀 통합 선택 팀 열기 code 서명 식별자 선택 code 인증서를 선택하세요. 인증서를 업로드하세요. 인증서 업로드

  2. __CAPGO_KEEP_0__를 클릭하세요. 키 추가 버튼을 클릭하세요.

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

  4. 값을 입력하세요. Issuer ID 값을 입력하세요. Key ID __CAPGO_KEEP_0__를 클릭하세요.

  5. 버튼을 클릭하세요. __CAPGO_KEEP_0__ 파일을 선택하세요. 파일을 드래그하여 App Store Connect API 키를 다운로드한 earlier 시점의 업로드를 수행하세요.

  6. Click Save.

App Store Connect API 키를 사용하여 Codemagic을 관리할 수 있게되었습니다. 좋습니다!

2. 인증서 및 배포 프로파일을 생성하세요.

인증서

XCode를 열고 설정 > 계정 > Apple ID > 그룹을 선택하세요.

Code 인증서

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

애플 배포

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

그런 다음 인증서를 파일로 다운로드하기 위해 키 체인에 가야합니다. .p12 인증서를 파일로 다운로드하기 위해 키 체인에 가려면 로그인으로 전환해야합니다.

그런 다음 인증서를 파일로 다운로드하기 위해 키 체인에 가야합니다. 인증서를 파일로 다운로드하기 위해 키 체인에 가려면 로그인으로 전환해야합니다. __CAPGO_KEEP_0__ 내 인증서.

내 인증서

그런 다음 원하는 인증서를 다운로드할 수 있습니다. (인증서의 날짜를 기준으로 검색)

그런 다음 인증서 오른쪽 클릭하고 내보내기.

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

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

열기

keychain과 그 다음 탭 애플 개발자 그리고 올바른 팀을 선택하세요.

그런 다음 새로운 프로필을 만들기 위해 +

새로운 프로필 만들기

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

앱 스토어 연결 선택

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

올바른 앱 선택

앞서 만든 올바른 인증서를 선택하세요 (만료일을 확인하세요. 오늘 날짜와 월이 같아야 합니다) 그리고 계속.

올바른 인증서 선택

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

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

프로필 생성

프로필을 파일로 다운로드할 수 있습니다. .mobileprovision 다운로드 프로필

__CAPGO_KEEP_0__ 서명 인증서 추가

Codemagic은 PKCS#12 아카이브에 인증서와 개인 키가 포함된 인증서와 개인 키를 사용하기 위해 필요한 Code 서명 인증서를 업로드할 수 있습니다. 업로드 시, 인증서가 암호화된 경우 인증서 암호를 제공하고, 고유한 "참조 이름"을 입력해야 합니다. 이 참조 이름은 "구성"에서 특정 파일을 가져오기 위해 사용할 수 있습니다.

Codemagic lets you upload code signing certificates as PKCS#12 archives containing both the certificate and the private key which is needed to use it. When uploading, Codemagic will ask you to provide the certificate password (if the certificate is password-protected) along with a unique configurationcertificate password codemagic.yaml Reference name

  • __CAPGO_KEEP_0__ 인증서 업로드
  • 새 인증서 생성
  • 개발자 포털에서 가져오기
  1. Codemagic 팀 설정에서 codemagic.yaml 설정 > Code 서명 식별자.
  2. 열기 iOS 인증서 탭.
  3. 인증서 파일을 업로드하려면 .p12 또는 .pem 파일을 선택하십시오 또는 지정된 프레임으로 드래그하여 업로드하십시오.
  4. 인증 정보를 입력하세요. __CAPGO_KEEP_0__ 비밀번호 프로비저닝 프로파일을 선택하세요. 참조 이름.
  5. 추가 프로비저닝 프로파일 추가

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

추가된 __CAPGO_KEEP_0__ 서명 식별성에 있는 프로파일의 유형, 팀, 번들 ID, 만료일이 표시됩니다. 또한 Codemagic은 __CAPGO_KEEP_1__ 서명 인증서가 __CAPGO_KEEP_2__ 서명 식별성에 있는 경우 (인증서 필드에 녹색 체크 표시가 표시됨) 또는 그렇지 않은지 알려줍니다.

The profile’s type, team, bundle id, and expiration date are displayed for each profile added to Code signing identities. Furthermore, Codemagic will let you know whether a matching code signing certificate is available in Code signing identities (a green checkmark in the 3. Codemagic 설정 __CAPGO_KEEP_1__

__CAPGO_KEEP_2__

Codemagic 비밀을 설정하세요

값의 원천이 궁금하셨나요? 그 값은 프로젝트의 비밀에서 오는 것입니다. 🤦 ENV 4. Codemagic 워크플로우 파일을 설정하세요

프로젝트의 루트 디렉토리에 파일명을

을 만들고 다음을 추가하세요. 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

This workflow should be triggered manually or after each GitHub 에 따라 트리거되거나, 자동화하려면 자동 빌드 및 릴리즈와 Automatic build and release with GitHub actions 을 참조하세요.

먼저 이 워크플로우는 NodeJS 의존성을 가져와, 그들을 설치하고 JavaScript 앱을 빌드합니다.

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

Capacitor 베이스만 필수이므로, 앱은 이온IC을 사용하지 않아도 됩니다. 오래된 Cordova 모듈을 사용할 수 있지만 Capacitor JS 플러그인은 선호됩니다.

5. 워크플로우 트리거

워크플로우 트리거

브랜치에 새로운 커밋을 푸시하세요 main 또는 development 워크플로우를 트리거하려면.

커밋 시작

몇 분 후에 빌드는 앱 스토어 커넥트 대시보드에 표시됩니다.

테스트 플라이트 대시보드

수동 시작

워크플로우를 수동으로 시작할 수 있습니다.

먼저 빌드하고 싶은 앱을 선택하세요. 그 다음에 새로운 빌드 시작.

앱 선택

그 다음에 빌드하고 싶은 branch를 선택하세요.

branch 선택

그 다음에 새로운 빌드 시작.

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

빌드 목록

그 다음에 빌드 결과를 확인하고 싶은 빌드를 클릭하세요.

빌드 결과

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

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

Xcode를 사용하여 앱을 빌드하고 서명할 수 있습니다.

감사합니다

다음 기사에 기반한 블로그입니다.

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

Capgo를 사용하여 웹 레이어 버그가 활성화된 경우, 앱 스토어 승인까지 며칠 기다리지 않고修정을 배포할 수 있습니다. 사용자는 배경에서 업데이트를 받으면서 네이티브 변경 사항은 일반적인 검토 경로에 남아 있습니다.

시작하기

블로그에서 최신 뉴스

Capgo는 전문적인 모바일 앱을 만들기 위해 필요한 최고의洞察력을 제공합니다.