acquisti in-app per capacitor

Questo plugin è ora trasferito al repository ufficiale di RevenueCat. Per favore, guardate il documentazione ufficiale per ulteriori informazioni.

Se preferite un nativo API più semplice senza RevenueCat, @capgo/native-purchases implementa le compravendite in-app e le sottoscrizioni direttamente con StoreKit e Google Play Billing.

Capacitor Purchases è un plugin per il framework Capacitor che consente le compravendite in-app su iOS e Android. Fornisce una semplice e coerente API su più piattaforme, rendendo facile per gli sviluppatori implementare le sottoscrizioni in-app e le compravendite nei loro app mobili.

Uno dei principali vantaggi del plugin Capacitor Purchases è che integra con RevenueCat, una piattaforma che fornisce strumenti per le sottoscrizioni in-app e le compravendite in-app. RevenueCat semplifica il processo di implementazione delle sottoscrizioni in-app e delle compravendite fornendo una semplice e coerente API su più piattaforme, e automatizzando compiti come la validazione delle ricevute e la gestione degli utenti.

Con RevenueCat, gli sviluppatori possono gestire facilmente le sottoscrizioni, tracciare i ricavi e eseguire altri compiti correlati. Alcune delle funzionalità offerte da RevenueCat includono:

Validazione automatica delle ricevute
Gestione degli utenti
Supporto per modelli di prezzo personalizzati
Analytics dettagliate -Scalabilità

Utilizzando il plugin Capacitor Acquisti con RevenueCat, gli sviluppatori possono risparmiare tempo e sforzo quando implementano le sottoscrizioni e gli acquisti in-app nei loro app mobili, e fornire funzionalità aggiuntive che possono aiutare a migliorare l'esperienza utente e aumentare le entrate.

Utilizzando il plugin Capacitor Acquisti e RevenueCat, gli sviluppatori possono gestire e tracciare facilmente le sottoscrizioni e gli acquisti in-app, validare le ricevute e gestire gli utenti su più piattaforme. Inoltre, consente di creare modelli di prezzo personalizzati e di ottenere analisi dettagliate per migliorare le prestazioni e le entrate.

Installazione

Assicurarsi di utilizzare la versione più recente di Capacitor e del plugin Capacitor Acquisti. È possibile verificare la versione più recente di Capacitor e del plugin Capacitor Acquisti sul sito web di Capacitor.

Per installare il plugin Capacitor Acquisti, eseguire il seguente comando: npm i @capgo/capacitor-purchases Aggiungere il plugin nativo code all'app npx cap sync

Aggiungere la capacità di acquisti in-app in Xcode:

Passo 1 di Xcode poi Passo 2 di Xcode

1. Creare un account RevenueCat

Questa guida ti guiderà attraverso la procedura per avviare le sottoscrizioni e RevenueCat’s SDK con solo poche righe di code.

Iscriviti a un nuovo account RevenueCat qui.

📘

💡 Ecco un consiglio!

RevenueCat consiglia di creare un account RevenueCat separato per ogni app / progetto che hai, soprattutto se intendi vendere l'app in futuro. Ciò accelererà il processo di trasferimento, poiché potrai trasferire l'intero account al posto di attendere che il supporto di RevenueCat trasferisca i progetti individuali.

Organizzazioni / Enterprise

Consigliamo di utilizzare un account aziendale quando si registra per RevenueCat e si configura l'app all'interno di un progetto. Potrai invitare il resto del tuo team come collaboratori al tuo progetto, ma solo il proprietario del progetto può gestire la fatturazione.I collaboratori del progetto non possono gestire i dettagli della fatturazione.

2. Configurazione del progetto e dell'app

▶️ Crea un Progetto

Naviga al pannello di controllo di RevenueCat e aggiungi un nuovo progetto dal menu a discesa nella parte superiore del menu di navigazione chiamato Progetti.

RevenueCat passo 1

Il popup modale per la creazione di un nuovo Progetto

▶️ Aggiungi un'applicazione / piattaforma

Da Impostazioni del Progetto > Applicazioni nella parte sinistra del pannello di controllo del progetto, seleziona la piattaforma per l'applicazione che stai aggiungendo.

RevenueCat passo 2

Pannello del progetto per la selezione della piattaforma dell'app

Il campo Nome dell'app è richiesto per aggiungere l'app a RevenueCat. Il resto dei campi di configurazione può essere aggiunto in seguito. Per effettuare acquisti di test e produzione, è necessario configurare l'ID Bundle (iOS) / Nome del Pacchetto (Android) nonché il Segreto Condiviso (iOS) / Credenziali del Servizio (Android).

RevenueCat step 3

Pagina di configurazione dell'app per un'app di Apple App Store

📘

💡 Ecco un consiglio!

Dopo aver registrato l'app, RevenueCat raccomanda di configurare Notifiche del server della piattaforma. Queste notifiche non sono richieste, ma accelereranno webhooks e il tempo di consegna dell'integrazione e ridurranno il tempo di aggiornamento dei sottscriventi.

📘

Applicazioni di staging e produzione e utenti

RevenueCat non dispone di ambienti separati per la produzione e il staging. Invece, le transazioni sottostanti per gli utenti sono differenziate da sandbox e produzione.

Qualsiasi applicazione di RevenueCat può effettuare entrambe le transazioni di sandbox e produzione dai negozi. Se hai applicazioni separate per la produzione e il staging, puoi creare più progetti in RevenueCat per riflettere la tua configurazione.

Inoltre, gli utenti non sono separati per ambiente, neanche. Lo stesso utente può avere transazioni di sandbox attive e transazioni di produzione attive allo stesso tempo.

▶️ Credenziali del servizio

Sono necessarie credenziali del servizio per impostare RevenueCat per comunicare con i negozi per conto tuo. Vedi le guide di RevenueCat Segreto condiviso di App Store Connect, Credenziali del servizio di Playe Segreto condiviso di Amazon Appstore per ulteriori informazioni.

Nota che le credenziali del servizio di Play possono richiedere fino a 36 ore per propagarsi attraverso i server di Google.

3. Configurazione del prodotto

▶️ Configurazione dello Store

Prima di poter iniziare ad utilizzare RevenueCat per recuperare i prodotti, è necessario configurare i prodotti nei rispettivi negozi. Consultate i seguenti guide per App Store Connect, Google Play Console, Amazon Appstore, e Stripe per avere aiuto a navigare in questo processo.

Se si stanno vendendo prodotti iOS, assicurarsi di firmare il 'Paid Applications Agreement' e di compilare le informazioni bancarie e fiscali in App Store Connect > Accordi, Tasse e Bancario. Questo deve essere completato prima di poter testare qualsiasi acquisto.

📘

Vuoi saltare la configurazione del negozio durante le prove?

Sul iOS, puoi ritardare la configurazione dei prodotti in App Store Connect testando con file di configurazione di StoreKit al posto loro. Questi file di configurazione richiedono una configurazione minima e sono configurabili tramite Xcode direttamente.

Leggi di più sulla configurazione dei file di configurazione di StoreKit in RevenueCat Test di Sandbox guida.

▶️ Configura i prodotti e le autorizzazioni in RevenueCat

Una volta che i tuoi prodotti in-app sono stati configurati in App Store Connect, Google Play Console, Amazon Appstoreo StripePer configurare il prodotto, dovrai copiare quella configurazione nel dashboard di RevenueCat. RevenueCat utilizza un sistema di Entitlements per controllare l'accesso alle funzionalità premium e gli Offerings per gestire l'insieme dei prodotti che offri ai clienti.

Gli Entitlements sono il livello di accesso che un cliente è “autorizzato” a dopo aver acquistato un prodotto specifico. Gli Offerings sono una semplice modalità per organizzare i prodotti in-app che desideri “offrire” sul tuo paywall e configurarli a distanza. RevenueCat consiglia di utilizzare queste funzionalità per semplificare il tuo code e consentirti di modificare i prodotti senza rilasciare un aggiornamento dell'applicazione.

Vedi Configura i prodotti per impostare i tuoi prodotti e poi organizzarli in Offerings o Entitlements.

RevenueCat passo 4

4. Utilizzando le SDK di Purchases di RevenueCat

RevenueCat SDK implementa in modo trasparente le transazioni e le sottoscrizioni su più piattaforme, sincronizzando i token con il server di RevenueCat.

Se incontri problemi con lo SDK, vedi Risolvere i problemi dei SDKs per orientamento.

📘

Utilizza solo la tua chiave pubblica SDK per configurare le Acquisizioni

Puoi ottenere la tua chiave pubblica SDK dalla sezione Chiavi API sotto Impostazioni del progetto nella dashboard.

Devi configurare l'istanza condivisa di Acquisizioni solo una volta, di solito al lancio dell'app. Successivamente, la stessa istanza viene condivisa in tutta l'app accedendo all' .shared istanza nel SDK.

Vedi la guida di RevenueCat su Configurare SDK per ulteriori informazioni e migliori pratiche.

Assicurati di configurare Acquisti con la tua chiave pubblica SDK solo. Puoi leggere di più sulle diverse chiavi API disponibili in RevenueCat Guida all'autenticazione.

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

Quando in fase di sviluppo, RevenueCat raccomanda l'abilitazione di log di debug più verbosi. Per ulteriori informazioni su questi log, vedi il loro Guida al debug Se stai pianificando di utilizzare RevenueCat insieme ai tuoi acquisti esistenti __CAPGO_KEEP_0__, consulta la loro guida su

If you’re planning to use RevenueCat alongside your existing purchase code, refer to their guide on Configurare Acquisti con ID utente.

📘

Configurare __CAPGO_KEEP_0__

Se hai un sistema di autenticazione degli utenti nella tua app, puoi fornire un identificatore dell'utente al momento della configurazione o in un momento successivo con una chiamata a .logIn(). Per saperne di più, consulta la guida di RevenueCat su Identificare gli Utenti.

Il SDK recupererà automaticamente le Offerte configurate e recupererà le informazioni sui prodotti da Apple, Google o Amazon. Pertanto, i prodotti disponibili saranno già caricati quando i clienti avviano la schermata di acquisto della tua app.

Ecco un esempio di come recuperare le Offerte. Puoi utilizzare le Offerte per organizzare la schermata del paywall. Vedi la guida di RevenueCat su Visualizzare i Prodotti per ulteriori informazioni e migliori pratiche.

▶️ Esegui e visualizza i prodotti disponibili

📘

Configurare gli acquisti con gli ID degli utenti

Se hai un sistema di autenticazione degli utenti nella tua app, puoi fornire un identificatore dell'utente al momento della configurazione o in un momento successivo con una chiamata a .logIn(). Per ulteriori informazioni, consultate la guida di RevenueCat su Identificare gli Utenti.

Il SDK recupererà automaticamente le Offerte configurate e recupererà le informazioni sui prodotti da Apple, Google o Amazon. Di conseguenza, i prodotti disponibili saranno già caricati quando i clienti avvieranno la schermata di acquisto del vostro prodotto.

Ecco un esempio di come recuperare le Offerte. Potete utilizzare le Offerte per organizzare la vostra schermata di paywall. Consultate la guida di RevenueCat su Visualizzare i Prodotti per ulteriori informazioni e migliori pratiche.

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

Se il recupero dei vostri prodotti delle Offerte, , o disponibiliè problematico pacchetti sono vuoti, ciò è dovuto a un problema di configurazione nel rispettivo negozio.

I motivi più comuni per questo in App Store Connect sono un accordo di pagamento non aggiornato ‘Paid Applications Agreement’ o prodotti non almeno in stato ‘Ready To Submit’. In GooglePlay ciò si verifica generalmente quando l'app non è pubblicata su un percorso chiuso e un utente di test valido aggiunto.

Potete trovare ulteriori informazioni sul troubleshooting di questo problema in RevenueCat Centro Aiuto.

▶️ Effettua un acquisto

Il SDK include una semplice funzione per facilitare gli acquisti. Il purchase:package prende un pacchetto dallo Offering eletto e processa la transazione con il negozio di app rispettivo.

Il code di esempio sotto mostra il processo di acquisto di un pacchetto e la conferma che sblocca il contenuto ‘your_entitlement_id’. Ulteriori dettagli sulla purchase:package metodo possono essere trovati nella guida di RevenueCat su L'effettuazione degli Acquisti.

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
}

▶️ Verifica lo stato della sottoscrizione

Puoi utilizzare questo metodo ogni volta che hai bisogno di ottenere lo stato più aggiornato, e chiamarlo ripetutamente durante la vita ciclo del tuo app. Acquisti caching automaticamente l'ultimo CustomerInfo quando si aggiorna — quindi in molti casi, questo metodo recupera dalla cache e si esegue molto velocemente.

È tipico chiamare questo metodo quando si decide quale interfaccia da mostrare all'utente, e ogni volta che l'utente esegue un'azione che richiede un certo livello di abilitazione.

📘

💡 Ecco un consiglio!

Puoi accedere a molte informazioni aggiuntive su una sottoscrizione oltre a semplicemente sapere se è attiva o meno. Vedi la guida di RevenueCat su Stato della Sottoscrizione per imparare se la sottoscrizione è impostata per rinnovarsi, se ci sono problemi con la carta di credito dell'utente e altro ancora.

RevenueCat consente agli utenti di ripristinare le loro acquisizioni in-app, riattivando qualsiasi contenuto che hanno acquistato precedentemente dal stesso account del negozio (Apple, Google o Amazon account). Raccomandiamo che tutte le app abbiano un modo per gli utenti di attivare il metodo di ripristino. Nota che Apple richiede un meccanismo di ripristino nel caso in cui un utente perda l'accesso alle sue acquisizioni (ad esempio: disinstallando/rininstallando l'app, perdendo le informazioni dell'account, ecc.).

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

If due to different ID degli utenti dell'applicazione ripristina le transazioni dallo stesso account di archiviazione sottostante (account Apple, Google o Amazon). RevenueCat può tentare di creare un alias tra gli ID degli utenti dell'applicazione diversi e conteggiarli come lo stesso utente per le future operazioni. Vedi la guida di RevenueCat su Ripristino delle acquisti per ulteriori informazioni sulle diverse configurazioni di comportamento di ripristino.

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

This method will fire whenever the SDK receives an updated CustomerInfo Questo metodo si attiverà ogni volta che il getCustomerInfo(), purchase(package:), purchase(product:)Capgo restorePurchases().

riceve un oggetto aggiornato da chiamate a pushed to il tuo app dal backend di RevenueCat, le aggiornamenti possono avvenire solo da una richiesta di rete in uscita verso RevenueCat, come menzionato sopra.

A seconda del tuo app, potrebbe essere sufficiente ignorare il delegato e gestire semplicemente le modifiche alle informazioni del cliente la prossima volta che il tuo app viene lanciato o nei blocchi di completamento dei metodi SDK.

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

👍

Hai fatto!

Hai ora implementato un sistema di acquisto di abbonamenti completo senza spendere un mese a scrivere server code. Congratulazioni!

Esempi di App

Per scaricare esempi più completi di integrazione del SDK, visita le risorse di esempio di app di RevenueCat.

Vedi Esempi

Pubblicherò presto un'app di esempio che utilizza Capacitor e Vue.js.

Se hai bisogno di spostare l'utilizzo profondo del Capacitor SDK controlla la documentazione qui.

Passaggi Successivi

Se non l'hai già fatto, assicurati che i tuoi prodotti siano configurati correttamente controllando RevenueCat guida sulle autorizzazioni.
Se desideri utilizzare i tuoi identificatori utente personalizzati, leggi impostazione degli ID degli utenti dell'app .
Se stai passando a RevenueCat da un altro sistema, consulta la guida di RevenueCat su migrazione delle tue sottoscrizioni esistenti.
Una volta pronto per testare la tua integrazione, puoi seguire le guide di RevenueCat su test e debug.
Se qualifichi per il Programma di piccole imprese per l'App Store, consulta la guida di RevenueCat su come applicare e informare RevenueCat

Se hai bisogno di aggiornamenti in tempo reale nel tuo app

Unisciti qui 👇

Iscriviti qui per ottenere il tuo account

Capgo

Continua con le acquisti in-app per capacitor

Se stai utilizzando acquisti in-app per capacitor per pianificare pagamenti e acquisti, connettilo con Capgo Pricing per il flusso di lavoro del prodotto in Capgo Pricing, Sistema di pagamento per i dettagli di implementazione in Sistema di pagamento, @capgo/native-purchases per i dettagli di implementazione in @capgo/native-purchases, Iniziare per i dettagli di implementazione in Getting Started, e Revenue Playbook per i dettagli di implementazione in Revenue Playbook.