Ricevi i pagamenti tramite Fatturazione Google Play con le API Digital Goods e Payment Request

André Cipriani Bandarra
André Cipriani Bandarra

Se la tua app viene distribuita tramite Google Play e vuoi vendere prodotti digitali o offrire abbonamenti, devi utilizzare Fatturazione Google Play. Il servizio Fatturazione Google Play offre strumenti per gestire il catalogo, i prezzi e gli abbonamenti, report utili e un flusso di pagamento basato sul Play Store che già conoscete ai vostri utenti.

Per le app create con Attività web attendibili e pubblicate tramite Google Play Store, ora puoi utilizzare l'API Payment Request e l'API Digital Goods per l'integrazione con Fatturazione Google Play. È disponibile su Chrome 101 e versioni successive per Android e ChromeOS.

In questa guida imparerai ad aggiungere l'assistenza per la fatturazione Google Play alla tua PWA e a pacchettizzarla per la distribuzione sul Google Play Store sia per ChromeOS che per il Play Store.

Utilizzerai due API della piattaforma web per aggiungere l'assistenza per la fatturazione di Play alla tua PWA. L'API Digital Goods viene utilizzata per raccogliere informazioni sugli SKU e verificare gli acquisti e i diritti dal Play Store. L'API Payment Request viene utilizzata per configurare Google Play Store come metodo di pagamento e per completare il flusso di acquisto.

Come monetizzare le applicazioni sul Play Store

La tua applicazione può monetizzare con Fatturazione Google Play sul Play Store in due modi:

  • Gli acquisti in-app consentono di vendere beni virtuali durevoli e di consumo, ad esempio funzionalità aggiuntive o rimuovere annunci.
  • Gli abbonamenti offrono agli utenti l'accesso continuo a contenuti o servizi a pagamento, ad esempio abbonamenti alle notizie o abbonamenti.

Requisiti

Per configurare il servizio Fatturazione Google Play, ti serviranno:

Aggiorna il progetto Bubble wrap

Se non hai installato Bubble wrap, devi installarlo. Consulta la guida rapida per i dettagli su come iniziare. Se hai già Bubblewrap, assicurati di eseguire l'aggiornamento alla versione 1.8.2 o successiva.

Inoltre, il rivestimento a bolla ha la funzione dietro una bandiera. Per abilitarlo, devi modificare la configurazione del progetto in twa-manifest.json, che si trova nella directory principale del progetto, e abilitare sia alphaDependencies sia la funzionalità playBilling:

  ...,
  "enableNotifications": true,
  "features": {
    "playBilling": {
      "enabled": true
    }
  },
  "alphaDependencies": {
    "enabled": true
  },
  ...

Una volta aggiornato il file di configurazione, esegui bubblewrap update per applicare la configurazione al progetto, seguito da bubblewrap build, per generare un nuovo pacchetto Android e caricare il pacchetto sul Play Store.

Funzionalità che rileva la disponibilità dell'API Digital Goods e di Fatturazione Google Play

L'API Digital Goods è attualmente supportata da Chrome solo quando la PWA viene eseguita all'interno di un'attività web attendibile, ed è possibile rilevare se è disponibile controllando la presenza di getDigitalGoodsService nell'oggetto window:

if ('getDigitalGoodsService' in window) {
 // Digital Goods API is supported!
}

L'API Digital Goods potrebbe essere disponibile in qualsiasi browser e supportare negozi diversi. Per verificare se il backend di un determinato negozio è supportato, devi richiamare getDigitalGoodsService() passando l'ID negozio come parametro. Il Google Play Store è identificato dalla stringa https://play.google.com/billing:

if ('getDigitalGoodsService' in window) {
  // Digital Goods API is supported!
  try {
    const service =
        await window.getDigitalGoodsService('https://play.google.com/billing');
    // Google Play Billing is supported!

  } catch (error) {
    // Google Play Billing is not available. Use another payment flow.
    return;
  }
}

Recuperare i dettagli per uno SKU

L'API Digital Goods fornisce getDetails(), che consente di recuperare informazioni come il titolo del prodotto, la descrizione e, soprattutto, il prezzo, dal backend dei pagamenti.

Puoi quindi utilizzare queste informazioni nell'interfaccia di utilizzo e fornire ulteriori dettagli all'utente:

const skuDetails = await service.getDetails(['shiny_sword', 'gem']);
for (item of skuDetails) {
  // Format the price according to the user locale.
  const localizedPrice = new Intl.NumberFormat(
      navigator.language,
      {style: 'currency', currency: item.price.currency}
    ).format(item.price.value);

  // Render the price to the UI.
  renderProductDetails(
        item.itemId, item.title, localizedPrice, item.description);
}

Creare il flusso di acquisto

La struttura di una richiesta di pagamento utilizza due parametri: un elenco di metodi di pagamento e un elenco di dettagli di pagamento.

All'interno dell'attività web attendibile, devi utilizzare il metodo di pagamento della fatturazione Google Play, impostando https://play.google.com/billing come identificatore e aggiungendo lo SKU prodotto come membro dei dati:

async function makePurchase(service, sku) {
   // Define the preferred payment method and item ID
   const paymentMethods = [{
       supportedMethods: "https://play.google.com/billing",
       data: {
           sku: sku,
       }
   }];

   ...
}

Anche se i dettagli di pagamento sono obbligatori, il servizio Fatturazione Play ignorerà questi valori e utilizzerà i valori impostati durante la creazione dello SKU in Play Console, in modo che possano essere inseriti con valori falsi:

const paymentDetails = {
    total: {
        label: `Total`,
        amount: {currency: `USD`, value: `0`}
    }
};

const request = new PaymentRequest(paymentMethods, paymentDetails);

Chiama il numero show() sull'oggetto della richiesta di pagamento per avviare il flusso di pagamento. Se la Promessa ha esito positivo, il pagamento potrebbe essere andato a buon fine. Se l'operazione non va a buon fine, è probabile che l'utente abbia interrotto il pagamento.

Se la promessa ha esito positivo, dovrai verificare e confermare l'acquisto. Per proteggerti dalle attività fraudolente, questo passaggio deve essere implementato utilizzando il tuo backend. Consulta la documentazione relativa alla fatturazione di Play per scoprire come implementare la verifica nel tuo backend. Se non confermi l'acquisto, dopo tre giorni, l'utente riceverà un rimborso e Google Play revocherà l'acquisto.

...
const request = new PaymentRequest(paymentMethods, paymentDetails);
try {
    const paymentResponse = await request.show();
    const {purchaseToken} = paymentResponse.details;

    // Call backend to validate and acknowledge the purchase.
    if (await acknowledgePurchaseOnBackend(purchaseToken, sku)) {
        // Optional: tell the PaymentRequest API the validation was
        // successful. The user-agent may show a "payment successful"
        // message to the user.
        const paymentComplete = await paymentResponse.complete('success');
    } else {
        // Optional: tell the PaymentRequest API the validation failed. The
        // user agent may show a message to the user.
        const paymentComplete = await paymentResponse.complete('fail');
    }
} catch(e) {
    // The purchase failed, and we can handle the failure here. AbortError
    // usually means a user cancellation
}
...

Facoltativamente, consume() può essere chiamato su purchaseToken per contrassegnare l'acquisto come utilizzato e consentirne di nuovo l'acquisto.

Per riassumere, un metodo di acquisto ha il seguente aspetto:

async function makePurchase(service, sku) {
    // Define the preferred payment method and item ID
    const paymentMethods = [{
        supportedMethods: "https://play.google.com/billing",
        data: {
            sku: sku,
        }
    }];

    // The "total" member of the paymentDetails is required by the Payment
    // Request API, but is not used when using Google Play Billing. We can
    // set it up with bogus details.
    const paymentDetails = {
        total: {
            label: `Total`,
            amount: {currency: `USD`, value: `0`}
        }
    };

    const request = new PaymentRequest(paymentMethods, paymentDetails);
    try {
        const paymentResponse = await request.show();
        const {purchaseToken} = paymentResponse.details;

        // Call backend to validate and acknowledge the purchase.
        if (await acknowledgePurchaseOnBackend(purchaseToken, sku)) {
            // Optional: consume the purchase, allowing the user to purchase
            // the same item again.
            service.consume(purchaseToken);

            // Optional: tell the PaymentRequest API the validation was
            // successful. The user-agent may show a "payment successful"
            // message to the user.
            const paymentComplete =
                    await paymentResponse.complete('success');
        } else {
            // Optional: tell the PaymentRequest API the validation failed.
            // The user agent may show a message to the user.
            const paymentComplete = await paymentResponse.complete('fail');
        }
    } catch(e) {
        // The purchase failed, and we can handle the failure here.
        // AbortError usually means a user cancellation
    }
}

Controllare lo stato degli acquisti esistenti

L'API Digital Goods ti consente di verificare se l'utente dispone di diritti esistenti (acquisti in-app che non sono ancora stati utilizzati o abbonamenti in corso) da acquisti precedenti già effettuati, su un altro dispositivo, da un'installazione precedente, riscattati da un codice promozionale o solo l'ultima volta che ha aperto l'app.


const service =
     await window.getDigitalGoodsService('https://play.google.com/billing');
...
const existingPurchases = await service.listPurchases();
for (const p of existingPurchases) {
    // Update the UI with items the user is already entitled to.
    console.log(`Users has entitlement for ${p.itemId}`);
}

Questo è anche un buon momento per verificare la presenza di acquisti effettuati in precedenza, ma non confermati. Ti consigliamo di confermare gli acquisti il prima possibile per assicurarti che i diritti degli utenti si riflettano correttamente nella tua app.

const service =
     await window.getDigitalGoodsService("https://play.google.com/billing");
...
const existingPurchases = await service.listPurchases();
for (const p of existingPurchases) {
    await verifyOrAcknowledgePurchaseOnBackend(p.purchaseToken, p.itemId);

    // Update the UI with items the user is already entitled to.
    console.log(`Users has entitlement for ${p.itemId}`);
}

Testare l'integrazione

Su un dispositivo Android di sviluppo

È possibile abilitare l'API Digital Goods su un dispositivo Android di sviluppo per i test:

  • Assicurati di utilizzare Android 9 o versioni successive con la modalità sviluppatore attivata.
  • Installa Chrome 101 o versioni successive.
  • Attiva i seguenti flag in Chrome andando su chrome://flags e cercando il flag per nome:
    • #enable-debug-for-store-billing
  • Assicurati che il sito sia ospitato utilizzando un protocollo https. Se utilizzi http, l'API sarà undefined

Su un dispositivo ChromeOS

L'API Digital Goods sarà disponibile nella versione stabile di ChromeOS a partire dalla versione 89. Nel frattempo, è possibile testare l'API Digital Goods:

  • Installa l'app dal Play Store sul dispositivo.
  • Assicurati che il sito sia ospitato utilizzando un protocollo https. Se utilizzi http, l'API sarà undefined

Con utenti di prova e team QA

Il Play Store offre delle opportunità per i test, inclusi account di prova per gli utenti e SKU di test. Per ulteriori informazioni, consulta la documentazione relativa al test relativo alla fatturazione Google Play.

Dove andare?

Come illustrato in questo documento, l'API Play Billing ha componenti lato client, che sono gestiti dall'API Digital Goods, e componenti lato server.