Article initialement posté sur Medium.
Introduction
In App Purchase (or integrated purchase) gives the opportunity to sell additional content within a native mobile application (smartphone and tablet). If your product matches the in-app purchase categories bellow, then you can, and even must, use In app-purchase.
What can I sell using IAP ?
In principle, you can sell whatever you want as long as it belongs to the following categories :
Consumable
Users can purchase different types of consumables, such as lives or gems in a game, to further their progress through an app. Consumable in-app purchases are used once, are depleted, and can be purchased again.
Non-Consumable
Users can purchase non-consumable, premium features within an app. Non-consumables are purchased once and do not expire, such as additional filters in a photo app.
Auto-Renewable Subscriptions
Users can purchase access to services or periodically updated content, such as monthly access to cloud storage or a weekly subscription to a magazine.
Non-Renewing Subscriptions
Users can purchase access to services or content for a limited duration, such as a season pass to streaming content. This type of subscription does not renew automatically, so users need to renew each time.
You can find more informations here => the apple documentation
Our Bewiz Spin App
We want to create a mobile app in which the user can buy credits that we will call Bewiz. With these Bewizs he can spin a wheel, to try to win gifts 🎁 (1 Bewiz => 1 spin)
Photo by Navneet Shanu from Pexels
For our case, we will need to use consumable products because it's used to buy credits that are used once to spin the wheel.
Lets imagine that we have this set of suggested products :
10 Bewiz for 10€, 50 Bewiz for 40€ and 100 Bewiz for 75€
Let's see how can we put all this in place … 😀
What I need to set up IAP
Ionic / Cordova mobile application
As we will develop an ionic mobile app, you can follow these steps to initiate your project :
Free Mobile App Development: Getting Started with Ionic Apps
Create an Ionic App using one of our ready-made app templates, or a blank one to start fresh. Check out the Market for… ionicframework.com
Server side application
For security reasons, the purchase validation should be done in the server side.
After each purchase the store returns a receipt data that should be validated in the server side (a base64 string for IOS, and a Json format for Android).
For our Bewiz Spin we will use a PHP server side receipt validation using this open source library :
aporat / store-receipt-validator
PHP receipt validator for Apple iTunes, Google Play and Amazon App Store
store-receipt-validator
PHP receipt validator for Apple iTunes, Google Play and Amazon App Store
Requirements
- PHP >= 7.2
Installation
composer require aporat/store-receipt-validator
Quick Example
iTunes
use ReceiptValidator\iTunes\Validator as iTunesValidator
$validator = new iTunesValidator(iTunesValidator::ENDPOINT_PRODUCTION); // Or iTunesValidator::ENDPOINT_SANDBOX if sandbox testing
$receiptBase64Data = 'ewoJInNpZ25hdHVyZSIgPSAiQXBNVUJDODZBbHpOaWtWNVl0clpBTWlKUWJLOEVkZVhrNjNrV0JBWHpsQzhkWEd1anE0N1puSVlLb0ZFMW9OL0ZTOGNYbEZmcDlZWHQ5aU1CZEwyNTBsUlJtaU5HYnloaXRyeVlWQVFvcmkzMlc5YVIwVDhML2FZVkJkZlcrT3kvUXlQWkVtb05LeGhudDJXTlNVRG9VaFo4Wis0cFA3MHBlNWtVUWxiZElWaEFBQURWekNDQTFNd2dnSTdvQU1DQVFJQ0NHVVVrVTNaV0FTMU1BMEdDU3FHU0liM0RRRUJCUVVBTUg4eEN6QUpCZ05WQkFZVEFsVlRNUk13RVFZRFZRUUtEQXBCY0hCc1pTQkpibU11TVNZd0pBWURWUVFMREIxQmNIQnNaU0JEWlhKMGFXWnBZMkYwYVc5dUlFRjFkR2h2Y21sMGVURXpNREVHQTFVRUF3d3FRWEJ3YkdVZ2FWUjFibVZ6SUZOMGIzSmxJRU5sY25ScFptbGpZWFJwYjI0Z1FYVjBhRzl5YVhSNU1CNFhEVEE1TURZeE5USXlNRFUxTmxvWERURTBNRFl4TkRJeU1EVTFObG93WkRFak1DRUdBMVVFQXd3YVVIVnlZMmhoYzJWU1pXTmxhWEIwUTJWeWRHbG1hV05oZEdVeEd6QVpCZ05WQkFzTUVrRndjR3hsSUdsVWRXNWxjeUJUZEc5eVpURVRNQkVHQTFVRUNnd0tRWEJ3YkdVZ1NXNWpMakVMTUFrR0ExVUVCaE1DVlZNd2daOHdEUVlKS29aSWh2Y05BUUVCQlFBRGdZMEFNSUdKQW9HQkFNclJqRjJjdDRJclNkaVRDaGFJMGc4cHd2L2NtSHM4cC9Sd1YvcnQvOTFYS1ZoTmw0WElCaW1LalFRTmZnSHNEczZ5anUrK0RyS0pFN3VLc3BoTWRkS1lmRkU1ckdYc0FkQkVqQndSSXhleFRldngzSExFRkdBdDFtb0t4NTA5ZGh4dGlJZERnSnYyWWFWczQ5QjB1SnZOZHk2U01xTk5MSHNETHpEUzlvWkhBZ01CQUFHamNqQndNQXdHQTFVZEV3RUIvd1FDTUFBd0h3WURWUjBqQkJnd0ZvQVVOaDNvNHAyQzBnRVl0VEpyRHRkREM1RllRem93RGdZRFZSMFBBUUgvQkFRREFnZUFNQjBHQTFVZERnUVdCQlNwZzRQeUdVakZQaEpYQ0JUTXphTittVjhrOVRBUUJnb3Foa2lHOTJOa0JnVUJCQUlGQURBTkJna3Foa2lHOXcwQkFRVUZBQU9DQVFFQUVhU2JQanRtTjRDL0lCM1FFcEszMlJ4YWNDRFhkVlhBZVZSZVM1RmFaeGMrdDg4cFFQOTNCaUF4dmRXLzNlVFNNR1k1RmJlQVlMM2V0cVA1Z204d3JGb2pYMGlreVZSU3RRKy9BUTBLRWp0cUIwN2tMczlRVWU4Y3pSOFVHZmRNMUV1bVYvVWd2RGQ0TndOWXhMUU1nNFdUUWZna1FRVnk4R1had1ZIZ2JFL1VDNlk3MDUzcEdYQms1MU5QTTN3b3hoZDNnU1JMdlhqK2xvSHNTdGNURXFlOXBCRHBtRzUrc2s0dHcrR0szR01lRU41LytlMVFUOW5wL0tsMW5qK2FCdzdDMHhzeTBiRm5hQWQxY1NTNnhkb3J5L0NVdk02Z3RLc21uT09kcVRlc2JwMGJzOHNuNldxczBDOWRnY3hSSHVPTVoydG04bnBMVW03YXJnT1N6UT09IjsKCSJwdXJjaGFzZS1pbmZvIiA9ICJld29KSW05eWFXZHBibUZzTFhCMWNtTm9ZWE5sTFdSaGRHVXRjSE4wSWlBOUlDSXlNREV5TFRBMExUTXdJREE0T2pBMU9qVTFJRUZ0WlhKcFkyRXZURzl6WDBGdVoyVnNaWE1pT3dvSkltOXlhV2RwYm1Gc0xYUnlZVzV6WVdOMGFXOXVMV2xrSWlBOUlDSXhNREF3TURBd01EUTJNVGM0T0RFM0lqc0tDU0ppZG5KeklpQTlJQ0l5TURFeU1EUXlOeUk3Q2draWRISmhibk5oWTNScGIyNHRhV1FpSUQwZ0lqRXdNREF3TURBd05EWXhOemc0TVRjaU93b0pJbkYxWVc1MGFYUjVJaUE5SUNJeElqc0tDU0p2Y21sbmFXNWhiQzF3ZFhKamFHRnpaUzFrWVhSbExXMXpJaUE5SUNJeE16TTFOems0TXpVMU9EWTRJanNLQ1NKd2NtOWtkV04wTFdsa0lpQTlJQ0pqYjIwdWJXbHVaRzF2WW1Gd2NDNWtiM2R1Ykc5aFpDSTdDZ2tpYVhSbGJTMXBaQ0lnUFNBaU5USXhNVEk1T0RFeUlqc0tDU0ppYVdRaUlEMGdJbU52YlM1dGFXNWtiVzlpWVhCd0xrMXBibVJOYjJJaU93b0pJbkIxY21Ob1lYTmxMV1JoZEdVdGJYTWlJRDBnSWpFek16VTNPVGd6TlRVNE5qZ2lPd29KSW5CMWNtTm9ZWE5sTFdSaGRHVWlJRDBnSWpJd01USXRNRFF0TXpBZ01UVTZNRFU2TlRVZ1JYUmpMMGROVkNJN0Nna2ljSFZ5WTJoaGMyVXRaR0YwWlMxd2MzUWlJRDBnSWpJd01USXRNRFF0TXpBZ01EZzZNRFU2TlRVZ1FXMWxjbWxqWVM5TWIzTmZRVzVuWld4bGN5STdDZ2tpYjNKcFoybHVZV3d0Y0hWeVkyaGhjMlV0WkdGMFpTSWdQU0FpTWpBeE1pMHdOQzB6TUNBeE5Ub3dOVG8xTlNCRmRHTXZSMDFVSWpzS2ZRPT0iOwoJImVudmlyb25tZW50IiA9ICJTYW5kYm94IjsKCSJwb2QiID0gIjEwMCI7Cgkic2lnbmluZy1zdGF0dXMiID0gIjAiOwp9'
try {
$response = $validator->setReceiptData($receiptBase64Data)->validate()
// $sharedSecret = '1234...'; // Generated in iTunes Connect's In-App Purchase menu
// $response = $validator->setSharedSecret($sharedSecret)->setReceiptData($receiptBase64Data)->validate(); // use setSharedSecret() if for recurring subscriptions
} catch (Exception $e) {
echo 'got error = ' . $e->getMessage() . PHP_EOL;
}
if ($response->isValid()) {
echo 'Receipt is valid.' . PHP_EOL;
echo 'Receipt data = ' . print_r($response->getReceipt()) . PHP_EOL;
foreach ($response->getPurchases() as $purchase
…In app purchase Cordova plugin
For now, there is one main open source cordova plugin available on Github and supported by the ionic community.
j3k0 / cordova-plugin-purchase
In-App Purchase for Cordova on iOS, Android and Windows
Cordova Purchase Plugin
In-App Purchases for Cordova
Need professional help and support? Contact Me.
I dedicate a considerable amount of my free time to developing and maintaining this Cordova plugin, along with my other Open Source software. To help ensure this plugin is kept updated, new features are added and bugfixes are implemented quickly, please donate a couple of dollars (or a little more if you can stretch) as this will help me to afford to dedicate time to its maintenance. Please consider donating if you're using this plugin in an app that makes you money, if you're being paid to make the app, if you're asking for new features or priority bug fixes. Thank you!
Summary
This plugin allows In-App Purchases to be made from Cordova, PhoneGap and Ionic applications.
It lets you handle in-app purchases on many platforms with a single codebase.
Features
ios | android |
---|
There is also a wrapper for ionic applications :
In App Purchase 2 - Ionic Documentation
Ionic is the app platform for web developers. Build amazing mobile, web, and desktop apps all with one shared code base… ionicframework.com
Add all these dependencies to your package.json :
BILLING_KEY in the plugin's configuration matches your license key for in-app billing should be added manually to your project. This key is found in Services and API in the Google Play Developer Console.
For more informations : here
Google and Apple accounts
To be able to configure your IAP items you need to create an iTunes developer account for IOS app and play store account for Android
Apple Developer
There's never been a better time to develop for Apple Platforms. developer.apple.com
Register your products
Register all your products in the google play console and apple iTunes console.
For reminder, you have 3 products (10, 50 and 100 credits), so you have to create 3 product IDs: credits_10, credits_50, credits_100
You can find below how to create your in app products on IOS and Android
Create In App Products in your Google Play Account
In order to be able to offer a fee-based edition through in-app purchases in your Kiosk-App for Android devices, an… support.pressmatrix.com
All the In App Products should be registered in the app bootstrap, this synchronize the local products data with the remote one.
IAP Product lifecycle
There is many events triggered with the purchase workflow, that allow us to handle and manage errors, success, updates …
Approved means that the product is purchased and the purchase is validated locally, ideally it's the best place to call product.verify() to start server side receipt validation.
Cancelled when the purchase is cancelled, it's time to show an error message.
Error when an error occurs during purchase workflow
Updated it's a push based event, when the product informations are updated (price, label, … )
Server side verification
When product.verify() is called, an inAppPurchase.validator event is triggered and it's the best place where you can execute your server side receipt verification.
For our example the creditsProvider.purchase() is responsible for receipt verification and return a status according to the validation results ("success" or "failure")
Having a success status means that the receipt is valid and now we can finish the transaction by calling product.finish()
Execute IAP Order
To trigger the purchase workflow above you should call the inAppPurchase.order()
Turn off listeners
After leaving the view, you should turn off all the event listeners by calling inAppPurchase.off()
Sandbox and test users
For testing purposes you should define sandbox iCloud users for IOS and add test users for Android.
Here bellow you can find some links that will help
Finally a demo App…
Now that you have all what you need to begin your IAP setup, you may probably wish to have a complete demo app with all the steps above… you can find bellow a complete demo app :
devHamza / iap-demo-ionic-app
Demo application for in app purchase with ionic / cordova
This is a demo app for the article : "In App Purchase with Ionic/Cordova" find more at https://medium.com/bewizyu
BEWIZYU Technology Développement, expertise sur plateformes à usage mobile www.bewizyu.com
Top comments (0)