in app purchases for capacitor

Penggunaan plugin ini telah dipindahkan ke repository resmi RevenueCat. Silakan lihat di documentasi resmi untuk informasi lebih lanjut.

Jika Anda lebih suka menggunakan native API yang lebih sederhana tanpa RevenueCat, @capgo/native-purchases mengimplementasikan penggunaan dalam aplikasi dan langganan secara langsung dengan StoreKit dan Google Play Billing.

Capacitor Purchases is a plugin for the Capacitor framework that allows in-app purchases on iOS and Android. It provides a simple and consistent API across multiple platforms, making it easy for developers to implement in-app subscriptions and purchases in their mobile apps.

One of the key features of the Capacitor Purchases plugin is that it integrates with RevenueCat, a platform that provides tools for in-app subscriptions and in-app purchases. RevenueCat simplifies the process of implementing in-app subscriptions and purchases by providing a simple and consistent API across multiple platforms, and automating tasks such as receipt validation and user management.

Dengan menggunakan RevenueCat, pengembang dapat dengan mudah mengelola langganan, melacak pendapatan, dan melakukan tugas terkait lainnya. Beberapa fitur yang ditawarkan oleh RevenueCat antara lain:

• Pengotomatisan validasi bukti pembayaran
• Pengelolaan pengguna
• Bantuan untuk model harga kustom
• Analisis rinci -Skala

Dengan menggunakan plugin Pembelian Capacitor bersama RevenueCat, pengembang dapat menghemat waktu dan upaya ketika menerapkan langganan dan pembelian dalam aplikasi mobile mereka, serta menyediakan fitur tambahan yang dapat membantu meningkatkan pengalaman pengguna dan meningkatkan pendapatan.

Menggunakan plugin Pembelian Capacitor dan RevenueCat, pengembang dapat dengan mudah mengelola dan melacak langganan dan pembelian dalam aplikasi, memvalidasi bukti pembayaran, serta mengelola pengguna di berbagai platform. Ini juga memungkinkan membuat model harga kustom dan mendapatkan analisis rinci untuk meningkatkan kinerja dan pendapatan.

Pemasangan

Pastikan untuk menggunakan versi terbaru dari Capacitor dan plugin Pembelian Capacitor. Anda dapat memeriksa versi terbaru dari Capacitor dan plugin Pembelian Capacitor di situs web Capacitor.

Untuk menginstal plugin Pembelian Capacitor, jalankan perintah berikut: npm i @capgo/capacitor-purchases Tambahkan plugin ke native code Anda npx cap sync

Tambahkan kemampuan pembelian dalam aplikasi di Xcode:

lalu

1. Buatlah Akun RevenueCat

Petunjuk ini akan memandu Anda untuk mengaktifkan langganan dan RevenueCat’s SDK dengan hanya beberapa baris kode code.

Pendaftaran Akun Baru RevenueCat disini.

📘

💡 Tips!

RevenueCat merekomendasikan membuat akun RevenueCat terpisah untuk setiap aplikasi / proyek yang Anda miliki, terutama jika Anda pernah berencana untuk menjual aplikasi. Hal ini akan mempercepat proses transfer, karena Anda dapat mentransfer akun seluruhnya daripada menunggu dukungan RevenueCat untuk mentransfer proyek individu.

Organisasi / Bisnis

Kami merekomendasikan menggunakan akun perusahaan ketika mendaftar untuk RevenueCat dan mengatur aplikasi dalam proyek. Anda akan dapat mengundang tim Anda lainnya sebagai kolaborator ke proyek Anda, tetapi hanya pemilik proyek yang dapat mengelola tagihanKolaborator proyek tidak dapat mengelola detail tagihan.

2. Konfigurasi Proyek dan Aplikasi

▶️ Buat Proyek

Pergi ke dashboard RevenueCat dan tambahkan proyek baru dari dropdown di menu navigasi atas yang disebut Proyek.

Langkah RevenueCat 1

Modal popup untuk membuat proyek baru

▶️ Tambahkan Aplikasi / Platform Dari Proyek Pengaturan > Aplikasi di menu kiri dashboard proyek, pilih platform untuk aplikasi yang akan Anda tambahkan.

Dashboard proyek untuk memilih platform aplikasi

bidang ini Nama aplikasi diperlukan untuk menambahkan aplikasi ke RevenueCat. Bidang konfigurasi lainnya dapat ditambahkan kemudian. Untuk membuat pembelian uji coba dan produksi, ID Paket (iOS) / Nama Paket (Android) serta Kunci Akses Bersama (iOS) / Kredensial Layanan (Android) harus dikonfigurasi.

Halaman konfigurasi aplikasi untuk aplikasi App Store Apple

📘

💡 Tips!

Setelah mendaftar aplikasi, RevenueCat merekomendasikan mengatur Notifikasi Server Platform. Notifikasi ini tidak wajib, tetapi akan mempercepat webhooks dan pengiriman integrasi serta mengurangi waktu tunggu saat memperbarui pengikut Anda.

📘

Staging vs. Aplikasi dan Pengguna Produksi

RevenueCat sendiri tidak memiliki lingkungan terpisah untuk staging dan produksi. Sebaliknya, transaksi dasar untuk pengguna dipisahkan oleh sandbox dan produksi.

Applikasi apa pun RevenueCat dapat membuat pembelian sandbox dan produksi dari toko-toko. Jika Anda memiliki aplikasi terpisah untuk staging dan produksi, Anda dapat membuat proyek-proyek yang berbeda di RevenueCat untuk menggambarkan konfigurasi Anda.

Selain itu, pengguna tidak dipisahkan berdasarkan lingkungan. Pengguna yang sama dapat memiliki pembelian sandbox aktif dan pembelian produksi aktif pada saat yang sama.

▶️ Kredensial Layanan

Kredensial layanan harus disetel untuk memungkinkan RevenueCat berkomunikasi dengan toko aplikasi Anda. Lihat panduan RevenueCat Kunci Rahasia App Store Connect, Kredensial Layanan Play, dan Kunci Rahasia Amazon Appstore untuk informasi lebih lanjut.

Penting untuk diingat bahwa kredensial layanan main dapat membutuhkan waktu hingga 36 jam untuk menyebarluaskan ke server-server Google.

3. Konfigurasi Produk

▶️ Pengaturan Toko

Sebelum Anda dapat menggunakan RevenueCat untuk mengambil produk, Anda harus mengonfigurasi produk Anda di toko-toko yang relevan. Lihatlah panduan berikut untuk Tautan App Store Connect, Google Play Console, Toko Aplikasi Amazon, dan Stripe untuk bantuan untuk menavigasi melalui proses ini.

Jika Anda menjual produk iOS, pastikan Anda menandatangani 'Persetujuan Aplikasi Bayar' dan isi informasi bank dan pajak Anda di App Store Connect > Perjanjian, Pajak, dan Perbankan. Penting untuk diselesaikan sebelum Anda dapat menguji pembelian apa pun.

📘

Apakah Anda ingin melewatkan pengaturan toko saat menguji?

Pada iOS, Anda dapat menunda pengaturan produk di App Store Connect dengan menguji menggunakan file konfigurasi StoreKit. File konfigurasi ini memerlukan pengaturan minimal dan dapat diatur melalui Xcode secara langsung.

Baca lebih lanjut tentang pengaturan file konfigurasi StoreKit di RevenueCat Pengujian Sandbox Petunjuk.

▶️ Konfigurasi Produk dan Hak Akses di RevenueCat

Setelah produk in-app Anda telah dikonfigurasi di App Store Connect, Google Play Console, Amazon Appstoreatau Stripe, Anda perlu menyalin konfigurasi tersebut ke dashboard RevenueCat. RevenueCat menggunakan sistem Entitlements untuk mengontrol akses ke fitur premium dan Offerings untuk mengelola produk yang ditawarkan kepada pelanggan.

Entitlements adalah tingkat akses yang dimiliki oleh pelanggan setelah membeli produk tertentu. Offerings adalah cara sederhana untuk mengorganisir produk dalam-app yang ingin Anda tawarkan di paywall dan mengkonfigurasinya secara remote. RevenueCat utilizing these features to simplify your code and enable you to change products without releasing an app update.

menggunakan fitur ini untuk memudahkan proses __CAPGO_KEEP_0__ dan memungkinkan Anda untuk mengubah produk tanpa harus mengeluarkan update aplikasi. Lihat Mengatur Produk

4. Using RevenueCat’s Purchases SDK

4. Menggunakan Purchases SDK dari RevenueCat

Jika Anda mengalami masalah dengan SDK, lihat Troubleshooting SDKs untuk panduan.

📘

Gunakan hanya kunci publik SDK Anda untuk mengonfigurasi Pembelian

Anda dapat mendapatkan kunci publik SDK Anda dari tab API keys di bawah Pengaturan Projek di dashboard.

Hanya konfigurasi instance yang dibagikan dari Purchases sekali, biasanya pada saat aplikasi diluncurkan. Setelah itu, instance yang sama dibagikan di seluruh aplikasi dengan mengakses .shared instance di dalam SDK.

Lihat panduan RevenueCat tentang Mengatur SDK untuk informasi lebih lanjut dan praktik terbaik.

Pastikan Anda mengatur Purchases dengan kunci publik SDK Anda saja. Anda dapat membaca lebih lanjut tentang berbagai jenis kunci API yang tersedia di RevenueCat Panduan Autentikasi.

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_******'})
}

Ketika dalam pengembangan, RevenueCat merekomendasikan mengaktifkan log debug yang lebih rinci. Untuk informasi lebih lanjut tentang log-log ini, lihat panduan mereka tentang Pengembangan Panduan.

Jika Anda merencanakan untuk menggunakan RevenueCat bersama dengan pembelian code yang sudah ada, lihat panduan mereka tentang Mode Pengamat.

📘

Konfigurasi Pembelian dengan ID Pengguna

Jika Anda memiliki sistem autentikasi pengguna di aplikasi Anda, Anda dapat menyediakan identifier pengguna pada saat konfigurasi atau pada tanggal yang lebih lanjut dengan panggilan ke .logIn()To learn more, cek guide RevenueCat tentang Identifikasi Pengguna.

SDK akan secara otomatis mengambil dan mengambil informasi produk dari Apple, Google, atau Amazon. Jadi, produk yang tersedia sudah akan dimuat ketika pelanggan membuka layar pembelian Anda. Contoh di bawah ini adalah pengambilan . Anda dapat menggunakan untuk mengorganisir layar paywall Anda. Lihat guide RevenueCat tentang

Menampilkan Produk untuk informasi lebih lanjut dan praktik terbaik. ▶️ Ambil dan Tampilkan Produk yang Tersedia

▶️ Ambil dan Tampilkan Produk yang Tersedia

📘

Konfigurasi Pembelian dengan ID Pengguna

Jika Anda memiliki sistem autentikasi pengguna di aplikasi Anda, Anda dapat menyediakan identifier pengguna pada saat konfigurasi atau pada tanggal yang lebih lanjut dengan panggilan ke .logIn(). Untuk mempelajari lebih lanjut, cek guide RevenueCat pada Identifikasi Pengguna.

The SDK will automatically fetch the yang telah dikonfigurasi dan mengambil informasi produk dari Apple, Google, atau Amazon. Oleh karena itu, produk yang tersedia akan sudah dimuat ketika pelanggan membuka layar pembelian Anda.

Contoh di bawah ini adalah pengambilan Anda dapat menggunakan untuk mengatur layar paywall Anda. Lihat guide RevenueCat pada

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

Penggunaan Produk untuk informasi lebih lanjut dan praktik terbaik., produk, atau tersedia paket kosong, hal ini disebabkan oleh masalah konfigurasi pada toko yang bersangkutan.

Alasan paling umum untuk masalah ini di App Store Connect adalah perjanjian 'Paid Applications Agreement' yang tidak diperbarui atau produk tidak dalam keadaan 'Ready To Submit' setidaknya. Di Google Play, hal ini biasanya terjadi ketika aplikasi tidak dipublikasikan di jalur tertutup dan pengguna uji yang valid ditambahkan.

Anda dapat menemukan informasi lebih lanjut tentang troubleshooting masalah ini di RevenueCat Pusat Bantuan.

▶️ Lakukan Pembelian

Contoh SDK termasuk metode sederhana untuk memfasilitasi pembelian. Metode ini purchase:package mengambil paket dari Offering yang diambil dan memproses transaksi dengan toko aplikasi yang bersangkutan.

Contoh code di bawah ini menunjukkan proses pembelian paket dan mengkonfirmasi bahwa paket tersebut membuka konten 'your_entitlement_id'. Informasi lebih lanjut tentang metode ini dapat ditemukan di panduan RevenueCat tentang purchase:package metode Melakukan Pembelian.

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
}

▶️ Periksa Status Langganan

Metode ini dapat digunakan kapan saja Anda membutuhkannya untuk mendapatkan status terbaru, dan aman untuk memanggil metode ini secara berulang-ulang selama siklus hidup aplikasi Anda. Pembelian meng-cache status terbaru secara otomatis setiap kali update — sehingga dalam kebanyakan kasus, metode ini mengambil dari cache dan berjalan sangat cepat. CustomerInfo Metode ini biasanya dipanggil ketika Anda memutuskan untuk menampilkan UI mana yang harus ditampilkan kepada pengguna, dan ketika pengguna melakukan aksi yang memerlukan tingkat hak akses tertentu.

💡 Tips!

📘

Pengguna dapat mengakses informasi lebih lanjut tentang langganan selain hanya apakah aktif atau tidak. Lihat panduan RevenueCat tentang

Status Langganan untuk mengetahui apakah langganan akan diperbarui, apakah ada masalah dengan kartu kredit pengguna, dan lebih banyak lagi. RevenueCat memungkinkan pengguna untuk mengaktifkan kembali pembelian dalam aplikasi mereka, mengaktifkan kembali konten yang sebelumnya dibeli oleh pengguna dari

Capacitor akun toko yang sama (akun Apple, Google, atau Amazon). Kami merekomendasikan bahwa semua aplikasi memiliki cara untuk memicu metode restore. Perlu diingat bahwa Apple memerlukan mekanisme restore dalam event pengguna kehilangan akses ke pembelian mereka (misalnya: menghapus/reinstall aplikasi, kehilangan informasi akun mereka, dll).

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

Jika dua akun pengguna aplikasi yang berbeda ID Pengguna Aplikasi transaksi restore yang berbeda dari akun toko yang sama (akun Apple, Google, atau Amazon). RevenueCat mungkin mencoba membuat alias antara dua ID Pengguna Aplikasi dan menghitung mereka sebagai pengguna yang sama ke depannya. Lihat panduan RevenueCat tentang Pembelian yang Dikembalikan untuk informasi lebih lanjut tentang perilaku restore yang dapat disesuaikan.

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 Capacitor purchases:receivedUpdated:.

This method will fire whenever the SDK receives an updated CustomerInfo pembelian getCustomerInfo(), purchase(package:), purchase(product:)dengan menyesuaikan diri dengan metode delegasi yang opsional, restorePurchases().

Perbarui Informasi Pelanggan tidak dipush ke aplikasi Anda dari backend RevenueCat, perbarui hanya dapat terjadi dari permintaan jaringan keluar ke RevenueCat, seperti yang disebutkan di atas.

Tergantung pada aplikasi Anda, mungkin cukup untuk mengabaikan delegasi dan hanya menangani perubahan informasi pelanggan berikutnya ketika aplikasi Anda diluncurkan atau dalam blok penyelesaian metode SDK.

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

👍

Anda telah melakukannya!

Anda telah menyelesaikan implementasi sistem pembelian langganan yang lengkap tanpa menghabiskan sebulan menulis server code. Selamat!

Contoh Aplikasi

Untuk mengunduh contoh aplikasi yang lebih lengkap dari integrasi SDK, silakan ke sumber daya contoh aplikasi RevenueCat.

Lihat Contoh

Saya akan segera menerbitkan contoh aplikasi menggunakan Capacitor dan Vue.js.

Jika Anda perlu memindahkan penggunaan mendalam Capacitor SDK periksa dokumentasi di sini.

Langkah Selanjutnya

\

• Pastikan produk Anda sudah terkonfigurasi dengan benar dengan memeriksa panduan RevenueCat tentang hak akses Panduan RevenueCat tentang hak akses.
• Jika Anda ingin menggunakan ID pengguna sendiri, baca tentang Mengatur ID Pengguna Aplikasi .
• Jika Anda beralih dari sistem lain ke RevenueCat, lihat panduan RevenueCat tentang Migrasi Langganan yang Ada.
• Setelah Anda siap untuk menguji integrasi, Anda dapat mengikuti panduan RevenueCat tentang Tes dan Debug.
• Jika Anda memenuhi syarat untuk Program Bisnis Kecil App Store, lihat panduan RevenueCat tentang Cara Mengajukan dan Menginformasikan RevenueCat

Jika Anda membutuhkan Update Langsung di aplikasi Anda

Join kami di sini 👇

Pendaftaran di sini untuk mendapatkan akun Anda

Capgo

Teruskan dari pembelian dalam aplikasi untuk capacitor

Jika Anda menggunakan pembelian dalam aplikasi untuk capacitor untuk merencanakan pembayaran dan pembelian, hubungkannya dengan Capgo Pricing untuk alur kerja produk di Capgo Pricing Sistem Pembayaran untuk detail implementasi di Sistem Pembayaran @capgo/native-purchases untuk detail implementasi di @capgo/native-purchases, Mulai untuk detail implementasi di Mulai, dan Pedoman Pendapatan untuk detail implementasi di Pedoman Pendapatan.