Recibe pagos a través de la Facturación Google Play con la API de Digital Goods y la API de Payment Request

André Cipriani Bandarra

Si tu app se distribuye a través de Google Play y quieres ofrecer o vender artículos digitales, haz lo siguiente: debes usar la Facturación Google Play. La Facturación Google Play ofrece herramientas para administrar tu catálogo, precios y suscripciones, informes útiles y un proceso de confirmación de la compra con la tecnología de Play Tienda que ya conocen tus usuarios.

En el caso de las apps creadas con Trusted Web Activities y publicadas a través de Google Play Store, puedes ahora puedes usar la API de Payment Request y la API de Digital Goods para integrarse con Facturación Google Play. Está disponible en Chrome 101 y versiones posteriores para Android y ChromeOS.

En esta guía, aprenderás a agregar asistencia para la Facturación Google Play a tu AWP y empaquetarla para distribución en Google Play Store para ChromeOS y Play Store.

Usarás dos APIs de plataforma web para agregar compatibilidad con la Facturación Play a tu AWP. El La API de Digital Goods se usa para recopilar información de SKU y verificar compras y derechos. en Play Store. La Payment Request API se usa para configurar Google Play Store como el la forma de pago y completar el flujo de compra.

Cómo monetizar aplicaciones en Play Store

Hay dos formas de monetizar tu aplicación con la Facturación Google Play en Play Store:

  • Las compras directas desde la aplicación permiten vender bienes virtuales duraderos y consumibles, como funciones o quitar anuncios.
  • Las suscripciones ofrecen a los usuarios acceso continuo a contenido o servicios por una tarifa recurrente. como suscripciones de noticias o membresías.

Requisitos

Para configurar la Facturación Google Play, necesitarás lo siguiente:

Cómo actualizar el proyecto de Bubblewrap

Si no tienes instalado Bubblewrap, deberás instalarlo. Consulta la Guía de inicio rápido para obtener detalles sobre cómo comenzar. Si ya tienes Bubblewrap, asegúrate de actualizar a la versión 1.8.2 o posterior.

La función Bubblewrap también tiene la función detrás de una bandera. En para habilitarlo, deberás modificar la configuración del proyecto en twa-manifest.json ubicado en la raíz del proyecto y habilitar tanto alphaDependencies como playBilling atributo:

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

Con el archivo de configuración actualizado, ejecuta bubblewrap update para aplicar la configuración al seguido de bubblewrap build, para generar un nuevo paquete de Android y subir este paquete a Play Store.

Función de detección de la disponibilidad de la API de Digital Goods y de Facturación Google Play

Actualmente, Chrome solo admite la API de Digital Goods cuando la AWP se ejecuta en un Trusted Web Activity, y es posible detectar si está disponible comprobando getDigitalGoodsService en el objeto window:

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

Es posible que la API de Digital Goods esté disponible en cualquier navegador y sea compatible con diferentes tiendas. Para para verificar si un backend de tienda en particular es compatible, deberás invocar getDigitalGoodsService(): Pasa el ID de tienda como parámetro. Se identifica Google Play Store por la cadena 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;
  }
}

Recupera detalles de un SKU

La API de Digital Goods proporciona getDetails(), que permite recuperar información como el el título del producto, la descripción y, lo más importante, el precio, desde el backend de pagos.

Luego, puedes usar esta información en tu interfaz de uso y proporcionarle más detalles al usuario:

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);
}

Crea el flujo de compra

El constructor de una PaymentRequest toma dos parámetros: una lista de métodos de pago y una lista de los detalles del pago.

Cuando ingresas a Actividad web de confianza, debes usar la forma de pago de Facturación Google Play, antes del configurando https://play.google.com/billing como el identificador y agregando el SKU del producto como un miembro de datos:

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

   ...
}

Si bien los detalles del pago son obligatorios, la Facturación Play ignorará esos valores y usará la valores establecidos cuando se crea el SKU en Play Console, de modo que se puedan completar con valores erróneos:

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

const request = new PaymentRequest(paymentMethods, paymentDetails);

Llama a show() en el objeto de solicitud de pago para iniciar el flujo de pago. Si la promesa tiene éxito que puede que el pago se haya realizado correctamente. Si falla, es probable que el usuario haya anulado el pago.

Si la promesa se realiza correctamente, deberás verificar y confirmar la compra. Para brindar protección contra fraudes, este paso debe implementarse usando tu backend. Consulta la Consulta la documentación de Facturación Play para obtener información sobre cómo implementar la verificación en tu backend. Si no confirmas la compra, después de tres días, el usuario recibirá un reembolso y Google Play revocará la compra.

...
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
}
...

De manera opcional, se puede llamar a consume() en un purchaseToken para marcar la compra como usada y permitir que se vuelva a comprar.

Cuando se junta todo, un método de compra se ve de la siguiente manera:

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
    }
}

Cómo verificar el estado de las compras existentes

La API de Digital Goods te permite verificar si el usuario tiene derechos existentes (en la app compras que aún no se consumieron o suscripciones en curso) de las compras anteriores que ya sea en otro dispositivo, de una instalación anterior, canjeados de un código promocional solo la última vez que abrieron la 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}`);
}

Este también es un buen momento para revisar las compras que se realizaron con anterioridad, pero que no se reconocieron. Te recomendamos que confirmes las compras lo antes posible para garantizar que la seguridad de los usuarios derechos se reflejen correctamente en tu 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}`);
}

Cómo probar tu integración

En un dispositivo Android de desarrollo

Es posible habilitar la API de Digital Goods en un dispositivo Android de desarrollo para probar lo siguiente:

  • Asegúrate de tener Android 9 o una versión posterior con el modo de desarrollador habilitado.
  • Instala Chrome 101 o una versión más reciente.
  • Para habilitar las siguientes funciones experimentales en Chrome, ve a chrome://flags y busca marcar por nombre:
    • #enable-debug-for-store-billing
  • Asegúrese de que el sitio esté alojado con un protocolo HTTPS. Si usas HTTP, la API será undefined

En un dispositivo ChromeOS

La API de Digital Goods estará disponible en la versión estable de ChromeOS a partir de la versión 89. En la mientras tanto, puede probar la API de Digital Goods:

  • Instala la app desde Play Store en el dispositivo.
  • Asegúrese de que el sitio esté alojado con un protocolo HTTPS. Si usas HTTP, la API será undefined

Con usuarios de prueba y equipos de QA

Play Store ofrece posibilidades de realizar pruebas, como cuentas de prueba de usuarios y SKU de prueba. Para obtener más información, consulta la documentación de prueba de la Facturación Google Play.

¿Qué debo hacer a continuación?

Como se explica en este documento, la API de Play Billing tiene componentes del cliente, que se administran mediante la API de Artículos Digitales y los componentes del servidor.