Comment configurer votre site web pour qu'il utilise les achats intégrés ?

Mis à jour le 18. février 2024 par Jan Bunk


Créer des achats intégrés

Vous pouvez suivre ces guides pour créer des achats intégrés (in app purchase) et des abonnements :

Il se peut que l'on vous demande d'entrer quelques informations supplémentaires pour permettre les paiements dans votre compte de développeur.

Comme vous devrez créer un achat intégré dans chaque plateforme, veillez à utiliser le même identifiant de produit sur les deux plateformes, de sorte que le déclenchement de l'achat intégré via JavaScript soit plus facile (voir ci-dessous).

Déclencher un achat intégré dans l'application

Tout d'abord, vous voudrez probablement vérifier si l'utilisateur actuel utilise votre application, car un utilisateur de navigateur ordinaire ne pourra pas effectuer d'achats intégrés.

Vous pouvez utiliser getAppPlatform() != null avec le script d'aide de l'application.

Ensuite, si l'utilisateur utilise votre application, vous pouvez utiliser le JavaScript ci-dessous pour déclencher un achat intégré dans l'application.

Nous vous conseillons de consulter la fonction executeWhenAppReady() dans notre script d'aide de l'application. Elle garantit que votre site web n'essaie pas d'interagir avec l'application avant qu'elle ne soit prête ou lorsque votre site web est chargé à l'aide d'un navigateur normal (Erreur de référence, la fonction n'est pas définie).

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

Pendant que vous attendez la fonction, l'utilisateur se trouve sur un écran fourni par l'application. La fonction JavaScript reviendra une fois l'achat effectué, ce qui vous permettra de recharger la page ou de mettre à jour l'interface utilisateur si vous le jugez nécessaire. Une fois que l'utilisateur ferme l'écran de l'application native, il retourne sur votre site web.

Une capture d'écran de l'application qui attend que l'achat en ligne soit terminé.

Restaurer les achats intégrés

Nous vous conseillons de consulter la fonction executeWhenAppReady() dans notre script d'aide de l'application. Elle garantit que votre site web n'essaie pas d'interagir avec l'application avant qu'elle ne soit prête ou lorsque votre site web est chargé à l'aide d'un navigateur normal (Erreur de référence, la fonction n'est pas définie).

Vous pouvez également proposer une option "Restore Purchases (Restaurer les achats)" à vos utilisateurs.


<script>
    restorePurchases()
</script>
    

Généralement, la restauration des achats est nécessaire lorsque les utilisateurs désinstallent l'application et l'installent à nouveau sur un nouvel appareil. Ils peuvent alors restaurer leurs achats précédents. Les informations et les achats de l'utilisateur sont déjà stockés sur votre serveur, lequel est indépendant de l'appareil de l'utilisateur.

Nous vous donnons encore la possibilité d'intégrer une fonctionnalité de restauration des achats dans l'espoir qu'elle puisse être utile dans d'autres circonstances, par exemple, en cas de problème lors de la vérification et du déverrouillage des achats d'un utilisateur.

Prochaines étapes

Après qu'un utilisateur a effectué un achat dans l'application, l'achat doit être vérifié sur un serveur et s'il est vérifié avec succès, le contenu acheté doit être déverrouillé sur votre serveur.

Veuillez consulter vos paramètres d'achat intégrés dans l'application pour plus d'informations et pour accéder à des guides.