{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-guides/sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":["sub-heading","admonition","br","details"]},"type":"markdown"},"seo":{"title":"Non-3DS payments","description":"Transform your commerce with PXP's unified platform—seamless payments, real-time insights, and global growth in one powerful integration.","lang":"en-UK","siteUrl":"https://developer.pxp.io","llmstxt":{"hide":false,"sections":[{"title":"Table of contents","includeFiles":["**/*"],"excludeFiles":[]}],"excludeFiles":[]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"non-3ds-payments","__idx":0},"children":["Non-3DS payments"]},{"$$mdtype":"Tag","name":"SubHeading","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Process Google Pay transactions without 3D Secure authentication for faster, streamlined checkout."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"overview","__idx":1},"children":["Overview"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["By implementing a non-3DS Google Pay payment flow, you benefit from:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Faster checkout:"]}," Streamlined payment process with fewer steps and no authentication redirects."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Better conversion:"]}," Reduced friction leads to higher completion rates."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Simplified integration:"]}," Fewer callbacks and less complex implementation."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Lower latency:"]}," Direct payment processing without authentication steps."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Native security:"]}," Benefits from Google Pay's tokenisation and biometric authentication."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["However, non-3DS payments may not qualify for liability shift protection and are best suited for low-risk transactions, trusted customers, or regions where Strong Customer Authentication (SCA) isn't mandated."]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Google Pay provides inherent security through device-based authentication (fingerprint, face recognition, or PIN) and payment tokenisation, making non-3DS flows suitable for many transaction types."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"payment-flow","__idx":2},"children":["Payment flow"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The non-3DS Google Pay payment flow consists of five streamlined steps:"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-1-button-interaction","__idx":3},"children":["Step 1: Button interaction"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The customer clicks the Google Pay button, triggering the payment sheet to open. Google Pay handles device authentication (biometric or PIN) internally."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-2-payment-method-selection","__idx":4},"children":["Step 2: Payment method selection"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Within the Google Pay payment sheet, the customer selects their preferred payment method. Google Pay tokenises the payment data using its secure tokenisation system."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-3-payment-sheet-completion","__idx":5},"children":["Step 3: Payment sheet completion"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The customer confirms the payment in the Google Pay sheet. The SDK receives the encrypted payment token from Google Pay."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-4-evaluation","__idx":6},"children":["Step 4: Evaluation"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The SDK evaluates whether 3DS authentication is required. In non-3DS flows, authentication is skipped based on:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Configuration not requiring 3DS (no ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onPreInitiateAuthentication"]}," callback provided)."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Transaction falling below risk thresholds."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Regulatory exemptions being applicable."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Merchant risk assessment."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Since 3DS isn't required, the flow proceeds directly to authorisation."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-5-authorisation","__idx":7},"children":["Step 5: Authorisation"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The SDK sends the authorisation request with the Google Pay token directly to the payment gateway without 3DS authentication data."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"associated-callbacks","__idx":8},"children":["Associated callbacks"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onPreAuthorisation"]},":"]}," Provides transaction data for final review before authorisation. This is your last opportunity to add additional data or cancel the transaction."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onPostAuthorisation"]},":"]}," Receives the final transaction result. The transaction is either authorised or declined."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"implementation","__idx":9},"children":["Implementation"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"before-you-start","__idx":10},"children":["Before you start"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["To use non-3DS Google Pay payments:"]},{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Ensure your merchant account supports non-3DS transactions."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Configure Google Pay in the Unity Portal with your gateway merchant ID."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Whitelist your domain in the Unity Portal."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Consider implementing additional fraud prevention measures."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-1-initialise-the-sdk","__idx":11},"children":["Step 1: Initialise the SDK"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Initialise the PXP SDK with your merchant credentials."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"import { PxpCheckout } from '@pxpio/web-components-sdk';\n\nconst pxpSdk = PxpCheckout.initialize({\n environment: 'test', // or 'live' for production\n session: sessionData, // Get from your backend\n ownerId: 'your-owner-id',\n ownerType: 'MerchantGroup',\n kountDisabled: false, // OPTIONAL: Set to true to disable Kount fraud detection\n transactionData: {\n currency: 'GBP',\n amount: 25.00,\n merchantTransactionId: crypto.randomUUID(),\n merchantTransactionDate: () => new Date().toISOString(),\n entryType: 'Ecom',\n intent: {\n card: 'Authorisation'\n }\n }\n});\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-2-implement-callbacks","__idx":12},"children":["Step 2: Implement callbacks"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Configure the Google Pay button with the required callbacks for non-3DS payments."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"const googlePayButton = pxpSdk.create('google-pay-button', {\n paymentDataRequest: {\n allowedPaymentMethods: [{\n type: 'CARD',\n parameters: {\n allowedCardNetworks: ['VISA', 'MASTERCARD', 'AMEX'],\n allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'] // Both methods supported\n }\n // Note: tokenizationSpecification is automatically configured by the SDK from session data\n }],\n transactionInfo: {\n currencyCode: 'GBP',\n totalPriceStatus: 'FINAL',\n totalPrice: '49.99',\n displayItems: [\n {\n label: 'Subtotal',\n type: 'LINE_ITEM',\n price: '45.00'\n },\n {\n label: 'VAT',\n type: 'TAX',\n price: '4.99'\n }\n ]\n }\n },\n \n // REQUIRED: Final transaction review before authorisation\n onPreAuthorisation: async (data) => {\n console.log('Processing non-3DS Google Pay payment');\n console.log('Gateway Token ID:', data.gatewayTokenId);\n \n // Add risk screening data for fraud detection\n return {\n riskScreeningData: {\n performRiskScreening: true,\n excludeDeviceData: false,\n userIp: \"192.168.1.100\",\n account: {\n id: \"user_12345678\",\n creationDateTime: \"2024-01-15T10:30:00.000Z\"\n },\n items: [{\n price: 45.00,\n quantity: 1,\n category: \"General\"\n }],\n fulfillments: [{\n type: \"Shipped\",\n recipientPerson: {\n phoneNumber: \"+1234567890\"\n }\n }]\n }\n };\n },\n \n // REQUIRED: Handle the final result\n onPostAuthorisation: (result, paymentData) => {\n console.log('Payment result:', result);\n \n if (result && 'merchantTransactionId' in result) {\n // Success - MerchantSubmitResult\n console.log('Payment successful!');\n console.log('Transaction ID:', result.merchantTransactionId);\n console.log('System Transaction ID:', result.systemTransactionId);\n \n // Redirect to success page\n window.location.href = '/payment-success?txn=' + result.merchantTransactionId;\n } else if (result && 'errorCode' in result) {\n // Failure - FailedSubmitResult\n console.error('Payment declined:', result.errorReason);\n showError('Payment declined. Please try another payment method.');\n }\n },\n \n // OPTIONAL: Handle errors\n onError: (error) => {\n console.error('Payment error:', error);\n showError('An error occurred. Please try again.');\n },\n \n // OPTIONAL: Handle cancellation\n onCancel: () => {\n console.log('Payment cancelled by user');\n showMessage('Payment cancelled');\n }\n});\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-3-handle-common-scenarios","__idx":13},"children":["Step 3: Handle common scenarios"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"amount-based-risk-assessment","__idx":14},"children":["Amount-based risk assessment"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Apply different risk measures based on transaction amounts."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"const googlePayButton = pxpSdk.create('google-pay-button', {\n // ... basic configuration\n \n onPreAuthorisation: async (data) => {\n console.log('Gateway Token ID:', data.gatewayTokenId);\n \n // Get transaction amount from your application state\n const amount = getTransactionAmount();\n \n // Different handling based on amount\n if (amount < 30) {\n // Low-value transaction - minimal checks\n return {\n riskScreeningData: {\n performRiskScreening: false,\n excludeDeviceData: true,\n userIp: \"192.168.1.100\",\n account: {\n id: \"user_12345678\",\n creationDateTime: \"2024-01-15T10:30:00.000Z\"\n }\n }\n };\n } else if (amount < 100) {\n // Medium-value transaction - standard checks\n return {\n riskScreeningData: {\n performRiskScreening: true,\n excludeDeviceData: false,\n userIp: \"192.168.1.100\",\n account: {\n id: \"user_12345678\",\n creationDateTime: \"2024-01-15T10:30:00.000Z\"\n },\n fulfillments: [{\n type: \"Shipped\",\n recipientPerson: {\n phoneNumber: \"+1234567890\"\n }\n }]\n }\n };\n } else {\n // High-value transaction - enhanced checks\n return {\n riskScreeningData: {\n performRiskScreening: true,\n excludeDeviceData: false,\n userIp: \"192.168.1.100\",\n account: {\n id: \"user_12345678\",\n creationDateTime: \"2024-01-15T10:30:00.000Z\"\n },\n items: [{\n price: amount,\n quantity: 1,\n category: 'high-value'\n }],\n fulfillments: [{\n type: \"Shipped\",\n shipping: {\n shippingMethod: \"Express\"\n },\n recipientPerson: {\n phoneNumber: \"+1234567890\",\n email: \"customer@example.com\"\n }\n }]\n }\n };\n }\n }\n});\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"customer-type-handling","__idx":15},"children":["Customer type handling"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Handle different customer types with varying risk profiles."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"function getCustomerRiskProfile(customerId) {\n const customer = getCustomerDetails(customerId);\n \n if (!customer.previousOrders) {\n return { level: 'high', verification: 'enhanced', reason: 'new-customer' };\n }\n \n if (customer.previousOrders > 10 && customer.chargebacks === 0) {\n return { level: 'low', verification: 'minimal', reason: 'trusted-customer' };\n }\n \n return { level: 'medium', verification: 'standard', reason: 'returning-customer' };\n}\n\nconst googlePayButton = pxpSdk.create('google-pay-button', {\n // ... basic configuration\n \n onPreAuthorisation: async (data) => {\n const customerId = getCurrentCustomerId();\n const riskProfile = getCustomerRiskProfile(customerId);\n \n console.log('Customer risk profile:', riskProfile);\n \n return {\n riskScreeningData: {\n performRiskScreening: riskProfile.level !== 'low',\n excludeDeviceData: false,\n userIp: \"192.168.1.100\",\n account: {\n id: \"user_12345678\",\n creationDateTime: \"2024-01-15T10:30:00.000Z\"\n },\n fulfillments: [{\n type: \"Shipped\",\n recipientPerson: {\n phoneNumber: \"+1234567890\"\n }\n }],\n transaction: {\n subtotal: amount\n }\n }\n };\n }\n});\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"geographic-risk-assessment","__idx":16},"children":["Geographic risk assessment"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Apply different rules based on customer location."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"const googlePayButton = pxpSdk.create('google-pay-button', {\n // ... basic configuration\n \n onPreAuthorisation: async (data) => {\n console.log('Gateway Token ID:', data.gatewayTokenId);\n \n const ipAddress = await getCustomerIPAddress();\n const geolocation = await getIPGeolocation(ipAddress);\n \n // Check if customer is in high-risk region\n const highRiskCountries = ['XX', 'YY', 'ZZ'];\n const isHighRisk = highRiskCountries.includes(geolocation.countryCode);\n \n return {\n riskScreeningData: {\n performRiskScreening: true,\n excludeDeviceData: false,\n userIp: \"192.168.1.100\",\n account: {\n id: \"user_12345678\",\n creationDateTime: \"2024-01-15T10:30:00.000Z\"\n },\n fulfillments: [{\n type: \"Shipped\",\n recipientPerson: {\n phoneNumber: \"+1234567890\"\n }\n }]\n }\n };\n }\n});\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-4-handle-errors","__idx":17},"children":["Step 4: Handle errors"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Implement comprehensive error handling for non-3DS payments."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"const googlePayButton = pxpSdk.create('google-pay-button', {\n // ... basic configuration\n \n onPostAuthorisation: (result, paymentData) => {\n if (result && 'merchantTransactionId' in result) {\n // Payment successful - MerchantSubmitResult\n handlePaymentSuccess(result, paymentData);\n } else if (result && 'errorCode' in result) {\n // Payment declined or failed - FailedSubmitResult\n handlePaymentFailure(result);\n }\n },\n \n onError: (error) => {\n console.error('Payment error:', error);\n \n // Handle specific error types\n if (error.code === 'BUYER_ACCOUNT_ERROR') {\n showError('There was an issue with your Google Pay account. Please try another payment method.');\n } else if (error.code === 'MERCHANT_CONFIGURATION_ERROR') {\n showError('Payment system configuration error. Please contact support.');\n logError('Google Pay merchant configuration error', error);\n } else if (error.code === 'NETWORK_ERROR') {\n showError('Connection failed. Please check your internet and try again.');\n } else {\n showError('Payment failed. Please try again or use a different payment method.');\n }\n },\n \n onCancel: () => {\n console.log('Payment cancelled by user');\n // Customer closed Google Pay sheet\n showMessage('Payment cancelled. Your order is still in your basket.');\n }\n});\n\nfunction handlePaymentSuccess(result, paymentData) {\n console.log('✅ Payment successful');\n console.log('Transaction ID:', result.merchantTransactionId);\n console.log('System Transaction ID:', result.systemTransactionId);\n \n // Store transaction details\n storeTransactionRecord({\n transactionId: result.merchantTransactionId,\n systemTransactionId: result.systemTransactionId,\n processingType: 'non-3ds',\n paymentMethod: 'google-pay',\n timestamp: new Date().toISOString()\n });\n \n // Redirect to success page\n window.location.href = '/payment-success?txn=' + result.merchantTransactionId;\n}\n\nfunction handlePaymentFailure(result) {\n console.error('❌ Payment failed');\n console.error('Error code:', result.errorCode);\n console.error('Error reason:', result.errorReason);\n console.error('Correlation ID:', result.correlationId);\n \n // Map error codes to user-friendly messages\n const errorMessages = {\n 'INSUFFICIENT_FUNDS': 'Insufficient funds. Please try a different payment method.',\n 'CARD_DECLINED': 'Payment declined by your bank. Please try another card.',\n 'EXPIRED_CARD': 'This card has expired. Please use a different payment method.',\n 'INVALID_CARD': 'Invalid card details. Please try another payment method.',\n 'FRAUD_DETECTED': 'Payment could not be processed. Please contact your bank.',\n 'PROCESSING_ERROR': 'Payment processing error. Please try again.',\n 'LIMIT_EXCEEDED': 'Transaction exceeds your card limit. Try a smaller amount.',\n 'DO_NOT_HONOR': 'Payment declined by your bank. Please try a different payment method.'\n };\n \n const userMessage = errorMessages[result.errorCode] || \n 'Payment could not be completed. Please try a different payment method.';\n \n showError(userMessage);\n \n // Log for analysis\n logPaymentDecline({\n errorCode: result.errorCode,\n errorReason: result.errorReason,\n correlationId: result.correlationId,\n httpStatusCode: result.httpStatusCode,\n timestamp: new Date().toISOString()\n });\n \n // Offer alternative payment methods\n showAlternativePaymentOptions();\n}\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"step-5-mount-the-button","__idx":18},"children":["Step 5: Mount the button"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Mount the Google Pay button to your page."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"googlePayButton.mount('google-pay-container');\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"example","__idx":19},"children":["Example"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The following example shows a complete non-3DS Google Pay implementation."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"import { useEffect, useState } from 'react';\n\nfunction GooglePayCheckout() {\n const [googlePayButton, setGooglePayButton] = useState(null);\n const [isProcessing, setIsProcessing] = useState(false);\n const [error, setError] = useState(null);\n \n useEffect(() => {\n // Initialise SDK\n const pxpSdk = PxpCheckout.initialize({\n environment: 'test',\n session: sessionData, // Get from your backend\n ownerId: 'your-owner-id',\n ownerType: 'MerchantGroup',\n kountDisabled: false, // OPTIONAL: Set to true to disable Kount fraud detection\n transactionData: {\n currency: 'GBP',\n amount: 25.00,\n merchantTransactionId: crypto.randomUUID(),\n merchantTransactionDate: () => new Date().toISOString(),\n entryType: 'Ecom',\n intent: {\n card: 'Authorisation'\n }\n }\n });\n \n // Create Google Pay button (non-3DS)\n const button = pxpSdk.create('google-pay-button', {\n paymentDataRequest: {\n allowedPaymentMethods: [{\n type: 'CARD',\n parameters: {\n allowedCardNetworks: ['VISA', 'MASTERCARD', 'AMEX'],\n allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS']\n }\n // Note: tokenizationSpecification is automatically configured by the SDK from session data\n }],\n transactionInfo: {\n currencyCode: 'GBP',\n countryCode: 'GB',\n totalPriceStatus: 'FINAL',\n totalPrice: '49.99',\n totalPriceLabel: 'Total',\n displayItems: [\n {\n label: 'Premium Headphones',\n type: 'LINE_ITEM',\n price: '45.00',\n status: 'FINAL'\n },\n {\n label: 'VAT (20%)',\n type: 'TAX',\n price: '4.99',\n status: 'FINAL'\n }\n ]\n }\n },\n \n // Handle button click\n onGooglePaymentButtonClicked: () => {\n console.log('Google Pay button clicked');\n setIsProcessing(true);\n setError(null);\n },\n \n // Pre-authorisation - add risk data\n onPreAuthorisation: async (data) => {\n console.log('🔐 Processing non-3DS payment');\n console.log('Gateway Token ID:', data.gatewayTokenId);\n \n // Assess risk\n const customerId = getCurrentCustomerId();\n const riskProfile = await assessCustomerRisk(customerId);\n \n return {\n riskScreeningData: {\n performRiskScreening: true,\n excludeDeviceData: false,\n userIp: \"192.168.1.100\",\n account: {\n id: customerId,\n creationDateTime: \"2024-01-15T10:30:00.000Z\"\n },\n fulfillments: [{\n type: \"Shipped\",\n recipientPerson: {\n phoneNumber: \"+1234567890\"\n }\n }]\n }\n };\n },\n \n // Post-authorisation - handle result\n onPostAuthorisation: (result, paymentData) => {\n console.log('📊 Payment result received');\n setIsProcessing(false);\n \n if (result && 'merchantTransactionId' in result) {\n // Success - MerchantSubmitResult\n console.log('✅ Payment authorised');\n \n // Track successful payment\n trackPaymentSuccess({\n transactionId: result.merchantTransactionId,\n systemTransactionId: result.systemTransactionId,\n paymentMethod: 'google-pay'\n });\n \n // Redirect to success page\n window.location.href = '/order-confirmation?txn=' + result.merchantTransactionId;\n } else if (result && 'errorCode' in result) {\n // Failure - FailedSubmitResult\n console.error('❌ Payment declined:', result.errorReason);\n setError('Payment declined. Please try another payment method.');\n \n // Track decline\n trackPaymentDecline({\n errorCode: result.errorCode,\n errorReason: result.errorReason,\n correlationId: result.correlationId\n });\n }\n },\n \n // Error handling\n onError: (error) => {\n console.error('❌ Payment error:', error);\n setIsProcessing(false);\n setError('An error occurred. Please try again.');\n \n // Track error\n trackPaymentError({\n errorCode: error.code,\n errorMessage: error.message\n });\n },\n \n // Cancellation handling\n onCancel: () => {\n console.log('Payment cancelled by user');\n setIsProcessing(false);\n setError(null);\n \n // Track cancellation\n trackPaymentCancellation();\n }\n });\n \n // Mount button\n button.mount('google-pay-button-container');\n setGooglePayButton(button);\n \n // Cleanup\n return () => {\n if (button) {\n button.unmount();\n }\n };\n }, []);\n \n return (\n
\n
\n

Order summary

\n
\n
\n Premium Headphones\n £45.00\n
\n
\n VAT (20%)\n £4.99\n
\n
\n Total\n £49.99\n
\n
\n
\n \n
\n

Pay with Google Pay

\n \n {error && (\n
\n {error}\n
\n )}\n \n
\n \n {isProcessing && (\n
\n Processing payment...\n
\n )}\n \n
\n

✓ Fast and secure checkout with Google Pay

\n

✓ No need to enter card details

\n

✓ Protected by Google Pay's security

\n
\n
\n
\n );\n}\n\n// Helper functions\nfunction getCurrentCustomerId() {\n return localStorage.getItem('customerId') || 'guest';\n}\n\nasync function assessCustomerRisk(customerId) {\n // Implement your risk assessment logic\n const orderHistory = await getCustomerOrderHistory(customerId);\n \n if (orderHistory.totalOrders > 10 && orderHistory.chargebacks === 0) {\n return 'low';\n } else if (orderHistory.totalOrders === 0) {\n return 'high';\n }\n \n return 'medium';\n}\n\nfunction trackPaymentSuccess(data) {\n console.log('Tracking payment success:', data);\n // Implement your analytics tracking\n}\n\nfunction trackPaymentDecline(data) {\n console.log('Tracking payment decline:', data);\n // Implement your analytics tracking\n}\n\nfunction trackPaymentError(data) {\n console.log('Tracking payment error:', data);\n // Implement your analytics tracking\n}\n\nfunction trackPaymentCancellation() {\n console.log('Tracking payment cancellation');\n // Implement your analytics tracking\n}\n\nexport default GooglePayCheckout;\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"callback-data","__idx":20},"children":["Callback data"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["This section describes the data received by the different callbacks as part of the non-3DS Google Pay flow."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"onpreauthorisation","__idx":21},"children":["onPreAuthorisation"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onPreAuthorisation"]}," callback receives only the gateway token ID. Use this ID to retrieve token details and make authorisation decisions on your backend."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"event-data","__idx":22},"children":["Event data"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Parameter"},"children":["Parameter"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Description"},"children":["Description"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["data"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["object"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Object containing token information."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["data.gatewayTokenId"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["The token ID from the payment gateway. Use this ID to retrieve full token details from the Unity backend and update transaction decision."]}]}]}]}]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Use the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["gatewayTokenId"]}," with the ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/apis/token-vault/other/get-masked-card-related-to-gateway-token"},"children":["Get masked card data related to gateway token"]}," API to retrieve full token details including card scheme, funding source (credit/debit), masked PAN, and expiry date."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"example-implementation","__idx":23},"children":["Example implementation"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"onPreAuthorisation: async (data) => {\n console.log('Non-3DS Google Pay authorisation for token:', data.gatewayTokenId);\n \n // Retrieve token details and make authorisation decision\n const transactionDecision = await getAuthorisationDecision(data.gatewayTokenId);\n \n if (!transactionDecision) {\n // Not proceeding with authorisation\n console.log('Not proceeding with authorisation');\n return null;\n }\n \n // Add risk screening data\n return {\n riskScreeningData: {\n performRiskScreening: true,\n excludeDeviceData: false,\n userIp: \"192.168.1.100\",\n account: {\n id: \"user_12345678\",\n creationDateTime: \"2024-01-15T10:30:00.000Z\"\n },\n items: [{\n price: 45.00,\n quantity: 1,\n category: \"General\"\n }],\n fulfillments: [{\n type: \"Shipped\",\n shipping: {\n shippingMethod: \"Standard\"\n },\n recipientPerson: {\n phoneNumber: \"+1234567890\",\n email: \"customer@example.com\"\n }\n }]\n }\n };\n}\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"warning"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Important:"]}," 3DS external data should no longer be provided via the callback. For non-3DS flows, no 3DS data is applicable."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"onpostauthorisation","__idx":24},"children":["onPostAuthorisation"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onPostAuthorisation"]}," callback receives the authorisation result and the original payment data from Google Pay."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"event-data-1","__idx":25},"children":["Event data"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Parameter"},"children":["Parameter"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Description"},"children":["Description"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["result"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["MerchantSubmitResult or FailedSubmitResult"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Object containing the transaction result. Can be either a success result (",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["MerchantSubmitResult"]},") or failure result (",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["FailedSubmitResult"]},")."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["result.merchantTransactionId"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["(Success only) The merchant's unique identifier for the transaction."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["result.systemTransactionId"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["(Success only) The system's unique identifier for the transaction."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["result.errorCode"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["(Failure only) The error code indicating the type of failure."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["result.errorReason"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["(Failure only) The human-readable error message."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["result.correlationId"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["(Failure only) The correlation ID for tracking and debugging."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["result.httpStatusCode"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["number"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["(Failure only) The HTTP status code of the failure."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["paymentData"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["object"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["The original payment data from Google Pay, including payment method details and billing information."]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"example-implementation-1","__idx":26},"children":["Example implementation"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"onPostAuthorisation: (result, paymentData) => {\n console.log('Non-3DS Google Pay payment result');\n \n if (result && 'merchantTransactionId' in result) {\n // Success - MerchantSubmitResult\n console.log('✅ Payment successful!');\n console.log('Merchant Transaction ID:', result.merchantTransactionId);\n console.log('System Transaction ID:', result.systemTransactionId);\n \n // Store transaction details\n storeTransactionRecord({\n merchantTransactionId: result.merchantTransactionId,\n systemTransactionId: result.systemTransactionId,\n paymentMethod: 'google-pay',\n processingType: 'non-3ds',\n timestamp: new Date().toISOString()\n });\n \n // Redirect to success page\n window.location.href = `/payment-success?txn=${result.merchantTransactionId}`;\n \n } else if (result && 'errorCode' in result) {\n // Failure - FailedSubmitResult\n console.error('❌ Payment failed');\n console.error('Error code:', result.errorCode);\n console.error('Error reason:', result.errorReason);\n console.error('Correlation ID:', result.correlationId);\n \n // Handle specific error types\n handlePaymentFailure(result);\n }\n}\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"success-result-structure","__idx":27},"children":["Success result structure"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["When the payment is successful, you'll receive a ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["MerchantSubmitResult"]},":"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"{\n merchantTransactionId: \"order-123456\",\n systemTransactionId: \"sys-txn-789012\"\n}\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Parameter"},"children":["Parameter"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Description"},"children":["Description"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["merchantTransactionId"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["The merchant's unique identifier for the transaction that was provided during SDK initialisation."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["systemTransactionId"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["The system's unique identifier for the transaction. Use this with ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["merchantTransactionId"]}," to retrieve full authorisation details from the Unity backend."]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"failure-result-structure","__idx":28},"children":["Failure result structure"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["When the payment fails, you'll receive a ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["FailedSubmitResult"]},":"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"{\n errorCode: \"CARD_DECLINED\",\n errorReason: \"Payment declined by issuing bank\",\n correlationId: \"corr_abc123def456\",\n httpStatusCode: 402\n}\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Parameter"},"children":["Parameter"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Description"},"children":["Description"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["errorCode"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["The error code indicating the type of failure."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["errorReason"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["A human-readable description of the error."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["correlationId"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["A unique identifier for this transaction attempt. Use this for support inquiries and debugging."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["httpStatusCode"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["number"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["The HTTP status code associated with the failure."]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"onerror","__idx":29},"children":["onError"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onError"]}," callback is triggered when an error occurs during the Google Pay flow (before reaching authorisation)."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"event-data-2","__idx":30},"children":["Event data"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Parameter"},"children":["Parameter"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Description"},"children":["Description"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["error"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["object"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Object containing error information."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["error.code"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["The error code indicating the type of error."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["error.message"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["A human-readable description of the error."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["error.statusCode"]},{"$$mdtype":"Tag","name":"Break","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Details","attributes":{},"children":["string or undefined"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Google Pay API status code, if available."]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"example-implementation-2","__idx":31},"children":["Example implementation"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"onError: (error) => {\n console.error('Google Pay error:', error);\n \n // Re-enable payment form\n hideLoadingSpinner();\n enablePaymentOptions();\n}\n","lang":"typescript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"oncancel","__idx":32},"children":["onCancel"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onCancel"]}," callback is triggered when the customer closes the Google Pay payment sheet without completing the payment."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"event-data-3","__idx":33},"children":["Event data"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["This callback does not receive any parameters."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":4,"id":"example-implementation-3","__idx":34},"children":["Example implementation"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"onCancel: () => {\n console.log('Google Pay payment cancelled by user');\n \n // Track cancellation for analytics\n trackEvent('payment-cancelled', {\n paymentMethod: 'google-pay',\n timestamp: new Date().toISOString()\n });\n \n // Show message to user\n showMessage('Payment cancelled. Your order is still in your basket.');\n \n // Reset UI state\n hideLoadingSpinner();\n enablePaymentOptions();\n}\n","lang":"typescript"},"children":[]}]},"headings":[{"value":"Non-3DS payments","id":"non-3ds-payments","depth":1},{"value":"Overview","id":"overview","depth":2},{"value":"Payment flow","id":"payment-flow","depth":2},{"value":"Step 1: Button interaction","id":"step-1-button-interaction","depth":3},{"value":"Step 2: Payment method selection","id":"step-2-payment-method-selection","depth":3},{"value":"Step 3: Payment sheet completion","id":"step-3-payment-sheet-completion","depth":3},{"value":"Step 4: Evaluation","id":"step-4-evaluation","depth":3},{"value":"Step 5: Authorisation","id":"step-5-authorisation","depth":3},{"value":"Associated callbacks","id":"associated-callbacks","depth":4},{"value":"Implementation","id":"implementation","depth":2},{"value":"Before you start","id":"before-you-start","depth":3},{"value":"Step 1: Initialise the SDK","id":"step-1-initialise-the-sdk","depth":3},{"value":"Step 2: Implement callbacks","id":"step-2-implement-callbacks","depth":3},{"value":"Step 3: Handle common scenarios","id":"step-3-handle-common-scenarios","depth":3},{"value":"Amount-based risk assessment","id":"amount-based-risk-assessment","depth":4},{"value":"Customer type handling","id":"customer-type-handling","depth":4},{"value":"Geographic risk assessment","id":"geographic-risk-assessment","depth":4},{"value":"Step 4: Handle errors","id":"step-4-handle-errors","depth":3},{"value":"Step 5: Mount the button","id":"step-5-mount-the-button","depth":3},{"value":"Example","id":"example","depth":2},{"value":"Callback data","id":"callback-data","depth":2},{"value":"onPreAuthorisation","id":"onpreauthorisation","depth":3},{"value":"Event data","id":"event-data","depth":4},{"value":"Example implementation","id":"example-implementation","depth":4},{"value":"onPostAuthorisation","id":"onpostauthorisation","depth":3},{"value":"Event data","id":"event-data-1","depth":4},{"value":"Example implementation","id":"example-implementation-1","depth":4},{"value":"Success result structure","id":"success-result-structure","depth":4},{"value":"Failure result structure","id":"failure-result-structure","depth":4},{"value":"onError","id":"onerror","depth":3},{"value":"Event data","id":"event-data-2","depth":4},{"value":"Example implementation","id":"example-implementation-2","depth":4},{"value":"onCancel","id":"oncancel","depth":3},{"value":"Event data","id":"event-data-3","depth":4},{"value":"Example implementation","id":"example-implementation-3","depth":4}],"frontmatter":{"seo":{"title":"Non-3DS payments"}},"lastModified":"2026-06-12T11:56:36.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/guides/checkout/components/web/google-pay/non-3ds","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}