{"title":"Apple Pay Component integration","category":"default","creationDate":1776961628,"content":"

This page explains how to add Apple Pay to your existing Components integration.<\/p>\n

Requirements<\/h2>\n

Select which endpoint you are using:<\/p>\n\n

\n
\n \n <\/tabs>\n <\/div>\n<\/div>\n\n

API reference<\/h2>\n\n
\n
\n \n <\/tabs>\n <\/div>\n<\/div>\n\n

In case of errors, set your server up to handle Apple Pay errors<\/a>.<\/p>\n

Components configuration<\/h2>\n\n
\n
\n \n <\/tabs>\n <\/div>\n<\/div>\n\n\n\n\n\n\n\n
Property<\/th>\nDescription<\/th>\n<\/tr>\n<\/thead>\n
merchantID<\/code><\/td>\nYour Apple Pay merchant identifier<\/a>.<\/td>\n<\/tr>\n
merchantName<\/code><\/td>\nYour merchant name. This is used to generate \n PKPaymentSummaryItem<\/code>\n<\/a>.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
\n <\/code-sample>\n<\/div>\n

Create a configuration object for the Apple Pay Component and pass the configuration for Apple Pay to it.<\/p>\n

\n <\/code-sample>\n<\/div>\n

Optional configuration<\/h3>\n

You can include the following parameters in the configuration object:<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
Parameter<\/th>\nDescription<\/th>\n<\/tr>\n<\/thead>\n
allowOnboarding<\/code><\/td>\nSet to true<\/strong> to let the shopper add new cards to their Apple Pay wallet if there are none or if their cards are not supported for the payment.
By default this is set to false<\/strong>, and Apple Pay isn't shown as an available payment method if there are no cards in their Apple Pay wallet.<\/td>\n<\/tr>\n
\n applePaySummaryItems<\/code>\n<\/a><\/td>\nAn array of the items included in the purchase that summarize the payment amount. The last item must have the same value as the amount<\/code> you send in your \/payments<\/a> request.<\/td>\n<\/tr>\n
\n requiredBillingContactFields<\/code>\n<\/a><\/td>\nBilling information fields that you require from the shopper to process the transaction. Refer to Apple Pay documentation for sample values.<\/td>\n<\/tr>\n
\n billingContact<\/code>\n<\/a><\/td>\nA prefilled billing address.<\/td>\n<\/tr>\n
\n requiredShippingContactFields<\/code>\n<\/a><\/td>\nShipping information fields that you require from the shopper to fulfill the order. Refer to Apple Pay documentation for sample values.<\/td>\n<\/tr>\n
\n applePayShippingType<\/code>\n<\/a><\/td>\nThe type of shipping displayed, for example Pick Up<\/strong>, Ship To<\/strong>, or Deliver To<\/strong>. This is localized.
Default: PKShippingTypeShipping<\/strong> = .shipping<\/strong>.<\/td>\n<\/tr>\n
\n allowShippingContactEditing<\/code>\n<\/a><\/td>\nIndicates if the shopper can edit fields of the shipping address.<\/td>\n<\/tr>\n
\n shippingMethods<\/code>\n<\/a><\/td>\nList of available methods for shipping physical goods. Refer to Apple Pay documentation for sample values.<\/td>\n<\/tr>\n
\n applicationData<\/code>\n<\/a><\/td>\nA Base64-encoded string for application-specific data.<\/td>\n<\/tr>\n
\n supportedCountries<\/code>\n<\/a><\/td>\nSpecify the ISO 3166 country codes<\/a> if you only support payments from cards issued in specific countries.<\/td>\n<\/tr>\n
\n merchantCapability<\/code>\n<\/a><\/td>\nThe payment capabilities the merchant supports.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

You can refer to the ApplePayConfiguration<\/code> class in Github<\/a>.<\/p>\n\n

\n
\n \n <\/tabs>\n <\/div>\n<\/div>\n\n

Test and go live<\/h2>\n

Use Apple's test\u00a0card numbers\u00a0to\u00a0test your integration.<\/p>\n

For a full list of test cards and instructions how to add these to your test device, see Sandbox testing<\/a>\u00a0on\u00a0Apple's Developer website.<\/p>\n

<\/p>\n

Check the status of an Apple Pay test payment in your\u00a0Customer Area<\/a>\u00a0>\u00a0Transactions<\/strong>\u00a0> \u00a0Payments<\/strong>.<\/p>\n

Going live<\/h3>\n

To process live Apple Pay payments, your API credential needs to have the API Clientside Encryption Payments role<\/strong>. You can check this in your live Customer Area<\/a> or ask your Admin user to verify.<\/p>\n

<\/p>\n

Set up Apple Pay<\/a> on your Apple Pay Developer account for your live merchant identifier.<\/p>\n

See also<\/h2>\n