Apple Pay integration error in Ionic3

Apple Pay integration with IONIC 3. Error completeTransactionWithMerchant function of undefined
I am trying to use the plugin to integrate Apple Pay in my IONIC v3 app from https://ionicframework.com/docs/native/apple-pay/.

It is really saddening to say that this was already asked more than a couple of times [ref below] but hasn’t been addressed yet. I request the “Elite” IONIC team to look at such matters on priority. Spending so long for such petty things makes me give a second thought on the performance and team of IONIC.

Ref:

  1. Ionic 2 apple pay error
  2. https://stackoverflow.com/questions/61516440/apply-pay-ionic-v4
  3. Apple pay not working in iPhone 6s Simulator for ionic 4

Can you please share the code you have tried? It’s hard to debug or help you further without it.

Hi, I am using below code from the link https://ionicframework.com/docs/native/apple-pay/

import { ApplePay } from '@ionic-native/apple-pay/ngx';


constructor(private applePay: ApplePay) { }

...
async applePay() {
  // This block is optional -- only if you need to update order items/shipping
  // methods in response to shipping method selections
  this.applePay.startListeningForShippingContactSelection()
    .subscribe(async selection => {
      try {
        await this.applePay.updateItemsAndShippingMethods({
          items: getFromSelection(selection),
          shippingMethods: getFromSelection(selection),
        });
      }
      catch {
        // handle update items error
      }
    });

  try {
    const applePayTransaction = await this.applePay.makePaymentRequest({
      items,
      shippingMethods,
      merchantIdentifier,
      currencyCode,
      countryCode,
      billingAddressRequirement: ['name', 'email', 'phone'],
      shippingAddressRequirement: 'none',
      shippingType: 'shipping'
    });
    const transactionStatus = await completeTransactionWithMerchant(applePayTransaction);
    await this.applePay.completeLastTransaction(transactionStatus);
  } catch {
    // handle payment request error
    // Can also handle stop complete transaction but these should normally not occur
  }

  // only if you started listening before
  await this.applePay.stopListeningForShippingContactSelection();
}

This line,
const transactionStatus = await completeTransactionWithMerchant(applePayTransaction);
is throwing the below error ,

Cannot find name ‘completeTransactionWithMerchant’.ts(2304)

Offf, the docs on the plugin for sure do need a lot of work. It’s not really a good idea to mix both observables and promises as they have in here.

The first block, as stated shouldn’t be needed, and is pseudo code. But you should not mix promises and observables.

Now the real error,

await completeTransactionWithMerchant(applePayTransaction);

Is because you haven’t declared that method or created it. Again, the docs a pseudo code, and are meant to show you quick examples. the completeTransactionWithMerchant function is meant to say “go process this payment with my service”.