The ApplePaySession object manages the Apple Pay payment process
on the web. Create a new ApplePaySession each time a payer
explicitly requests a payment, such as inside an onclick event.
If you don't create an ApplePaySession each time, you get a
"Must create a new ApplePaySession from a user gesture
handler"
JavaScript exception. For more information about this error, visit Apple's
Creating an Apple Pay Session
page.
For each ApplePaySession, create an
ApplePayPaymentRequest
object, which includes information about payment processing capabilities, the
payment amount, and shipping information.
The response object of the PayPal JavaScript SDK API
paypal.Applepay().config() provides the following parameters in
the ApplePayPaymentRequest object:
countryCodemerchantCapabilitiessupportedNetworks
1
2const paymentRequest = {
3 countryCode: applepayConfig.countryCode,
4 merchantCapabilities: applepayConfig.merchantCapabilities,
5 supportedNetworks: applepayConfig.supportedNetworks,
6 currencyCode: "USD",
7 requiredShippingContactFields: ["name", "phone", "email", "postalAddress"],
8 requiredBillingContactFields: ["postalAddress"],
9 total: {
10 label: "Demo",
11 type: "final",
12 amount: "100.00",
13 },
14};
15
16const session = newApplePaySession(4, paymentRequest);
Include the new ApplePaySession inside a gesture handler, such as
an onclick event or an addEventListener click
handler.
Creating an ApplePaySession object throws a JavaScript exception
if any of the following occurs:
-
Any Apple Pay JavaScript API is called from an insecure page that doesn't
use
https.
-
An incorrect payment request is passed. Payment requests are incorrect if
they contain missing, unknown or invalid properties, or if the total amount
is negative.
onvalidatemerchant callback
Use paypal.Applepay().validateMerchant() in the
onvalidatemerchant callback to create a validated Apple Pay
session object:
1session.onvalidatemerchant=(event)=>{
2 applepay.validateMerchant({
3 validationUrl: event.validationURL,
4 displayName:"My Store"
5 })
6 .then(validateResult=>{
7 session.completeMerchantValidation(validateResult.merchantSession);
8 })
9 .catch(validateError=>{
10 console.error(validateError);
11 session.abort();
12 });
13};
onpaymentauthorized callback
Safari calls the onpaymentauthorized callback with an
event object. The event object passes a
token which you need to send to PayPal to confirm the order.
Capture the order using the
PayPal Orders V2 API. Use paypal.Applepay().confirmOrder() to send the
orderID, the Apple Pay token, billing contact details, and
confirm the order.
1session.onpaymentauthorized = (event) = >
2{
3 console.log('Your billing address is:', event.payment.billingContact);
4 console.log('Your shipping address is:', event.payment.shippingContact);
5
6
7
8
9 fetch(`/ api / orders`, {
10 method : 'post'
11 body :
12
13
14
15
16
17
18 })
19 .then(res = > res.json())
20 .then((createOrderData) = > {
21 var orderId = createOrderData.id;
22 applepay
23 .confirmOrder({
24 orderId : orderId,
25 token : event.payment.token,
26 billingContact : event.payment.billingContact
27 })
28 .then(confirmResult = > {
29 session.completePayment(ApplePaySession.STATUS_SUCCESS);
30
31
32 fetch(`/ api / orders / ${orderId} / capture`, {
33 method : "post",
34 })
35 .then(res = > res.json())
36 .then(captureResult = > { console.log(captureResult); })
37 .catch(captureError = > console.error(captureError));
38 })
39 .catch(confirmError = > {
40 if (confirmError) {
41 console.error('Error confirming order with applepay token');
42 console.error(confirmError);
43 session.completePayment(ApplePaySession.STATUS_FAILURE);
44 }
45 });
46 });
47};
