diff --git a/src/content/docs/online-payments/apm/apple-pay.mdx b/src/content/docs/online-payments/apm/apple-pay.mdx index c9fffc5e..583106de 100644 --- a/src/content/docs/online-payments/apm/apple-pay.mdx +++ b/src/content/docs/online-payments/apm/apple-pay.mdx @@ -47,7 +47,7 @@ const applePaymentRequest = { ``` 3. Initiate an [Apple Pay session](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaysession/2320659-applepaysession) and call the [begin method](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaysession/1778001-begin) -4. Listen for the `onvalidatemerchant` callback and collect the `validateUrl` property. Create the following payload +4. Listen for the `onvalidatemerchant` callback and collect the validation URL from the event. Create the following payload and pass the validation URL you received from Apple as the `target` value: ```json { @@ -62,9 +62,9 @@ and initiate a merchant session by calling PUT https://api.sumup.com/v0.1/checkouts/${checkoutId}/apple-pay-session ``` -5. The response from the previous step is needed to complete the merchant validation with the [`completeMerchantValidation`](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaysession/1778015-completemerchantvalidation/) method +5. Use the response from the previous step to complete merchant validation with the [`completeMerchantValidation`](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaysession/1778015-completemerchantvalidation/) method. -6. Submitting the payment dialogue triggers the `onpaymentauthorized` callback, this is when you need to [process the checkout](https://developer.sumup.com/api/checkouts/process#process-a-checkout). The process checkout request body needs to include a `payment_type` of `apple_pay` and an `apple_pay` object, containing the response from step 7 +6. Submitting the payment sheet triggers the `onpaymentauthorized` callback. At that point, [process the checkout](https://developer.sumup.com/api/checkouts/process#process-a-checkout). The process-checkout request body needs to include a `payment_type` of `apple_pay` and an `apple_pay` object containing the Apple Pay payment token returned by the callback. ```json { diff --git a/src/content/docs/online-payments/apm/google-pay.mdx b/src/content/docs/online-payments/apm/google-pay.mdx index e786abfb..7f81b4a3 100644 --- a/src/content/docs/online-payments/apm/google-pay.mdx +++ b/src/content/docs/online-payments/apm/google-pay.mdx @@ -30,7 +30,7 @@ Considering you've adhered to the prerequisites, the following steps will enable - `gateway`- always equal to "sumup" - `gatewayMerchantId`- your SumUp merchant code - [`merchantInfo` object](https://developers.google.com/pay/api/web/reference/request-objects#MerchantInfo) with the following keys: - - `merchantId`- unique identifier provided to you by Google once you register your domain with them + - `merchantId`- unique identifier provided to you by Google once you register your domain with them. This is required for `PRODUCTION`. - `merchantName`- your merchant name ```js @@ -38,7 +38,7 @@ const baseRequest = { apiVersion: 2, apiVersionMinor: 0, merchantInfo: { - merchantId: '123456789123456789' + merchantId: '123456789123456789', merchantName: 'Example Merchant', }, allowedPaymentMethods: [ @@ -71,15 +71,23 @@ const paymentsClient = new google.payments.api.PaymentsClient({ 4. [Check readiness to pay](https://developers.google.com/pay/api/web/guides/tutorial#isreadytopay) with Google Pay API 5. [Launch the Google Pay button](https://developers.google.com/pay/api/web/guides/tutorial#add-button) -6. [Create a PaymentDataRequest](https://developers.google.com/pay/api/web/guides/tutorial#paymentdatarequest) using the `baseRequest` object and append the `transactionInfo` and `merchantInfo` objects. Your `PaymentDataRequest` should look like this: +6. [Create a PaymentDataRequest](https://developers.google.com/pay/api/web/guides/tutorial#paymentdatarequest) using the `baseRequest` object and append the top-level `transactionInfo` and `merchantInfo` objects. Your `PaymentDataRequest` should look like this: ```js const paymentDataRequest = { apiVersion: 2, apiVersionMinor: 0, merchantInfo: { + merchantId: '123456789123456789', merchantName: 'Example Merchant', }, + transactionInfo: { + totalPriceStatus: 'FINAL', + totalPriceLabel: 'Total', + totalPrice: `${checkoutInfo.amount}`, + currencyCode: checkoutInfo.currency || 'EUR', + countryCode: 'DE', + }, allowedPaymentMethods: [ { type: 'CARD', @@ -94,17 +102,6 @@ const paymentDataRequest = { gatewayMerchantId: 'exampleGatewayMerchantId', }, }, - merchantInfo: { - merchantId: 'your_merchant_id', - merchantName: 'your_merchant_name', - }, - transactionInfo: { - totalPriceStatus: 'FINAL', - totalPriceLabel: 'Total', - totalPrice: `${checkoutInfo.amount}`, - currencyCode: checkoutInfo.currency || 'EUR', - countryCode: 'DE', - }, }, ], }; @@ -155,7 +152,7 @@ This is not possible at the moment. You need to use a staging environment and va ### Error Decrypting Google Pay Token -Internal Server Error with a message pointing to Google Pay token decryption error is most likely caused by the wrong `environment` value in the `paymentsClient` object. Make sure it's set to `PRODUCTION` as below. +An Internal Server Error that points to Google Pay token decryption can be caused by an environment mismatch. Make sure the `PaymentsClient` `environment` matches the Google Pay configuration used to create the payment data: use `TEST` for test flows and `PRODUCTION` for live payments. ```js const paymentsClient = new google.payments.api.PaymentsClient({