iOS inapp purchase plugin return null - ios

Question

I'm using cordova to make an app in iOS store an I also use https://github.com/j3k0/cordova-plugin-purchase/blob/master/doc/api.md for integrate in-app purchase.
I already create product on my iTunes connect and put the code like
function initStore(){
if (!window.store) {
log('Store not available');
return;
}
// Enable maximum logging level
store.verbosity = store.DEBUG;
// Enable remote receipt validation
//store.validator = "https://api.fovea.cc:1982/check-purchase";
// Inform the store of your products
alert('registerProducts');
store.register({
id: 'com.thegiffary.product.quran_full',
alias: 'full version',
type: store.NON_CONSUMABLE
});
// When any product gets updated, refresh the HTML.
store.when("product").updated(function (p) {
alert(JSON.stringify(p))
});
// When purchase of the full version is approved,
// show some logs and finish the transaction.
store.when("full version").approved(function (order) {
alert('You just unlocked the FULL VERSION!');
order.finish();
});
// The play button can only be accessed when the user
// owns the full version.
store.when("full version").updated(function (product) {
alert(JSON.stringify(product))
});
// When the store is ready (i.e. all products are loaded and in their "final"
// state), we hide the "loading" indicator.
//
// Note that the "ready" function will be called immediately if the store
// is already ready.
store.ready(function() {
alert('ready')
});
// When store is ready, activate the "refresh" button;
store.ready(function() {
alert('refresh-button')
});
// Alternatively, it's technically feasible to have a button that
// is always visible, but shows an alert if the full version isn't
// owned.
// ... but your app may be rejected by Apple if you do it this way.
//
// Here is the pseudo code for illustration purpose.
// myButton.onclick = function() {
// store.ready(function() {
// if (store.get("full version").owned) {
// // access the awesome feature
// }
// else {
// // display an alert
// }
// });
// };
// Refresh the store.
//
// This will contact the server to check all registered products
// validity and ownership status.
//
// It's fine to do this only at application startup, as it could be
// pretty expensive.
alert('refresh');
store.refresh();
}
When I test the code on real device, it return product with null information (please see the picture)
I'm not sure am I miss any thing when I config the in-app product? Please give me any suggestion.
Regards.

Answer 1

I was facing a similar problem developing an android in-app-purchasing app. I am going to take a stab in the dark and guess that the problem might be similar. My issue was that the id for my product did not match what I was trying to pull from the store.
The product id and type have to match products defined in your Apple and Google developer consoles.
In my case, when the product loaded, it had the same field values as the one you are getting now. I changed the id, and it loaded perfectly. You may want to check those two values in your store.register function.