Introduction
Now, you can easily integrate Google Pay into your website or mobile application using PayTabs. This guide provides a comprehensive overview of the integration process, including supported authentication methods, integration models, and technical requirements.
PayTabs supports Google Pay transactions using both CRYPTOGRAM_3DS and PAN_ONLY authentication methods. The CRYPTOGRAM_3DS method utilizes tokenized card data accompanied by a secure cryptogram generated by Google Pay, ensuring enhanced authentication at both the device and network levels.
In contrast, the PAN_ONLY method uses the card’s Primary Account Number (FPAN). For these transactions, PayTabs automatically initiates a 3D Secure (3DS) authentication flow before proceeding with the payment authorization, adding an additional layer of security.
Google Pay provides a fast, secure, and seamless checkout experience by allowing customers to complete payments using cards saved in their Google account.
By integrating Google Pay into your website or mobile application, you can:
- ✅ Reduce checkout friction and improve conversion rates
- ✅ Offer a trusted and familiar payment method
- ✅ Improve security via tokenization (no raw card data exposure)
- ✅ Support faster, one-click payments across devices
Google Pay uses tokenization, meaning the customer's card details are never shared directly with your system but replaced with a secure payment token.
Supported Configuration
The following table outlines the supported configuration parameters required for integrating Google Pay with PayTabs. These values must be correctly defined when setting up your payment request to ensure compatibility and successful transaction processing.
| Parameter | Value |
|---|---|
| Gateway | paytabs |
| Protocol Version | ECv2 |
| Tokenization Type | PAYMENT_GATEWAY |
| Allowed Auth Methods | CRYPTOGRAM_3DS, PAN_ONLY |
| Allowed Card Networks | VISA, MASTERCARD, AMEX |
Integration Options
Google Pay can be integrated with PayTabs using multiple methods depending on your platform and business requirements.
| Integration Type | Description |
|---|---|
| Web | Integrate Google Pay directly into your website |
| Android | Integrate Google Pay into Android applications |
| Hosted Payment Page | Google Pay appears automatically on PayTabs Hosted Payment Pages |
Web Integration
To integrate Google Pay into your website, follow the official Google Pay Web documentation.
Official Resources
- Google Pay Web Developer Documentation
- Google Pay Web Integration Checklist
- Google Pay Web Brand Guidelines
PayTabs Gateway Configuration
When configuring Google Pay for PayTabs, use the following tokenization settings:
const tokenizationSpecification = {
type: "PAYMENT_GATEWAY",
parameters: {
gateway: "paytabs",
gatewayMerchantId: "your_paytabs_profile_id",
},
};
| Parameter | Description |
|---|---|
| gateway | Always set to paytabs |
| gatewayMerchantId | Your PayTabs Profile ID |
Merchants can find their PayTabs Profile ID from the PayTabs dashboard under the Profile section.
Allowed Payment Methods
Configure the allowed card networks and authentication methods:
- Supported Card Networks:
- VISA
- MASTERCARD
- AMEX
- Supported Authentication Methods:
- CRYPTOGRAM_3DS
- PAN_ONLY
- Example Configuration:
{
const allowedCardNetworks = ['VISA', 'MASTERCARD', 'AMEX'];
const allowedCardAuthMethods = ['CRYPTOGRAM_3DS', 'PAN_ONLY'];
const baseCardPaymentMethod = {
type: 'CARD',
parameters:
{
allowedAuthMethods: allowedCardAuthMethods,
allowedCardNetworks: allowedCardNetworks
}
}
Billing Address
A billing address is not required for Google Pay transactions processed through PayTabs.
Hosted Payment Page Integration
When using the PayTabs Hosted Payment Page (HPP), Google Pay will be automatically available once it is enabled on your merchant account. No additional implementation or configuration steps are required from your side.
iFrame Support
If you are embedding the Hosted Payment Page within an iframe, you must include the appropriate permissions to allow Google Pay functionality.
The allow="payment" attribute is required to enable Google Pay when the payment page
is rendered inside an iframe.
<iframe src="https://secure.paytabs.com/payment/page/{session_id}"
allow="payment"
title="Checkout"
width="100%"
height="600";
</iframe>;
When using Google Pay through the PayTabs Hosted Payment Page, merchants must comply with Google Pay policies, including the Google Pay API Acceptable Use Policy and accept the Google Pay API Terms of Service .
Sending Payment Data to PayTabs
After the customer authorizes the payment through Google Pay, an encrypted payment token is returned within the response object.
You must send the complete Google Pay response object to PayTabs as part of your payment request to ensure proper transaction processing.
Example Payload
{
"apiVersion": 2,
"apiVersionMinor": 0,
"paymentMethodData": {
"description": "Visa ••••1234",
"info": {
"assuranceDetails": {
"accountVerified": true,
"cardHolderAuthenticated": true
},
"cardDetails": "1234",
"cardNetwork": "VISA"
},
"tokenizationData": {
"token": "{encrypted_token}",
"type": "PAYMENT_GATEWAY"
},
"type": "CARD"
}
Important: Always forward the complete Google Pay payload exactly as received. Do not modify or alter the tokenization data, as this may result in transaction failures.
Testing
During Testing, make sure to use the Google Pay TEST environment. You can use the available test cards provided in the Google Pay Test Card Suite to simulate transactions.