How to get working In-App Purchases (IAP) using Cordova on iOS?

Question

After successful delivery In-App Purchases (IAPs) on Android using Apache Cordova and https://github.com/j3k0/cordova-plugin-purchase I can't get it working properly on iOS. The problem is that once the item is clicked the price shows its details etc., but if use clicks "Cancel" then the user can't purchase anything anymore. Unless restarting the game, as far as I'm aware I should handle rejection/cancellation events. Tried these, but so far no success.

This is how I was trying to handle these events (rejection/cancellation), including playing with store.refresh() in different locations of the code and without it as well:

// Handle rejection and cancel events.
store.when("com.XX.YY.gems5").rejected(function(order) {
  store.refresh();
  that.game.state.start("GemsState");
  store.refresh();
});
store.when("com.XX.YY.gems5").cancelled(function(order) {
  store.refresh();
  that.game.state.start("GemsState");
  store.refresh();
});

Code, which correctly works on Android (the handling wasn't required there in order to work properly):

'use strict';
var that = this;

// Prepare product.
store.register({
  id:    "com.XX.YY.gems5",
  alias: "Gems 5",
  type:  store.CONSUMABLE
});

// Purchase product.
store.order("com.XX.YY.gems5");
store.refresh();
store.when("com.XX.YY.gems5").approved(function (order) {
  order.finish();
  store.refresh();

  // Add extra gems.
  localStorage.gems = parseInt(localStorage.gems) + 5; // Add 5 gems.
  that.upgrade_sound.play(); // Play upgrade sound.
  that.game.state.start("GemsState");
  that.menu_items[1].select(); // Select second item.
});

I'm using Phaser 2 & ES5.

Answer 1

Apparently this plugin works has sometimes a little bit different behaviour on Android and on iOS, which is the case here. First of all, store.refresh(); should be once and at the end of this code. Below working fine iOS example:

'use strict';
var that = this;

store.register({
  id:    "com.XX.YY.gems5",
  alias: "Gems 5",
  type:  store.CONSUMABLE
});

store.order("com.XX.YY.gems5"); // Initialize purchase.

// Handle approved purchase.
store.when("XX.YY.ZZ.gems20").approved(function (order) {
  // Add extra gems.
  localStorage.gems = parseInt(localStorage.gems) + 20; // Add 20 gems.

  order.finish(); // Finish purchase.
});

store.refresh(); // Refresh the store to start everything.

There are also several drawbacks, which if you'd like to get further insights you can check issue#333 (comment)