Need help upgrading to Ionic Framework 4.0? Get assistance with our Enterprise Migration Services EXPLORE NOW

Apple Pay

Improve this doc

A dependency free Cordova plugin to provide Apple Pay functionality.

Repo: https://github.com/samkelleher/cordova-plugin-applepay

Installation

  1. Install the Cordova and Ionic Native plugins:
    $ ionic cordova plugin add cordova-plugin-applepay
    $ npm install --save @ionic-native/apple-pay@4
    
  2. Add this plugin to your app's module

Supported platforms

Usage

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


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();
}

Instance Members

canMakePayments()

Detects if the current device supports Apple Pay and has any capable cards registered.

Returns: Promise<IMakePayments> Returns a promise

startListeningForShippingContactSelection()

Starts listening for shipping contact selection changes Any time the user selects shipping contact, this callback will fire. You must call updateItemsAndShippingMethods in response or else the user will not be able to process payment.

Returns: Observable<ISelectedShippingContact> emits with shipping contact information on shipping contact selection changes

stopListeningForShippingContactSelection()

Stops listening for shipping contact selection changes

Returns: Promise whether stop listening was successful. This should really only fail if this is called without starting listening

updateItemsAndShippingMethods(list)

Update the list of pay sheet items and shipping methods in response to a shipping contact selection event. This must be called in response to any shipping contact selection event or else the user will not be able to complete a transaction on the pay sheet. Do not call without subscribing to shipping contact selection events first

Param Type Details
list IOrderItemsAndShippingMethods

items and shippingMethods properties.

Returns: Promise<IUpdateItemsAndShippingStatus>

makePaymentRequest(order)

Request a payment with Apple Pay

Param Type Details
order IOrder

Returns: Promise<IPaymentResponse> Returns a promise that resolves when something happens

completeLastTransaction(complete)

Once the makePaymentRequest has been resolved successfully, the device will be waiting for a completion event. This means, that the application must proceed with the token authorization and return a success, failure, or other validation error. Once this has been passed back, the Apple Pay sheet will be dismissed via an animation.

Param Type Details
complete ITransactionStatus

Returns: Promise<ICompleteTransaction> Returns a promise that resolves after confirmation of payment authorization completion

API

Native

General