> For a complete page index, fetch https://docs.transak.com/llms.txt

# Headless Google Pay

**Headless Google Pay** is a lightweight, embeddable UI module that allows partners to offer Google Pay as a payment method directly within their own application without loading any widget.

## Problem Statement

Currently, Transak requires loading the full widget for Google Pay, which forces users to go through multiple screens before reaching payment module. This creates friction and limits the partner control over the payment experience.

Here are some of the **key challenges** with the current approach:

<table>
  <tbody>
    <tr>
      <td>
        <strong>
          Full widget required
        </strong>

        Partners must load the entire Transak widget to confirm order with Google Pay as payment method.
      </td>
    </tr>

    <tr>
      <td>
        <strong>
          Multiple screens before payment
        </strong>

        Users navigate through several Transak screens before they ever see the Google Pay button, increasing drop-off risk.
      </td>
    </tr>

    <tr>
      <td>
        <strong>
          Disconnected payment experience
        </strong>

        The payment flow feels separate from the partner's own UI, breaking the continuity.
      </td>
    </tr>

    <tr>
      <td>
        <strong>
          Limited partner control
        </strong>

        Partners have no control over when or where Google Pay appears as placement and styling are determined by the widget.
      </td>
    </tr>
  </tbody>
</table>

## Our Solution

Headless Google Pay exposes just the Google Pay button as a standalone, embeddable component. Partners control where it sits, how it looks, and what happens after payment. Transak handles all the payment infrastructure in the background.

Here are some of the **key benefits** of the Headless Google Pay solution:

<table>
  <tbody>
    <tr>
      <td>
        <strong>
          Just the Google Pay button
        </strong>

        Embed only the Google Pay button — no full widget required.
      </td>
    </tr>

    <tr>
      <td>
        <strong>
          One tap to payment
        </strong>

        Users see the Google Pay button immediately and complete payment in a single tap, reducing drop-off.
      </td>
    </tr>

    <tr>
      <td>
        <strong>
          Seamless checkout integration
        </strong>

        The Google Pay button sits inside the partner's own checkout UI, keeping the experience continuous.
      </td>
    </tr>

    <tr>
      <td>
        <strong>
          Full partner control
        </strong>

        Partners decide where the button appears, how it looks, and what happens after payment.
      </td>
    </tr>
  </tbody>
</table>

## How does it work?

## Current Limitations

<table>
  <thead>
    <tr>
      <th>
        Limitation
      </th>

      <th>
        Details
      </th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td>
        <strong>
          Headless Google Pay APIs (

          [Transaction Session API](/api/headless-google-pay/transaction-session-api)

          , 

          [Transaction Process API](/api/headless-google-pay/transaction-process-api)

          , 

          [Transaction Request Status API](/api/headless-google-pay/transaction-request-status-api)

          )
        </strong>
      </td>

      <td>
        APIs are to be called only from the partner backend and subjected to the whitelisting of partner IP addresses. We don't support API calls from the frontend due to security restrictions.
      </td>
    </tr>

    <tr>
      <td>
        <strong>
          Supported for JS, React, and React Native integrations
        </strong>
      </td>

      <td>
        The Transak UI SDK is available for [JS, React, and React Native](/features/headless-google-pay#load-the-google-pay-component-via-transak-ui-sdk) integrations.
      </td>
    </tr>
  </tbody>
</table>

## How to integrate?

| Action                                                                                                                 |
| ---------------------------------------------------------------------------------------------------------------------- |
| Follow the steps in the [Need help in Integration](/getting-started/help-and-support#need-help-in-integration) section |
| Request **API key whitelisting** and ask to **enable Headless Google Pay** for your API key                            |
| Share your public IP addresses with Transak for whitelisting to use our APIs in your backend                           |

You can use either of the following authentication options:

| Option               | Description                                                                                                                                                                                                                                                                                                 |
| -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **White-label Auth** | Use the standard Transak authentication flow to generate a user access token. Partners can do this by calling the [Send User OTP API](/api/whitelabel/user/send-user-otp) followed by the [Verify User API](/api/whitelabel/user/verify-user-otp) to generate the access token.<br /><br />Learn more<br /> |
| **Auth Reliance**    | Use [Auth Reliance](/features/auth-reliance) by passing these headers with every request: `x-user-identifier` and `x-access-token`                                                                                                                                                                          |

Please refer to the tutorial on [how to create partner access token](/guides/how-to-create-partner-access-token).

KYC is a mandatory step in compliance with regulatory requirements. Each user should be KYC Approved. You can use either of the following KYC options:

| Option                      | Description                                                                                                                                                               |
| --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **White label KYC**         | Partners can collect the required KYC information on their end and then forward it to Transak for review and approval. Learn more: [Whitelabel KYC](/integration/api#kyc) |
| **KYC Reliance via Sumsub** | Partners can share their KYC data from their platform with Transak using Sumsub. Learn more: [KYC Reliance Guide](/features/kyc-reliance-sumsub)                          |

Call the [Get Quote API](https://docs.transak.com/api/whitelabel/lookup/get-quote) to get a quote for the transaction. Pass the apiKey, fiat amount, fiat currency, crypto currency, network, and order type.

Set `paymentMethod` to `google_pay` while creating a quote.

A successful response returns a `quoteId`.

Call the [Transaction Session API](/api/headless-google-pay/transaction-session-api) from your backend using the `quoteId`, `successUrl`, `failureUrl` and the user's wallet address. You can optionally pass a `config` and `billingAddress` object to customise the look and feel of the Google Pay component and billing details.

| Parameter       | Description                                                                                                             |
| --------------- | ----------------------------------------------------------------------------------------------------------------------- |
| `quoteId`       | Quote ID returned by the [Get Quote API](https://docs.transak.com/api/whitelabel/lookup/get-quote) in the previous step |
| `walletAddress` | The user's wallet address for the selected cryptocurrency and network                                                   |
| `successUrl`    | URL to redirect the user to when the transaction completes successfully                                                 |
| `failureUrl`    | URL to redirect the user to when the transaction fails or is cancelled                                                  |

A successful response returns a `sessionId`.

Use the Transak UI SDK to render the Google Pay component. Pass the `sessionId` received in previous Step.

```bash
npm install @transak/ui-components
```

```tsx
import { createTransakGooglePay } from '@transak/ui-components';

const googlePay = createTransakGooglePay({
  sessionId, // sessionId from Previous Step
  environment, // 'STAGING' | 'PRODUCTION'                       
  onReady: () => {
    // Component is ready
  },
  onSuccess: ({ requestId }) => {
    // Payment data captured — use requestId in the next step
  },  
  onError: ({ code }) => {
    // Handle error
  }      
});

await googlePay.mount('checkout-slot');

// and then
googlePay.unmount();
```

```bash
npm install @transak/ui-components-react
```

```tsx
import { TransakGooglePay } from '@transak/ui-components-react';

<TransakGooglePay
  sessionId={sessionId} // sessionId from Previous Step
  environment={environment} // 'STAGING' | 'PRODUCTION'
  onReady: () => {
    // Component is ready
  },
  onSuccess: ({ requestId }) => {
    // Payment data captured — use requestId in the next step
  },  
  onError: ({ code }) => {
    // Handle error
  }      
/>
```

```bash
npm install @transak/ui-components-rn
```

```tsx
import { TransakGooglePay } from '@transak/ui-components-rn';

<TransakGooglePay
  sessionId={sessionId} // sessionId from Previous Step
  environment={environment} // 'STAGING' | 'PRODUCTION'
  onReady: () => {
    // Component is ready
  },
  onSuccess: ({ requestId }) => {
    // Payment data captured — use requestId in the next step
  },  
  onError: ({ code }) => {
    // Handle error
  }      
/>
```

**Error codes**

The `onError` callback receives a `code` value. Use it to handle specific failure scenarios:

| Code                     | Description                                  |
| ------------------------ | -------------------------------------------- |
| `CONFIG_LOAD_FAILED`     | Google Pay configuration could not be loaded |
| `PAYMENT_CAPTURE_FAILED` | Google Pay payment capture failed            |
| `INVALID_OPTIONS`        | Invalid or missing options passed to the SDK |
| `IFRAME_LOAD_FAILED`     | The embedded iframe failed to load           |
| `INVALID_STATE`          | SDK method called in an unexpected state     |

Here’s how the Google Pay module appears :

Once the SDK fires `onSuccess` with a `requestId`, call the [Transaction Process API](/api/headless-google-pay/transaction-process-api) from your backend to complete the payment and create the order.

A successful response returns the full order details with `redirectUrl`.

Open the `redirectUrl` returned in the previous step in the browser or webview to complete any 3DS or bank authentication required by the payment provider.

Upon completing the transaction, the user will be redirected to either the `successUrl` or `failureUrl` you passed in the [Transaction Session API](/api/headless-google-pay/transaction-session-api).

| Outcome            | Redirect destination                           |
| ------------------ | ---------------------------------------------- |
| Payment successful | `successUrl` passed in Transaction Session API |
| Payment failed     | `failureUrl` passed in Transaction Session API |

Call the [Transaction Request Status API](/api/headless-google-pay/transaction-request-status-api) to check whether the request has been processed. Poll this endpoint until the status reaches a terminal state.

Once you receive an `orderId`, use the [Get Order by ID](https://docs.transak.com/api/public/get-order-by-order-id) API to fetch full order details.

## API Overview

Creates a transaction session using a quote ID and wallet address, returns a `sessionId` to initialise the Google Pay component.

Processes the Google Pay payment using the `requestId` returned by the SDK's  onSuccess callback, completing the order creation.

Polls the status of the `requestId` until it reaches a terminal state.

## API Errors

| HTTP Status | Error Code | Message                                                                                                       |
| ----------- | ---------- | ------------------------------------------------------------------------------------------------------------- |
| 400         | 6099       | successUrl and failureUrl are required for credit/debit card payments.                                        |
| 401         | 1002       | Invalid or missing authentication token.                                                                      |
| 422         | 6002       | KYC is not approved. Please complete KYC before creating a session.                                           |
| 422         | 6003       | This feature is not enabled for your account. Please contact support.                                         |
| 422         | 6005       | Quote not found or could not be loaded.                                                                       |
| 422         | 6005       | This payment method is not currently supported. Please try a different payment method.                        |
| 422         | 6006       | The provided wallet address is invalid for the selected cryptocurrency and network.                           |
| 400         | 2030       | Your account has been disabled. Please get in touch with us at [fraud@transak.com](mailto:fraud@transak.com). |
| 500         | 6005       | Failed to create a session for the user.                                                                      |

| HTTP Status | Error Code | Message                                                                                                       |
| ----------- | ---------- | ------------------------------------------------------------------------------------------------------------- |
| 404         | 6007       | Request ID not found.                                                                                         |
| 409         | 4005       | Order exists.                                                                                                 |
| 422         | 4001       | Invalid wallet address. Please provide a valid wallet address to proceed.                                     |
| 422         | 4003       | Please upgrade your kyc to next level to proceed with this transaction.                                       |
| 422         | 4013       | Minimum amount should be more than \{amount}.                                                                 |
| 422         | 4015       | Invalid payment method for currency combination.                                                              |
| 422         | 4016       | FCA criteria not met, Please complete the assessments.                                                        |
| 422         | 6012       | KYC requirement is not approved for this transaction.                                                         |
| 422         | 6014       | Unable to process request. User location data is required for this transaction.                               |
| 400         | 2030       | Your account has been disabled. Please get in touch with us at [fraud@transak.com](mailto:fraud@transak.com). |
| 500         | 4006       | Unable to create order.                                                                                       |
| 500         | 4021       | Something went wrong, try again later!                                                                        |
| 500         | 6099       | Unable to process the order. Please try again.                                                                |

| HTTP Status | Error Code | Message                                                                         |
| ----------- | ---------- | ------------------------------------------------------------------------------- |
| 404         | 6007       | Request ID not found.                                                           |
| 409         | 4005       | Order exists.                                                                   |
| 422         | 4001       | Invalid wallet address. Please provide a valid wallet address to proceed.       |
| 422         | 4003       | Please upgrade your kyc to next level to proceed with this transaction.         |
| 422         | 4013       | Minimum amount should be more than \{amount}.                                   |
| 422         | 4015       | Invalid payment method for currency combination.                                |
| 422         | 4016       | FCA criteria not met, Please complete the assessments.                          |
| 422         | 6011       | KYC requirement is not approved for this transaction.                           |
| 422         | 6014       | Unable to process request. User location data is required for this transaction. |
| 500         | 4006       | Unable to create order.                                                         |
| 500         | 4021       | Something went wrong, try again later!                                          |
| 500         | 6099       | Unable to process the order. Please try again.                                  |