How to use Ionic In App Purchase with Capacitor

[@AntojoTech]

How do I update that purchase that was made safely in my backend?

[@PhaseControlDNB]

Nice explanation, thanks for the video. One thing I wonder - how did you manage to do a purchase on the iOS simulator? I thought that on iOS purchases are possible only on a physical device

[@abraaoazevedo5077]

I would like to know the answer too

[@grinnex]

What you see aren't emulators. It's real devices being mirrored.

[@CarlosSanchez-dp9wv]

He is using an actual Device, but You can use a StoreKit configuration file to define mock purchases and assign it to a simulator. Check the link below: developer.apple.com/documentation/xcode/setting-up-storekit-testing-in-xcode

[@koustavsarkar3378]

Great work sir absolute ionic hero , love from INDIA ❤️

[@ricardorincon3644]

hello Simon, have you more information or example about ionic 7 and capacitor 5 ? or do you know where can I get more about that plugin with ionic 7 plis

[@stickyjoe8340]

How to do it in vue or React?

[@MarcosVinicius-gj6qg]

Thanks for the great tutorial. I did everything the same as the tutorials, but the products don't appear. Permissions and code all the same but it doesn't work. Besides Paypal and Stripe, is there another alternative?

[@dimitriscsd]

Check and make sure you have accepted the Paid apps terms in app store connect... I know it's silly but that needs to be accepted for products to be deemed valid...

[@royal-code]

Awesome content as always Simon.. good job!

[@galaxies_dev]

Glad you enjoyed it!

[@mifo8617]

Hi Simon, great video, thank you! But why do you recommend a server side receipt validation at the end? The products would be restored without a server side receipt validation, correct?

[@galaxies_dev]

If you don't really have any sort of backend where the user got access to it might not make a big difference, but otherwise it's important to make sure your app and the information about the user subscription/purchase inside your backend are aligned correctly!

[@adriangaray1877]

Thank you, you make always good content to see, Greetings from Mexico

[@galaxies_dev]

Glad you like them!

[@igorigor806]

Hi Simon, thanks for the video. I've been struggling with in-app purchases for some time. Now I'm at the point, when it sends indefinite amount of requests to check if a subscription is owned and another problem, it can have state when two subscriptions are active at a time. Despite the fact, that they are in the same group and by apple's logic they cannot be active two at a time. Maybe you faced this problems or just know how to solve it, what to check?

[@galaxies_dev]

I haven't worked with subscriptions so far, perhaps I should create another video on that topic?

[@igorigor806]

@@galaxies_dev that would be perfect. Since I wrote my comment I could get to the point where it looks like it works. But still I have a problem that when I upgrade my subscription (I have several types in my app) it cancels everything when it gets to expiration date. Maybe it's because it's dev mode, not sure. Also for some reason when I load products there is always one more product than I have. And it looks like it's the app itself, because it has type: application and id is my bundle id. Couldn't find answers about that. So video from you would be perfect and thanks for your work :)

[@andresrolong2960]

@Simon Grimm please!🙏

[@thefunniestvideos458]

@@galaxies_dev still waiting for this video ;(

[@Fuetty22]

Hi Simon, thanks for the great video. My problem is the testing process with non consumables. Ones I bought a non consumable, I cant test it anymore, because I already purchased it. Do you have any idea on this issue? Kind regards

[@jean13666]

Same problem here. Please advise.

[@duanehodges3146]

As always you have the best tutorials. I'm getting an WARNING WARNING: ios -> product PRODUCTNAME is NOT valid (PRODUCTNAME)

[@jorgeloz19]

Hi, I have the same, what was your solution?

[@luisalfonsogonzalez7689]

Hola, estoy teniendo el mismo problema, pudiste resolverlo? Te lo agradecería mucho

[@gyulabarakso5991]

You have to fill your bank and tax information first, then you can do sandbox testing. 🤫🤫

[@TolgaKoseoglu]

Sehr gut, Simon. Hast' yut yemacht! Keep it up

[@umashankarsaw9552]

Is required to add the banking details to get the data in debug mode ?

[@DevarshiDavessj4]

Can you create a video on server side verification step?

[@dmitriykabakov6128]

Is it possible to create a video with the same workflow but on React ? I have a really hard time with this (:p)

[@ketank6864]

same here

[@tokiniainaRakotonirina]

it takes too long time to show purchase popup on ios. Do you have solution for that? thx

[@robertonodi497]

Hello Simon! Thanks for this video! Need an own developer account for every application if we use google/apple pay? If not, how can I set invoice settings a specific application? Thank you!

[@galaxies_dev]

Need to get more into those payment types first, can't say right now :/

[@Sohneg]

Is there an updated version? I can't get it to work :(

[@Eyezbergslim]

Simon, would you do a tutorial on the built in Ionic e2e testing framework.

[@galaxies_dev]

Yes sounds like a good idea!

[@tokiniainaRakotonirina]

it takes too long time to show the purchase popup in ios. Do you have solution for that?

[@justineysseric9399]

Hello Simon, First of all, I wanted to thank you for the very comprehensive tutorials that you are making for us. I followed your tutorial: ‘How to use Ionic In App Purchase with Capacitor’ , Google Play Console is correctly configured, as well as my application. Let me also say that I did not use a capacitor. I’m writing to you because I ran into a problem: when I launch my application, the purchases are not found, I only have the restoration button that appears and the both variables ‘gems’ and ‘IsPro’ but nothing else on the page. Is the problem coming from the fact that I didn’t use a Capacitor ? What I do correctly: -I put a first version of the application online (Closed Alpha test) and wait for Google to publish it -I put a testing email address and i added it in the licence tests (Email address used in the testing device with the activation link) -I have matched products ID in the application with thoses created on Play Console -The both products created on Play console have the « active » status -I installed the both Cordova plugins needed for purchasing, and I did not change the code that you put online on: devdactic.com/ionic-in-app-purchase-capacitor/ -IDE and Android Studio did not detect mistakes in the code -I added the selling permission in the AndroidManifest.xml file -I signed the application The versions: Ionic: 5.4.16 Cordova: 10.0.0 Npm: 6.14.6 Do you have time, please, to help me fix this problem ? Yours faithfully, Justin.

[@justineysseric9399]

Solved: if you have the same problem as me, run this command in your project: ionic cordova plugin add cc.fovea.cordova.purchase

[@flonmackenzie2876]

Hey Simon, thanks for the great content. Is it possible to use Apple Pay with Ionic with the latest iOS version? I can't seem to find much on this at all.

[@galaxies_dev]

Actually no idea - will check it out!

[@sultanmyrza]

I get duplicate products when I leave the page and come back. Is it happening to you as well?

[@ketank6864]

how can i implement in app purchase for ios app converted using capacitor from React JS.?

[@HarinderRatton]

Thanks for great tut

[@galaxies_dev]

You're welcome!

[@joseluispulgarin2370]

Hi simon, I don't know why my products come out in null, but not the id and alias, you know why that happens?

[@adeelali5948]

Hy It gives one extra object at the end in my products array.. How i can remove that also on going back to previous page ..and then came the products list is doubled ..

[@Yheeky]

Hi Simon, nice video, thanks for that! But I´ve a question. I´ve added the implementation into my app and in generel it works fine but there is one case which bothers me and I would like to know if you have a solution for that. As soon as a subscription expired my app still got unlocked with premium features because the Update-Event still returned the product with owned = true. Even though the Expire-Event did not fire - should not that happen? As soon as I restart the app, everything is fine but if not the user can use the premium features as long as he stays in the app. A store.refresh() did not help - still get owned = true back from Google. Thanks in advance!

[@rayarozen]

I have one problem that it only works for the first time . Can you help me

[@HarinderRatton]

you saved my life broooo

[@galaxies_dev]

Always happy to help :)

[@getermoura]

Is this a reliable solution? Can we trust those packages will be updated for future store requirements? Because I contacted Ionic for their official IAP plugin and they told me its $15,000 per year to use it, which I believe it's a deal breaker for most trying to develop something from scratch.

[@galaxies_dev]

You can always question the reliability of community maintained plugins! You could fork it and make sure it always works for the latest SDK yourself instead. And Ionics package is meant for enterprise and their support needs, not really the "standard" small developer!

[@getermoura]

​@@galaxies_dev Funny because most, if not all Ionic learning content around, even paid one(S), show how "you can create an multi-platform app easy and fast"(something in those lines), naturally attracting exactally newcomers and ""standard" small developers" trying to innovate or fill a market gap with a new service fast, as any worthy idea needs to be delivered. But when it comes to the most basic, essential needs of anyone starting a business, that is capitalizing, the documentation is scarce, community plugin based(that in some point in time were also left empty handed by the IONIC world), with small numbers of contributors that in some cases just disappear without event leaving a "not maintained anymore" message. But you can always count with the "official" plugins in to cover for you!! And then, when you're deep enough in planning, you go check their prices(THAT ARE ONLY DISCLOSED UPON CONTACT WITH THEIR SALES TEAM) and you are blasted away with $15k. That so absurd that when you think about that amount in other countries currencies.. ufff. No non american/non european developer can even think about trying it. Thanks, we are seriously thinking about going native now.

[@beenmicrophone5817]

@@getermoura wow. i think i will be going native now aswell.

[@DanielLima97dlcs]

Can I use subscriptions with no server side receipt validation? I noticed even with no server side validation the update listener returns if the product is owned or not..

[@bekkur81]

Thanks for a great tutorial. My project is currently registering and setting up listeners in the app.component.ts file. Would it be better to have that in the home.page.ts as you do in this tutorial?

[@galaxies_dev]

Well in general it's always good to have less code in your first pages, but since the IAP should load pretty much in the beginning I guess it's fine to keep those listeners in there, or otherwise build them into a service!

[@lestthatth]

hi again my friend, as always great content, but i have a question as well, amm this can be implement into a PWA app or it´s only with capacitor?. Greeting from Aguascalientes México

[@galaxies_dev]

This can only be used within a native app and not PWA!

[@imashalov]

Is it different for auto renewable subscriptions? What is tha recipt validation?

[@galaxies_dev]

Yeah I think it's different, might work on something about that in the future!

[@duanehodges3146]

I'm getting an error that says my test purchase wasn't acknowledged. How do we acknowledge a purchase?

[@muhammadarslankhan]

hi, i have got this error => this.store.when(...).approved is not a function I have done all those steps in the google play console is this about an old version issue or something else..? I'm using "@angular/cli": "^14.0.4", "@angular/compiler": "^14.0.4", "@angular/compiler-cli": "^14.0.4", "@capacitor/cli": "^3.5.1", ionic 6.19.0

[@muhammadarslankhan]

I have got all these issues in =. this.store.when().

[@kamalsharma1331]

@Simon pls help we got the same issue

[@hibridoapp]

​@@kamalsharma1331 Utiliza la version 11.0.0 de cordova-plugin-purchase

[@hibridoapp]

@@muhammadarslankhan Utiliza la version 11.0.0 de cordova-plugin-purchase

[@hibridoapp]

Utiliza la version 11.0.0 de cordova-plugin-purchase

[@satyashodhaka]

Hey Simon which IOS simulator are you using?

[@galaxies_dev]

The standard one you can launch from Xcode, but I think I used it on my device in this video and captured my device with the Reflector app!

[@softwareliondev]

how did you add cordova-plugin-purchase in your capacitor.config.json file? Help me :C :c

[@akshayk2482]

You dont have to.

[@vinayn1788]

Hi, how do we implement in app purchase with cordova in Ionic? I'm using ionic-angular 3.9.2

[@galaxies_dev]

Basically the same like with Capacitor :)

[@joejones6745]

Do auto renewing subscriptions expire? or how do you test that?

[@galaxies_dev]

I actually haven't touched the subscriptions yet :/

[@Arthur-fq5dd]

​@@galaxies_devHi Simon, if you could do a subscription and renewal video with verification using In App Purchase 2 with ionic that would be amazing

[@codingroom2876]

Hi, Simon setupListeners() { this.store.when('product') .approved((p: IAPProduct) => { alert('Purchase completed') return p.verify(); }); this.store.when('product') .verified((p: IAPProduct) => { p.finish(); }) } alert('Purchase completed') ; working for testers account. But in production payment success alert not showing. I need to update my usersPayment table after payment complete.

[@emanuelkoziolek1955]

Thank You for your great tutorials. It really helps to get fast into specific topics :) But one question. I stumbled also about the rendering error you had in your views (products) you mention at the end. I am pretty sure that it's not a problem with the store or configuration, but with the .detectChanges() which fires multiple times and messes up the products array and the view/ DOM can't be rendered properly anymore (check for JS errors via inspect device...) Is there in the meantime a "proper" solution for updating the view? I also had similar problems with going my app to back and foreground again in other situations. Greez from munich :)

[@emanuelkoziolek1955]

I got a solution now... for anyone stumbling about this. _ngZone is the key here.

[@galaxies_dev]

Usually you can also use the Angular Change Detector to manually trigger a view update!

[@balintsb]

@@galaxies_dev Thanks for the tutorial, very helpful. I came across the same problem as Emi. Tried ngZone, unfortunately with the same result. Maybe I used it incorrectly. Could you please advise whether you have any solutions for this?

[@emanuelkoziolek1955]

@@balintsb when your problem is only on iOS you might consider to filter your store.products with type: "application" (which is your application itself) which does not exist on Android.

[@balintsb]

@@emanuelkoziolek1955 Thank you Emi for the prompt response. Could you please provide the code of your solution? Note: my problem occurs on Android. I hope your code would do justice to this case.

[@ricardougas617]

Excellent video, works perfectly to my. Just one thing, when i build the app for android i was trying to make the payment but it wasn't in developer mode, need and extra configuration? i have the this.store.verbosity = this.store.DEBUG; Thanks!

[@joseluispulgarin2370]

hey men I have a problem, when I call some product return price: null, name: null i don't not why? do you have any answer?

[@juanchox0929]

XCode shows "Thread 1: Exception: "Invalid product identifier: (null)""... I've already configured the in-app product in AppStore Connect and I'm sending the correct product id... I don't know what to do and stackoverflow doesn't solve my problem

[@LucianoRasente]

Thank you!!

[@galaxies_dev]

Welcome!

[@TobiasLorsbach-Mainz]

Great video, helps a lot. Does anybody know a second good tutorial for implementing in ionic/react?

[@galaxies_dev]

Sorry, haven't worked with React so far :/

[@codingroom2876]

Hi simon, Is this work on ios simulator?.

[@galaxies_dev]

I think it works inside the iOS simulator, but setting up your testing account works better on a real device imho!

[@K3nn3th16]

Can you make a tutorial on using iap on react ionic capacitor?

[@galaxies_dev]

I don't have any React experience so far :/

[@aprimic]

Does this work for non native, such as CapacitorJS

[@galaxies_dev]

I'm not sure what you mean.. Yes this works with Capacitor, but you need to deploy the app to a real device.

[@MeteorKaMeter]

Show auto-renewal subscriptions tutorial

[@CKC1024]

Do I need to update AndroidManifest.xml, adding uses-permission for in app purchase? If so, what should I add? Thanks

[@galaxies_dev]

Yes you need to add: 1

[@oswaldkit]

Very cool

[@LuckystrikeGFXer]

I am still waiting for the next App review. Any idea when it will come out?

[@galaxies_dev]

No don't have a date yet!

[@LuckystrikeGFXer]

@@galaxies_dev No worries, take your time then!

[@HackHeyner]

YOU ARE GOD LIKE!!!

[@galaxies_dev]

Haha thanks Rafael!

[@dharmenderchauhan9799]

Subscription popup coming multiple time after subscribe button click on iOS and look like purchase not being success

[@priyankatalesara6834]

Getting 6777010 error..please help

[@berkearas4419]

What about a discord server, just for your community?

[@galaxies_dev]

I'll think about it, need to get a bit more into Discord I guess..

[@rajagp1722]

Sir u give me the code for customised admob free... Need to place no of banner ad into single page

[@engaChennai]

ionic paytm integration video pls

[@salmi_azrinparentsonly863]

43K Subs.... I thought Ionic is more widely used than this.

[@salmi_azrinparentsonly863]

In App Purchases should not be rocket science.. This where Android ad iOS make all their money from!

[@GuilhermeCoelhoR]

I'm getting "BatchProductsRequestDelegate.request:didFailWithError: AppStore unavailable (ERROR 0)". What should I do?