Google Pay
Google Pay is a trademark of Google LLC.
In the React Native SDK, Google Pay can be used to process payments with a smooth and native experience on Android devices. The SDK exposes a fully native Google Pay flow — including device-readiness checks, payment-sheet presentation, and receipt generation — without requiring you to integrate the Google Pay Android SDK directly into your app.
Google Pay is only available on Android devices. Calling Google Pay APIs on iOS will reject the returned promise with an error.
Overview
MoneyHash's Google Pay integration in the React Native SDK enables you to:
- Accept payments using customers' saved cards in Google Pay
- Provide a seamless, native payment experience through the MoneyHash SDK
- Use either a one-call full flow (
proceedWithGooglePay) or a two-step flow (generateGooglePayReceipt+submitPaymentReceipt)
Prerequisites
Before implementing Google Pay, make sure you have:
- A MoneyHash account with Google Pay enabled
- Your MoneyHash Account ID (used as
gatewayMerchantId) - A registered Google Pay merchant ID
- Google Pay configured under your MoneyHash Dashboard
1. (Optional) Configure Google Pay
You can configure the SDK with a GooglePayNativeConfig to control the Google Pay environment (TEST or PRODUCTION) and to request additional billing data (e.g., email) during the Google Pay flow.
There are two ways to provide the config:
Option A: Configure via the SDK Builder
TypeScript
import {
MoneyHashSDKBuilder,
GooglePayEnvironment,
CollectibleBillingData,
type GooglePayNativeConfig,
} from '@moneyhash/reactnative-sdk';
const googlePayConfig: GooglePayNativeConfig = {
environment: GooglePayEnvironment.TEST, // Use PRODUCTION for live transactions
collectibleBillingData: [CollectibleBillingData.EMAIL], // Optional
};
const moneyHashSDK = new MoneyHashSDKBuilder()
.setNativeGooglePayConfig(googlePayConfig)
.build();
Option B: Configure on an Existing SDK Instance
TypeScript
await moneyHashSDK.setNativeGooglePayConfig({
environment: GooglePayEnvironment.TEST,
collectibleBillingData: [CollectibleBillingData.EMAIL], // Currently, only "email" is supported
});
environmentis required and must be eitherGooglePayEnvironment.TESTorGooglePayEnvironment.PRODUCTION.collectibleBillingDatais optional. Pass an empty array ([]) — or omit the field — to disable additional billing data collection. Currently, onlyemailis supported.
The Google Pay configuration is only applied on Android. On iOS the call will reject with an error.
2. Check Device Compatibility
Before showing the Google Pay button or kicking off the flow, verify that the device supports Google Pay:
TypeScript
const isReady = await moneyHashSDK.isGooglePayReady();
if (isReady) {
// Proceed with Google Pay
} else {
console.log("This device does not support Google Pay");
}
You can also check readiness against specific card networks and auth methods that you intend to support:
TypeScript
const isReady = await moneyHashSDK.isGooglePayReady({
allowedCardNetworks: ['VISA', 'MASTERCARD'],
allowedCardAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
});
Only supported on Android. Calling this on other platforms will reject the promise with an error.
3. Get Available Methods & Find Google Pay Configuration
Retrieve the available payment methods from MoneyHash. The Google Pay configuration is returned inside the expressMethods list as nativePayData of type GooglePayData.
TypeScript
import { GooglePayData } from '@moneyhash/reactnative-sdk';
const methods = await moneyHashSDK.getMethods({
amount: 10,
currency: 'USD',
customer: '<customer_id>',
});
const googlePayMethod = methods.expressMethods?.find(
(em) => em.nativePayData && em.nativePayData.type === 'google_pay'
);
if (!googlePayMethod) {
throw new Error('Google Pay method not available');
}
const googlePayData = googlePayMethod.nativePayData as GooglePayData;
Google Pay Payment Flow
The React Native SDK supports two ways of completing a Google Pay payment:
- One-call flow —
proceedWithGooglePaylaunches the Google Pay sheet, collects the token, and submits it to MoneyHash in a single call. - Two-step flow —
generateGooglePayReceiptproduces a receipt, thensubmitPaymentReceiptfinalizes the payment using yourintentId.
Use the two-step flow when you need full control (e.g., direct tokenization, deferred submission, or custom flows). Use the one-call flow for the simplest integration.
Option 1: One-Call Flow with proceedWithGooglePay
proceedWithGooglePayUse this when you already have an intentId and want the SDK to handle everything end-to-end:
TypeScript
try {
const intentDetails = await moneyHashSDK.proceedWithGooglePay({
intentId: '<intent_id>',
currency: googlePayData.currencyCode!,
amount: googlePayData.amount!,
countryCode: googlePayData.countryCode!,
gateway: googlePayData.gateway!,
gatewayMerchantId: googlePayData.gatewayMerchantId!,
merchantId: googlePayData.merchantId!,
merchantName: googlePayData.merchantName!,
allowedCardNetworks: googlePayData.allowedCardNetworks, // Optional
allowedCardAuthMethods: googlePayData.allowedCardAuthMethods, // Optional
});
console.log('🎉 Payment completed successfully:', intentDetails);
} catch (error) {
console.error('❌ Google Pay payment failed:', error);
}
This single call will:
- Present the Google Pay sheet to the user.
- Collect the encrypted Google Pay token.
- Submit the token to MoneyHash for the given
intentId. - Resolve with the updated
IntentDetails.
Option 2: Two-Step Flow
Step 1: Generate the Google Pay Receipt
Generate a Google Pay receipt without immediately submitting it. This is useful for direct tokenization or deferred submission scenarios.
TypeScript
try {
const receipt = await moneyHashSDK.generateGooglePayReceipt({
currency: googlePayData.currencyCode!,
amount: googlePayData.amount!,
countryCode: googlePayData.countryCode!,
gateway: googlePayData.gateway!,
gatewayMerchantId: googlePayData.gatewayMerchantId!,
merchantId: googlePayData.merchantId!,
merchantName: googlePayData.merchantName!,
allowedCardNetworks: googlePayData.allowedCardNetworks, // Optional
allowedCardAuthMethods: googlePayData.allowedCardAuthMethods, // Optional
});
console.log('Google Pay Receipt generated:', receipt);
// Store the receipt to use later in step 2
} catch (error) {
console.error('Error generating Google Pay receipt:', error);
}
Step 2: Submit the Payment Receipt
Once you have the intentId (typically obtained from your backend), finalize the payment:
TypeScript
try {
const intentId = '<intent_id>';
// (Optional) Select Google Pay as the payment method on the intent first
await moneyHashSDK.proceedWithMethod(
intentId,
IntentType.Payment,
'GOOGLE_PAY',
MethodType.PaymentMethod,
);
const intentDetails = await moneyHashSDK.submitPaymentReceipt(
intentId,
receipt, // From Step 1
);
console.log('Payment completed successfully:', intentDetails);
} catch (error) {
console.error('Error submitting payment receipt:', error);
}
Complete Example
The following example shows a full Google Pay flow inside a React Native screen — initialization, compatibility check, fetching the configuration from MoneyHash, generating the receipt, and submitting it.
TypeScript
import {
MoneyHashSDKBuilder,
IntentType,
MethodType,
GooglePayEnvironment,
CollectibleBillingData,
GooglePayData,
type GooglePayNativeConfig,
} from '@moneyhash/reactnative-sdk';
// 1. Configure Google Pay
const googlePayConfig: GooglePayNativeConfig = {
environment: GooglePayEnvironment.TEST,
collectibleBillingData: [CollectibleBillingData.EMAIL],
};
const moneyHashSDK = new MoneyHashSDKBuilder()
.setNativeGooglePayConfig(googlePayConfig)
.build();
moneyHashSDK.setPublicKey('<YOUR_PUBLIC_KEY>');
async function payWithGooglePay(intentId: string) {
// 2. Check device compatibility
const isReady = await moneyHashSDK.isGooglePayReady();
if (!isReady) {
throw new Error('Device not compatible with Google Pay');
}
// 3. Fetch Google Pay configuration from MoneyHash
const methods = await moneyHashSDK.getMethods({
amount: 10,
currency: 'USD',
});
const googlePayMethod = methods.expressMethods?.find(
(em) => em.nativePayData && em.nativePayData.type === 'google_pay',
);
if (!googlePayMethod) {
throw new Error('Google Pay method not available');
}
const googlePayData = googlePayMethod.nativePayData as GooglePayData;
// 4. Generate the Google Pay receipt
const receipt = await moneyHashSDK.generateGooglePayReceipt({
currency: googlePayData.currencyCode!,
amount: googlePayData.amount!,
countryCode: googlePayData.countryCode!,
gateway: googlePayData.gateway!,
gatewayMerchantId: googlePayData.gatewayMerchantId!,
merchantId: googlePayData.merchantId!,
merchantName: googlePayData.merchantName!,
allowedCardNetworks: googlePayData.allowedCardNetworks,
allowedCardAuthMethods: googlePayData.allowedCardAuthMethods,
});
// 5. Select Google Pay as the payment method
await moneyHashSDK.proceedWithMethod(
intentId,
IntentType.Payment,
'GOOGLE_PAY',
MethodType.PaymentMethod,
);
// 6. Submit the receipt to complete the payment
const intentDetails = await moneyHashSDK.submitPaymentReceipt(
intentId,
receipt,
);
console.log('🎉 Payment completed:', intentDetails);
return intentDetails;
}
Supported Parameters
Card Networks (allowedCardNetworks)
allowedCardNetworks)AMEX— American ExpressDISCOVER— DiscoverINTERAC— InteracJCB— JCBMASTERCARD— MastercardVISA— Visa
Implementation Notes
- Tokenization parameters — These values (
gateway: 'moneyhash',gatewayMerchantId: <account_id>) are returned automatically by the MoneyHash SDK ingooglePayData. No manual setup is required. - Card networks — Configure the supported networks in the MoneyHash Dashboard. They are returned in
googlePayData.allowedCardNetworksand can be passed directly to the SDK. - Billing data — MoneyHash supports collecting the customer's email through
CollectibleBillingData.EMAIL. Additional billing details (such as address) should be collected by the merchant in their own checkout flow if needed. - Encrypted token — The Google Pay encrypted token is wrapped inside a
NativePayReceiptreturned bygenerateGooglePayReceipt(or handled implicitly byproceedWithGooglePay). It must be submitted viasubmitPaymentReceiptto complete the payment.
Testing
Test Environment
- Configure the SDK with
environment: GooglePayEnvironment.TEST. - Use Google's test cards in the device's Google Pay app.
- Make sure the example app is running on a real Android device or emulator with Google Pay installed.
Test Cards
Google Pay provides test cards for different scenarios. Refer to Google's testing documentation for the latest list. Common test PANs:
- Visa: 4111 1111 1111 1111
- Mastercard: 5555 5555 5555 4444
- American Express: 3782 8224 6310 005
Error Handling
Wrap your Google Pay calls in try/catch and surface errors to the user. Typical errors include:
- Device not compatible with Google Pay
- Google Pay sheet cancelled by the user
- Network or backend errors during receipt submission
TypeScript
try {
const intentDetails = await moneyHashSDK.proceedWithGooglePay({
intentId,
currency: googlePayData.currencyCode!,
amount: googlePayData.amount!,
countryCode: googlePayData.countryCode!,
gateway: googlePayData.gateway!,
gatewayMerchantId: googlePayData.gatewayMerchantId!,
merchantId: googlePayData.merchantId!,
merchantName: googlePayData.merchantName!,
});
// Handle success
} catch (error: any) {
// Handle:
// - Google Pay not available on the device
// - User cancelled the Google Pay sheet
// - Receipt submission failed
console.error('Google Pay error:', error);
}
Going Live
Before deploying to production:
- Switch
environmenttoGooglePayEnvironment.PRODUCTIONinGooglePayNativeConfig. - Update your Google Pay merchant ID and domain registration in the Google Pay & Wallet Console.
- Make sure your MoneyHash account is configured for production and that Google Pay is enabled with the correct provider in the dashboard.
- Test the complete flow end-to-end on a real device with a real card.
- Set up proper logging and monitoring for failed transactions.
API Reference
setNativeGooglePayConfig(config: GooglePayNativeConfig): Promise<void>
setNativeGooglePayConfig(config: GooglePayNativeConfig): Promise<void>Configures the Google Pay environment and the billing data to collect during the Google Pay flow. Available on Android only.
isGooglePayReady(params?): Promise<boolean>
isGooglePayReady(params?): Promise<boolean>Checks whether Google Pay is available on the current Android device. Optionally accepts allowedCardNetworks and allowedCardAuthMethods to scope the check to specific networks/auth methods.
getMethods(options): Promise<IntentMethods>
getMethods(options): Promise<IntentMethods>Retrieves the available payment methods. Google Pay configuration is returned inside expressMethods[i].nativePayData as a GooglePayData object when its type === 'google_pay'.
proceedWithGooglePay(params): Promise<IntentDetails>
proceedWithGooglePay(params): Promise<IntentDetails>End-to-end Google Pay flow: presents the Google Pay sheet, collects the token, and submits it to MoneyHash for the given intentId. Available on Android only.
generateGooglePayReceipt(params): Promise<NativePayReceipt>
generateGooglePayReceipt(params): Promise<NativePayReceipt>Generates a Google Pay receipt without submitting it to MoneyHash. Use this when you want to manage submission yourself or perform direct tokenization. Available on Android only.
submitPaymentReceipt(intentId, receipt): Promise<IntentDetails>
submitPaymentReceipt(intentId, receipt): Promise<IntentDetails>Submits a NativePayReceipt to MoneyHash to complete the payment for the given intentId.
GooglePayNativeConfig
GooglePayNativeConfiginterface GooglePayNativeConfig {
environment: GooglePayEnvironment; // TEST | PRODUCTION
collectibleBillingData?: CollectibleBillingData[]; // e.g. [CollectibleBillingData.EMAIL]
}
GooglePayData
GooglePayDataclass GooglePayData {
type: 'google_pay';
countryCode?: string;
merchantId?: string;
currencyCode?: string;
amount?: number;
merchantName?: string;
gateway?: string; // "moneyhash"
gatewayMerchantId?: string; // Your MoneyHash Account ID
allowedCardNetworks?: string[];
allowedCardAuthMethods?: string[];
}
NativePayReceipt
NativePayReceiptclass NativePayReceipt {
receipt?: string; // Encrypted Google Pay token
receiptBillingData?: Record<string, string>; // e.g. { email: "[email protected]" }
}
Support
For additional help with Google Pay integration:
- Check the MoneyHash documentation
- Review the Google Pay for Android documentation
- Contact MoneyHash support for account-specific issues
Updated about 1 hour ago