Skip to main content

​
Introduction

This guide covers the steps to integrate Apple Pay as a payment option for users. In order to enable Apple Pay, perform the following integration steps
  1. Initialize Push Apple Pay launcher and display button
  2. Launch payment session and create intent
  3. Receive confirmation of payment status via webhook

​
Step 1: Display Apple Pay button

Enable users to select Apple Pay as their payment option by initializing the Push Apple Pay launcher and displaying the Apple Pay button when a user loads the payment page Make a call POST /token with the user’s ID and type = ‘apple_pay’. A new token must be created each time the user loads the payment page and should not be cached.
If a user has not previously used Push, you must first register them by calling create-user.
Example request: 
POST /token
REQUEST
{
    "user_id": "user_lVpbPL0K1XIiHx0DxipRbD",
    "type": "apple_pay"
}

RESPONSE
{
    "token": "token_mbDRHFi3dxIZEtykHsgUGC",
}
Then, initialize the launcher on your payment page by calling the Push SDK with the token.
The Push SDK can be installed from https://cdn.pushcash.com/sdk/push.umd.js via a script tag on your payment page
const launcher = new window.PushCash.ApplePay({
  token: '<your-token>'
});
Finally, check if Apple Pay is supported on the user’s device and render the Apple Pay button. 
if (window.ApplePaySession) {
    const canMakePayments = ApplePaySession.canMakePayments();

    if (canMakePayments) {
        // render Apple Pay option to DOM
    }
}
For more information on how to style and display the button, please review Apple’s design guidelines and official javascript guide.

​
Step 2: Launch payment session & create payment intent

When the user selects Apple Pay as their payment option, in the onClick handler launch the payment session and call the Push API to create a payment intent by handling the onStart callback. 
launcher.display({
  amount: 1000,  // amount of payment in cents
  direction: 'cash_in',
  currency: 'USD',
  onStart: async () => {
    // intiate a payment intent from your backend by providing the token used to initialize the launcher to the Push POST /intent endpoint
  }
});
The token is the only required argument to POST /intent
You may additionally provide an onComplete() callback that runs when the Apple Pay payment sheet is dismissed. 
launcher.display({
  //...,
  onStart: async () => { /* ... */ },
  onComplete: () => {
    // handle session completion
  }    
});

​
Step 3: Receive payment status via webhook

Refer to the enabling webhooks guide on how to receive asynchronous updates about payment status. This webhook will be how you are notified if the payment is approved or declined.