Cómo: Configurar tu sitio web para utilizar las compras en la aplicación

Crear productos para compras en la aplicación

Puedes seguir estas guías para crear productos de compra en la aplicación y suscripciones:

• Crear una compra dentro de la aplicación en App Store Connect
  Asegúrate también de aceptar los acuerdos para las aplicaciones de pago, rellenar la información fiscal y añadir una cuenta bancaria en el panel de acuerdos de App Store Connect.
• Crear un producto en la aplicación en la Google Play Console
• Crear una suscripción en la Google Developer Console

Es posible que se te pida que introduzcas alguna información adicional para habilitar los pagos en tu cuenta de desarrollador.

Como tendrás que crear un producto de compra en la aplicación en cada plataforma, asegúrate de que utilizas el mismo ID de producto en ambas plataformas, para que sea más fácil activar la compra en la aplicación a través de JavaScript (ver más abajo).

Activar una compra en la aplicación

En primer lugar, lo más probable es que quieras comprobar si el usuario actual está utilizando tu aplicación, porque un usuario habitual del navegador no podrá realizar compras dentro de la aplicación.

Puedes utilizar getAppPlatform() != nullcon el script de ayuda de la aplicación.

Luego, si el usuario está utilizando tu aplicación, puedes utilizar el siguiente JavaScript para activar una compra en la aplicación.

<script>
    try {
        // productId is the ID you specified for the in app purchase product in App Store Connect and the Google Play Console
        // consumable is a boolean value that indicates whether the product can be purchased multiple times (consumable==true) or just once (consumable==false)
        // subscriptions should use consumable==false
        // userIdentifier can be any string that identifies the current user.
        // The userIdentifier will be sent to your server's unlocking endpoint if the purchase is successful (so you can then unlock the product that was bought on your server)
        resultingStatus = await makeInAppPurchase(productId, consumable, userIdentifier)["status"];
        
        switch (resultingStatus) {
            case "failed":
                // The purchase failed, for example due to an error while verifying the purchase
                break;
            case "canceled":
                // The user canceled the purchase, for example by pressing the back button
                break;
            case "completed":
                // The purchase was successful
                break;
        }
    } catch (e) {
        // Some kind of error occurred, e.g. the given productId is invalid
    }
</script>
    

Mientras esperas la función, el usuario estará en una pantalla proporcionada por la app. La función de JavaScript devolverá una vez que la compra esté completada para que puedas recargar la página o actualizar la interfaz de usuario como consideres necesario. Una vez que el usuario cierre la pantalla nativa de la app, volverá a tu sitio web.

Restaurar las compras en la aplicación

También puedes ofrecer una opción de "Restaurar compras" a tus usuarios.

<script>
    restorePurchases()
</script>
    

Normalmente, la restauración de las compras es necesaria cuando los usuarios desinstalan la aplicación y la vuelven a instalar en un nuevo dispositivo. Entonces pueden restaurar sus compras anteriores. Tú ya almacenas la información y las compras del usuario en tu servidor, que es independiente del dispositivo del usuario.

Seguimos ofreciéndote la oportunidad de integrar una funcionalidad de restauración de la compra con la esperanza de que pueda ser útil en otras circunstancias, por ejemplo, podría ayudar si algo sale mal mientras se verifica y desbloquea la compra de un usuario.

Próximos pasos

Después de que un usuario complete una compra en la aplicación, la compra tiene que ser verificada en un servidor y, si se verifica con éxito, los contenidos comprados deben ser desbloqueados en tu servidor.

Consulta tu configuración de compras en la aplicación para más información y guías.