Mine põhisisu juurde

Google Pay Integration Guide

Step-by-step instructions for integrating Google Pay into your e-commerce platform

Värskendatud üle 2 kuu tagasi

By integrating Google Pay, you enhance the checkout experience and support fast, convenient payments through Android devices and supported browsers.

Note: By enabling Google Pay, you agree to Google’s Terms of Service in the merchant portal provided by us.


Integration Options

We support Mastercard and Visa networks through two integration methods:

  • Hosted page solution – the easiest way to accept Google Pay. Best for merchants using our hosted payment page.

  • Web SDK – customizable integration for merchants using a custom checkout page.


Hosted Page Integration

Steps to accept Google Pay via the hosted payment page:

  1. Call the /oneoff API endpoint and redirect customers to the general payment_link (no need to specify the method_source).

  2. On Google Pay-compatible devices, the Google Pay button and payment sheet will appear automatically on the payment page.

  3. No additional configuration is needed. To enable Google Pay, contact your acquirer and follow the preparation steps below.

Preparations for Hosted Page

  1. In the merchant portal, go to E-shop Settings.

  2. Select your E-shop and scroll to the Google Pay section.

  3. Read and accept the Google Pay Terms and Conditions by checking the box and clicking Save.

  4. Once accepted, the section will display “Accepted” with the confirmation date and time.

  5. Leave the field Google Pay Merchant ID for Custom Domains empty.


Web SDK Integration

Use our Web SDK to add Google Pay to your custom checkout page.

Important: You must serve your website over HTTPS with a valid TLS certificate.

Preparations for Web SDK

  1. Register with Google and obtain a Google Merchant ID from the Google Pay and Wallet Console.

  2. In the merchant portal, go to E-shop Settings.

  3. Select your E-shop and scroll to the Google Pay section.

  4. Accept the Google Pay Terms and Conditions.

  5. Enter your Google Merchant ID into the field Google Pay Merchant ID for Custom Domains, then click Save.

    • For test environments, you can use any random value.

Once registered, the section will display “Registered” along with your Merchant ID and an option to Unregister.


Web SDK Integration Steps

1. Include the JavaScript Library

Add the JS library to your checkout page. This lightweight wrapper is built on top of the Google API.

<script src="https://pay.every-pay.eu/google_pay/google-pay-client-1.4.js"></script>

We recommend linking directly from us to benefit from dynamic updates.

2. Add the HTML Container

Insert an HTML container where the Google Pay button will appear

<div id="google-pay-container"></div>

3. Initialize the Web SDK

Initialize the Google Pay client.

Set testEnv: true for testing, false for production. This allows you to display the Google Pay button without needing a /oneoff request at this point.

var googlePayClient = GooglePayClient.initialize({ testEnv: true });

4. Create initPayment() Function

Write a function that triggers your E-shop backend to send a /oneoff request, including the additional parameter mobile_payment: true.

5. Create handleResult() Function

Write a function that configures the Google Pay client with payment data received from the /oneoff request response.

6. Create googlePayClicked() Function

This function should call both initPayment() and handleResult() to configure the Google Pay client and start the payment process.

7. Display the Google Pay Button

Use the SDK to render the button and bind the onClick event to your googlePayClicked() function.


Web SDK Integration example

<html>

<head>
<meta charset="UTF-8" />
<script src="https://pay.every-pay.eu/google_pay/google-pay-client-1.4.js"></script>
</head>

<body>
<div id="google-pay-container">
<script>
// Initialize the Web SDK
const googlePayClient = GooglePayClient.initialize({ testEnv: true })

googlePayClient.addGooglePayButton({
buttonColor: 'default',
buttonType: 'plain',
buttonSizeMode: 'fill',
onClick: googlePayClicked,
})

async function googlePayClicked() {
// Initialise the payment and retrieve the response data
const data = await initPayment()
// Pass data to the handleResponse function to configure Google Pay client
handleResponse(data)

// Display the Google Pay payment sheet
googlePayClient.createGooglePayPayment()
}

async function initPayment() {
// Send a request to the server endpoint with the amount as a query parameter
const response = await fetch(`https://example.com/init_payment`, {
method: 'post',
headers: {
'content-type': 'application/json',
},
})

if (response.ok) {
return response.json();
} else {
throw new Error('Invalid response from server');
}

}

// Function to handle the response data
function handleResponse({ responseData }) {
// Create responseParams object using const
const responseParams = {
access_token: responseData.mobile_access_token,
api_username: responseData.api_username,
account_name: responseData.account_name,
payment_reference: responseData.payment_reference,
country_code: responseData.descriptor_country,
currency_code: responseData.currency,
payment_link: responseData.payment_link,
amount: `${responseData.initial_amount}`,
}

googlePayClient.configure(responseParams)
}
</script>
</div>
</body>

</html>

Follow Google Pay Branding Guidelines to customize the button appearance.


Google Pay MIT Transactions

Google Pay supports MIT (Merchant Initiated Transactions) the same way as regular card payments.

If you already use MIT flows with card payments, no extra integration steps are required. You can:

  • Save the card token from the one-off transaction

  • Use the token to initiate MIT charges as usual

See MIT examples in the API documentation for details.


Compatibility

Google Pay is widely supported but some requirements may apply. Review the following:


Authentication Methods

Google Pay offers two ways to authenticate cardholders:

  • PAN_ONLY – requires 3D Secure for Strong Customer Authentication (SCA)

  • CRYPTOGRAM_3DS – compliant with SCA; does not require 3D Secure


Need help? Refer to the Google Pay Integration Testing guide for test scenarios.

Kas see vastas teie küsimusele?