capacitor 앱 내 구매

이 플러그인은 RevenueCat 공식 저장소로 이전되었습니다. 더 많은 정보를 얻으려면 공식 문서 를 참조하세요.

If you prefer a simpler native API without RevenueCat, @capgo/native-purchases StoreKit과 Google Play Billing을 사용하여 인앱 구매 및 구독을 직접 implement합니다.

Capacitor Purchases는 Capacitor 프레임워크의 플러그인으로 iOS 및 Android에서 인앱 구매를 지원합니다. iOS 및 Android에서 일관된 API를 제공하여 개발자들이 모바일 앱에 인앱 구독 및 구매를 implement하는 것을 쉽게 만듭니다.

Capacitor Purchases 플러그인의 주요 기능 중 하나는 RevenueCat과 통합되는 것입니다. RevenueCat은 인앱 구독 및 인앱 구매를 제공하는 플랫폼으로, 인앱 구독 및 구매를 implement하는 과정을 단순화하고 일관된 API를 제공하며, 수신증명 확인 및 사용자 관리와 같은 작업을 자동화합니다.

RevenueCat을 사용하면 개발자가 구독 관리, 수익 추적 및 관련 작업을 수행할 수 있습니다. RevenueCat이 제공하는 일부 기능은 다음과 같습니다:

자동 수신증명 확인
사용자 관리
사용자 지정 가격 모델 지원
상세 분석 - 확장성

RevenueCat와 함께 Capacitor Purchases 플러그인을 사용하면 개발자는 모바일 앱에 구독 및 구매 기능을 구현하는 데 필요한 시간과 노력을 절약할 수 있으며 사용자 경험을 개선하고 수익을 증가시키기 위한 추가 기능을 제공할 수 있습니다.

Capacitor Purchases 플러그인과 RevenueCat를 사용하면 개발자는 구독 및 구매 기능을 관리하고 추적할 수 있으며 수표를 확인하고 여러 플랫폼에서 사용자를 관리할 수 있습니다. 또한 사용자 지정 가격 모델을 만들고 성능과 수익을 개선하기 위한 세부 분석을 얻을 수 있습니다.

설치

Capacitor의 최신 버전과 Capacitor Purchases 플러그인을 사용하십시오. Capacitor의 최신 버전과 Capacitor Purchases 플러그인의 최신 버전은 Capacitor 웹사이트에서 확인하실 수 있습니다.

Capacitor Purchases 플러그인을 설치하려면 다음 명령어를 실행하십시오: npm i @capgo/capacitor-purchases code 앱의 원시 code에 플러그인을 추가하십시오. npx cap sync

Xcode에서 구독 및 구매 기능을 추가하십시오:

Xcode 단계 1 그런 다음 Xcode 단계 2

1. RevenueCat 계정 만들기

이 안내서에서는 구독과 RevenueCat의 SDK를 사용하여 몇 줄의 code만으로 구동할 수 있도록 안내합니다.

새로운 RevenueCat 계정으로 가입하세요 여기.

📘

💡 여기 팁!

RevenueCat은 각 앱/프로젝트당 별도의 RevenueCat 계정을 생성하는 것을 추천합니다. 특히 앱을 판매할 계획이라면, 계정 전달이 더 빠르게 진행될 것입니다. RevenueCat Support이 개별 프로젝트를 전달해야 하는 대신, 전체 계정을 전달할 수 있기 때문입니다.

기업/기업계정

회사 계정을 등록하고 앱을 프로젝트 내에 설정할 때 RevenueCat을 사용하는 것을 추천합니다. 팀원들을 프로젝트에 초대할 수 있지만, 프로젝트 소유자는만 계정 관리가 가능합니다. 프로젝트 협력자는 계정 관리가 불가능합니다. 2. 프로젝트 및 앱 설정 __CAPGO_KEEP_0__ __CAPGO_KEEP_1____CAPGO_KEEP_0__

__CAPGO_KEEP_1__

▶️ 프로젝트 만들기

RevenueCat 대시보드에 가서 새로운 프로젝트 추가 상단 네비게이션 메뉴의 드롭다운 메뉴에서 프로젝트.

역세권

새로운 프로젝트 만들기 팝업 모달

▶️ 앱/플랫폼 추가

프로젝트 설정 > 앱 프로젝트 대시보드의 왼쪽 메뉴에서 앱을 추가할 플랫폼을 선택하세요. RevenueCat 2단계

RevenueCat 1단계

애플리케이션 플랫폼을 선택하는 프로젝트 대시보드

필드 애플리케이션 이름 RevenueCat에 애플리케이션을 추가하려면 애플리케이션 이름이 필요합니다. 나머지 구성 필드는 나중에 추가할 수 있습니다. 테스트 및 생산 구매를 위해 Bundle ID (iOS) / Package Name (Android) 및 Shared Secret (iOS) / Service Credentials (Android)가 구성되어야 합니다.

RevenueCat 3단계

Apple App Store 애플리케이션을 위한 애플리케이션 구성 페이지

📘

💡 여기 팁!

애플리케이션을 등록한 후 RevenueCat은 플랫폼 서버 알림을 설정하는 것을 추천합니다. 이러한 알림은 필수는 아니지만 웹후크 와 통합 시간을 단축하고 구독자 업데이트를 위한 지연 시간을 줄여줍니다.

📘

스테이징 vs. 프로덕션 앱 및 사용자

RevenueCat은 스테이징과 프로덕션에 대한 별도의 환경을 가지고 있지 않습니다. 대신 사용자의 underlying 거래는 샌드박스와 프로덕션으로 구분됩니다.

RevenueCat 앱은 모두 샌드박스와 프로덕션 구매를 스토어에서 할 수 있습니다. 스테이징과 프로덕션에 대한 별도의 앱이 있으시면 RevenueCat에서 프로젝트를 여러 개 만들어서 설정을 반영할 수 있습니다.

또한 사용자는 환경에 따라 구분되지 않습니다. 동일한 사용자는 동시에 샌드박스 구매와 프로덕션 구매를 활성화할 수 있습니다.

▶️ 서비스 자격증명

RevenueCat은 앱 스토어와 통신하기 위해 서비스 자격증명을 설정해야 합니다. RevenueCat 가이드를 참조하세요. 애플 스토어 커넥트 공유 비밀, 플레이 서비스 자격증명, 아마존 앱 스토어 공유 비밀 ,

플레이 서비스 자격증명은 Google 서버에서 전파되는데 최대 36시간이 걸릴 수 있습니다.

3. 제품 설정

▶️ 매장 설정

구매를 위해 RevenueCat을 사용하기 전에, 각 매장에서 제품을 설정해야 합니다. 다음 안내서를 참조하세요. 애플 스토어 연결, 구글 플레이 콘솔, 아마존 앱 스토어, 그리고 스 트립 이 과정을 이해하는 데 도움이 필요합니다.

iOS 제품을 판매하고 있다면, '무료 앱 사용 허가서'를 서명하고 App Store Connect > 계약, 세금 및 은행에서 은행 및 세금 정보를 입력해야 합니다. 구매 테스트를 시작하기 전에 이 과정을 완료해야 합니다.. 이전.

📘

스토어 설정을 테스트하는 동안 건너 뛰고 싶으신가요?

iOS에서 App Store Connect에서 제품을 구성하는 것을 미루고 StoreKit Configuration 파일로 테스트할 수 있습니다. 이 config 파일은 최소한의 설정만 필요하고 Xcode를 통해 직접 조정할 수 있습니다.

RevenueCat에서 StoreKit Configuration 파일을 설정하는 방법에 대해 더 읽어보세요 사andbox 테스트 안내서.

▶️ RevenueCat에서 제품과 권한을 구성하세요

App Store Connect Google Play Console, Amazon Appstore, , 또는Stripe Stripe, 구매 설정을 RevenueCat 대시보드에 복사해야 합니다. RevenueCat은 프리미엄 기능에 대한 접근을 제어하는 Entitlements 시스템과 고객에게 제공하는 제품의 세트를 관리하는 Offerings를 사용합니다.

Entitlements는 고객이 특정 제품을 구매한 후 RevenueCat은 Offerings를 사용하여 utilizing these features to simplify your code and enable you to change products without releasing an app update.

See Configuring Products RevenueCat 4단계

4. RevenueCat의 Purchases

4. Using RevenueCat’s Purchases SDK

RevenueCat SDK seamlessly implements purchases and subscriptions across platforms while syncing tokens with the RevenueCat server.

If you run into issues with the SDK, see RevenueCat은 안내를 위해.

📘

공개 SDK 키만 사용하여 구매를 구성하십시오.

공개 SDK 키는 SDK 키에서 가져올 수 있습니다. API 키 __CAPGO_KEEP_0__ 탭 프로젝트 설정 대시보드에서.

구매를 구성할 때는 Purchases의 공유 인스턴스를 한 번만 설정하십시오. 앱이 시작될 때 일반적으로. 이후에 앱 내에서 Purchases의 인스턴스를 공유하기 위해 __CAPGO_KEEP_0__에서 인스턴스를 접근하십시오. RevenueCat의 안내서를 참조하십시오. __CAPGO_KEEP_0__ .shared SDK

__CAPGO_KEEP_0__ 구성 SDK 더 많은 정보와 최적의 관행을 위해

개발 중인 경우 __CAPGO_KEEP_0__ 구매 with your public SDK key only. You can read more about the different API keys available in RevenueCat RevenueCat의 __CAPGO_KEEP_1__.

import { CapacitorPurchases } from '@capgo/capacitor-purchases'
import { isPlatform } from '@ionic/vue' // use the right one for your framework

CapacitorPurchases.setDebugLogsEnabled({ enabled: import.meta.env.DEV }) // Enable to get debug logs in dev mode
if (isPlatform('ios')) {
    CapacitorPurchases.setup({ apiKey:'appl_******'})
} else if (isPlatform('android')) {
    CapacitorPurchases.setup({ apiKey:'goog_******'})
}

인증 안내서 개발 중인 경우 RevenueCat은 더 자세한 디버그 로그를 활성화하는 것을 추천합니다. 더 자세한 정보는 RevenueCat의 디버깅

If you’re planning to use RevenueCat alongside your existing purchase code, refer to their guide on RevenueCat과 함께 기존 구매 __CAPGO_KEEP_0__를 사용하려는 경우, RevenueCat의 .

📘

Observer 모드

앱에 사용자 인증 시스템이 있다면, 구성 시 또는 나중에 호출하여 사용자 식별자를 제공할 수 있습니다. .logIn(). 사용자 식별하기.

Capgo는 SDK를 자동으로 가져와 구성된 Offerings 에서 Apple, Google, 또는 Amazon에서 제품 정보를 가져옵니다. 따라서 고객이 구매 화면을 열 때 이미 사용 가능한 제품이 로드되어 있습니다.

아래는 Offerings를 가져오는 예입니다. Offerings를 사용하여 결제 벽을 조직할 수 있습니다. RevenueCat의 Displaying Products 를 참조하십시오.

▶️ 사용 가능한 제품을 가져와 표시하기

📘

사용자 ID를 사용하여 구매 구성하기

앱에 사용자 인증 시스템이 있다면, 구성 시 또는 나중에 호출하여 사용자 식별자를 제공할 수 있습니다. .logIn(). To learn more, check out RevenueCat guide on 사용자 식별.

The SDK will automatically fetch the 구성된 제품 and retrieve the product information from Apple, Google, or Amazon. Thus, available products will already be loaded when customers launch your purchase screen.

아래는 Offerings를 가져오는 예입니다. Offerings를 사용하여 결제 화면을 구성할 수 있습니다. RevenueCat guide on Displaying Products 를 참조하십시오. 더 많은 정보와最佳 관행을위한

const { offerings } = await CapacitorPurchases.getOfferings()
if (offerings.current !== null) {  
    // Display current offering with offerings.current
}

If fetching your Offerings, 제품, or available 패키지 은 비어있는데, 이는 각 스토어에서 구성 문제로 인해 발생합니다.

App Store Connect에서 가장 일반적인 이유는 '결제 애플리케이션 계약'이 최신 상태가 아니거나 제품이 '제출 준비' 상태 이상이 아닐 때입니다. Google Play에서는 일반적으로 앱이 폐쇄된 트랙에 게시되지 않았거나 유효한 테스트 사용자가 추가되지 않았을 때 발생합니다.

RevenueCat의 도움말 센터.

▶️ 구매하기

The SDK includes a simple method for facilitating purchases. The purchase:package 는 Offering에서 패키지를 가져와 각각의 앱 스토어에서 거래를 처리합니다.

The code sample below shows the process of purchasing a package and confirming it unlocks the “your_entitlement_id” content. More details about the purchase:package 샘플은 패키지를 구매하고 your_entitlement_id.

const purchase = async (p: Package): Promise<PurchaserInfo | null> => {
  try {
    // console.log('purchase', p)
    const data = await CapacitorPurchases.purchasePackage({
      identifier: p.identifier,
      offeringIdentifier: p.offeringIdentifier,
    })
    const purchaserInfo = data.purchaserInfo
    // console.log('listenBuy', purchaserInfo)
    if (purchaserInfo.activeSubscriptions.includes(p.identifier)) {
      // set the user as paid
    }
    return purchaserInfo
  }
  catch (e) {
    console.error('listenBuy error', e)
  }
  return null
}

내용이 해제되었는지 확인하는 과정을 보여줍니다. 더 자세한 정보는 RevenueCat의

이 메소드를 호출할 때마다 최신 상태를 가져올 수 있으며 앱의 라이프 사이클 동안 반복적으로 호출하는 것이 안전합니다. 구매 자동으로 최신 데이터를 캐싱합니다. CustomerInfo 업데이트가 발생할 때마다 캐시에서 데이터를 가져와서 매우 빠르게 실행됩니다.

일반적으로 UI를 표시할 때 또는 사용자가 특정 권한 수준이 필요한 액션을 수행할 때 이 메소드를 호출합니다.

📘

💡 팁!

구독의 상태를 단순히 활성화 여부만 확인하는 것 이상의 정보에 접근할 수 있습니다. 구독 상태에 대한 자세한 내용은 구독 상태

을 참조하세요. 구독이 갱신될지, 사용자의 신용카드에 문제가 있는지 등 더 많은 정보를 확인할 수 있습니다. RevenueCat은 사용자가 이전에 구매한 콘텐츠를 다시 활성화할 수 있도록 사용자의 스토어 계정 (Apple, Google, 또는 Amazon 계정)에서 구입한 콘텐츠를 복원할 수 있도록 합니다. 앱은 사용자가 복원 메소드를 트리거할 수 있는 방법을 제공하는 것이 좋습니다. Apple은 사용자가 구매를 복원할 수 있도록 하는 메커니즘을 제공해야 하며, 예를 들어 앱을 삭제/설치하거나 계정 정보를 잃었을 때 구매를 복원할 수 있도록 해야 합니다.

  const res = await CapacitorPurchases.restoreTransactions()
  const purchaserInfo = res.purchaserInfo
  const ids: string[] = [] // extract active subscriptions ids
  purchaserInfo.activeSubscriptions.forEach((id) => {
    ids.push(id)
  })

두 가지 다른 앱 사용자 ID 같은 underlying store 계정 (Apple, Google, 또는 Amazon 계정)에서 두 개의 다른 RevenueCat는 두 개의 앱 사용자 ID 사이에 alias를 생성하고 앞으로는 그들을 동일한 사용자로 간주할 수 있습니다. RevenueCat의 구매를 복원하는

Since the SDK works seamlessly on any platform, changes to a user’s purchase info may come from a variety of sources. You can respond to any changes in a customer’s CustomerInfo 이 __CAPGO_KEEP_0__는 모든 플랫폼에서 작동하므로 사용자의 구매 정보가 변경될 수 있는 다양한 원천에서 변경될 수 있습니다. 고객의 구매 정보가 변경된 경우에 응답하려면 purchases:receivedUpdated:.

This method will fire whenever the SDK receives an updated CustomerInfo 이 메서드는 __CAPGO_KEEP_0__가 getCustomerInfo(), purchase(package:), purchase(product:)에서 호출된 restorePurchases().

CustomerInfo 업데이트 아니 __CAPGO_KEEP_0__

SDK

CapacitorPurchases.addListener('purchasesUpdate', (data) => {
  console.log('purchasesUpdate', data)
})

👍

축하합니다!

You have now implemented a fully-featured subscription purchasing system without spending a month writing server code. Congrats!

샘플 앱

더 많은 SDK 통합 샘플을 다운로드하려면 RevenueCat 샘플 앱 리소스 페이지로 이동하세요.

샘플 보기

Capacitor와 Vue.js를 사용하는 샘플 앱을 곧 공개할 예정입니다.

Capacitor의 깊은 사용을 위해 SDK을 확인하세요. 여기.

다음 단계

RevenueCat에서 제품을 올바르게 구성했는지 확인하세요. 권한 지정을 위한 가이드.
자신의 사용자 식별자를 사용하려면 다음을 읽으십시오 앱 사용자 ID를 설정하는 방법 .
RevenueCat으로 이전하는 경우 기존 구독을 마이그레이션하는 방법에 대한 RevenueCat 가이드를 참조하십시오 통합을 테스트하고 디버그하기 위한 RevenueCat 가이드를 따라하십시오.
App Store Small Business Program에 자격이 있다면 RevenueCat 가이드의 앱 스토어 소규모 사업자 프로그램에 대한 정보를 참조하십시오 RevenueCat에 알리고 앱 스토어 소규모 사업자 프로그램에 신청하는 방법에 대한 RevenueCat 가이드를 참조하십시오.
앱에 실시간 업데이트 기능이 필요하다면 여기 👇에서 가입하세요

계정을 등록하여 계정 정보를 받으십시오

__CAPGO_KEEP_0__

__CAPGO_KEEP_1__

Capgo

capacitor

__CAPGO_KEEP_0__ capacitor __CAPGO_KEEP_0__ Capgo Capgo __CAPGO_KEEP_0__ __CAPGO_KEEP_0__ capgo capgo Getting Started Capgo의 구현 세부 사항에 대한 정보는 Getting Started에서 찾을 수 있습니다, 그리고 Revenue Playbook Article credits