initApplePayButton method

WARNING

Watch Out!
The Apple Pay functionality is currently in a testing phase. It is only available for merchants in Chile 🇨🇱 and Peru 🇵🇪, and supports Visa and Mastercard cards.

Please note that this functionality is subject to change without prior notice.

initApplePayButton(kushkiInstance, options): Promise<ICardApplePay>

Introduction

Function to render the Apple Pay button and initialize an instance of ICardApplePay.

WARNING

Important!
⚠️ Domain Verification Required: To use Apple Pay, you must host the validation file on your server (at the .well-known path) and register your domain in the Kushki Console. The payment flow will not function without this verification on a secure (HTTPS) domain.

For this method to work correctly, you must include the following container in your project’s HTML:

<div id="kushki-apple-pay-button"></div>

Parameters

Parameter	Type	Description
kushkiInstance	`IKushki`	Object that implements the `IKushki` interface.
options	`ApplePayOptions`	Visual and behavioral options for the Apple Pay button.

Visual and behavioral options for the Apple Pay button:

Option	Type	Description
style	`"black"` \| `"white"`	Defines the visual style (color) of the Apple Pay button.
locale	`"en-US"` \| `"es-ES"` \| `"es-MX"` \| `"pt-BR"`	Sets the language and region for the Apple Pay button text.
type	`"add-money"` \| `"book"` \| `"buy"` \| `"check-out"` \| `"continue"` \| `"contribute"` \| `"donate"` \| `"order"` \| `"pay"` \| `"plain"` \| `"reload"` \| `"rent"` \| `"set-up"` \| `"subscribe"` \| `"support"` \| `"tip"` \| `"top-up"`	Defines the text label and action displayed on the Apple Pay button.

Returns

Promise <ICardApplePay>.

Instance of ICardApplePay.

Errors

This method may throw the following exceptions:

ERRORS.E024: Apple Pay resources were not created.
ERRORS.E025: Apple Pay payments are not available.

Initialization Example

HTML Container:

<div id="kushki-apple-pay-button"></div>

Initialize Kushki instance:

const kushkiOptions: KushkiOptions = {
  publicCredentialId: 'public-merchant-id',
  inTest: true
};

Initialize CardApplePay instance:

const options: ApplePayOptions = {
  style: "black",
  locale: "es-MX",
  type: "pay"
};

try {
  const kushkiInstance: IKushki = await init(kushkiOptions);
  const cardApplePay: ICardApplePay = await initApplePayButton(kushkiInstance, options);
} catch (e: any) {
  console.error(e.message);
}

Example: Using Events and Requesting the Token

try {
  const cardApplePay: ICardApplePay = await initApplePayButton(kushkiInstance, options);

  cardApplePay.onCancel(() => {
    console.log("Payment canceled");
  });

  cardApplePay.onClick(async () => {
    try {
      const token = await cardApplePay.requestApplePayToken({
        displayName: "DEMO",
        countryCode: "EC",
        currencyCode: "USD",
        amount: 20
      });

      console.log(token);
    } catch (error) {
      console.log("Error requesting token: ", error);
    }
  });
} catch (e: any) {
  console.error(e.message);
}