Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Introduction

Apple Pay on the Web enables customers with iOS devices or Macs to pay using payment methods stored in their wallet-app. Merchants need to display an Apple Pay button to eligible customers, who then get presented a payment sheet for easy review of the order and payment. Merchants can configure the look and feel of both buttons and payment sheet, but should adhere to the Apple guidelines.


Prerequisites

Onboarding

Apple Developer Account

Certificate Management

Apple Pay on Your Website

Code Block
languagejs
titleApple Pay Object
collapsetrue
{
   "token":{
      "paymentData":{
         "version":"EC_v1",
         "data":"3+f4oOTwPa6f1UZ6tG...CE=",
         "signature":"MIAGCSqGSIb3DQ...AAAA==",
         "header":{
            "ephemeralPublicKey":"MFkwEK...Md==",
            "publicKeyHash":"l0CnXdMv...D1I=",
            "transactionId":"32b...4f3"
         }
      },
      "paymentMethod":{
         "displayName":"Visa 1234",
         "network":"Visa",
         "type":"debit"
      },
      "transactionIdentifier":"32b...4f3"
   },
   "billingContact":{
      "addressLines":[
         "1 Street",
         ""
      ],
      "administrativeArea":"",
      "country":"United Kingdom",
      "countryCode":"GB",
      "familyName":"Appleseed",
      "givenName":"John",
      "locality":"London",
      "postalCode":"AB12 3CD",
      "subAdministrativeArea":"",
      "subLocality":""
   },
   "shippingContact":{
      "addressLines":[
         "1 Street",
         ""
      ],
      "administrativeArea":"",
      "country":"United Kingdom",
      "countryCode":"GB",
      "familyName":"Appleseed",
      "givenName":"John",
      "locality":"London",
      "postalCode":"AB12 3CD",
      "subAdministrativeArea":"",
      "subLocality":"",
      "phoneNumber":"01234 567890",
      "emailAddress":"john.appleseed@apple.com"
   }
}

API Requests

Overview of Special Parameters

A successful Apple Pay Session will return a payment object with all info on the session. Many contents of this object can be mapped to existing Server API parameters.

Section


Column


Code Block
languagejs
titleApple Pay Object
"billingContact":{
      "addressLines":[
         "1 Street",
         ""
      ],
      "administrativeArea":"",
      "country":"United Kingdom",
      "countryCode":"GB",
      "familyName":"Appleseed",
      "givenName":"John",
      "locality":"London",
      "postalCode":"AB12 3CD",
      "subAdministrativeArea":"",
      "subLocality":""
   },



Column

Awesome Icon
size36pt
iconfa-arrow-right


Column


Code Block
languagejs
titlePAYONE Server API
country=GB
lastname=Appleseed
firstname=John
street=1 Street
city=London
zip=AB12 3CD




UI Tabs


UI Tab
titleApple Pay Object


Code Block
"billingContact":{
      "addressLines":[
         "1 Street",
         ""
      ],
      "administrativeArea":"",
      "country":"United Kingdom",
      "countryCode":"GB",
      "familyName":"Appleseed",
      "givenName":"John",
      "locality":"London",
      "postalCode":"AB12 3CD",
      "subAdministrativeArea":"",
      "subLocality":""
   },



UI Tab
titleServer API Parameters


Code Block
country=GB
lastname=Appleseed
firstname=John
street=1 Street
city=London
zip=AB12 3CD




However, the actual payment part of the object is encrypted and has to be sent to the PAYONE API in special parameters.


API ParameterRequiredComments
clearingtype+


Section


Layout box
cssClasspayonePermittedSymbols
floatingleft

Fixed Value


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
wlt



wallettype+


Section


Layout box
cssClasspayonePermittedSymbols
floatingleft

Fixed Value


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
apl



cardtype+

Includepayoneparameter
Namecardtype

add_paydata[paymentdata_token_version]+


Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Sample


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
EC_v1



Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Format


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
String



add_paydata[paymentdata_token_data]+


Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Sample


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
rhHAQUrR118u[...]cwDw==



Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Format


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
String



add_paydata[paymentdata_token_signature]+


Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Sample


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
MIAGCSqGSIb3DQEHAqCAMIACAQE[...]AAAAAAAA==



Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Format


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
String



add_paydata[paymentdata_token_ephemeral_publickey]+


Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Sample


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
MFkwEwYHKoZIzj0[...]Y2A==



Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Format


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
String



add_paydata[paymentdata_token_publickey_hash]+


Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Sample


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
ilecVF58bpB8qio[...]l6eirw2Y1v1KUCsdVgQ=



Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Format


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
String



add_paydata[paymentdata_token_transaction_id]+


Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Sample


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
be2e745845b31dfac7778c6e29[...]b658cbcca971c0e0



Section


Layout box
cssClasspayonePermittedSymbols
floatingleft
Format


Layout box
cssClasspayonePermittedSymbolsValue
floatingleft
String







Table of Contents
outlinetrue
indent2em
absoluteUrltrue