Нативна кнопка Google Pay

Інтеграція Google Pay API

Документація

1. Отримання даних для інтеграції

Зареєструйте мерчанта в Monobank

Щоб отримати доступ до прийому платежів через Google Pay, вам потрібно:

gatewayMerchantId – це ваш ідентифікатор продавця шлюзу у Google Pay (див. Налаштування акаунту мерчанта). У тестовому середовищі значення має бути «googletest»
gateway - monobank

2. Підключення Google Pay API на сайт

Додайте Google Pay SDK у <head> сторінки:

Copy

<script async src="https://pay.google.com/gp/p/js/pay.js"></script>

3. Налаштування Google Pay API

Створіть об'єкт paymentDataRequest, використовуючи gateway: "monobank" та ваш gatewayMerchantId:

Copy

const paymentsClient = new google.payments.api.PaymentsClient({ environment: "PRODUCTION" });

const paymentDataRequest = {
  apiVersion: 2,
  apiVersionMinor: 0,
  allowedPaymentMethods: [{
    type: "CARD",
    parameters: {
      allowedAuthMethods: ["PAN_ONLY", "CRYPTOGRAM_3DS"],
      allowedCardNetworks: ["VISA", "MASTERCARD"]
    },
    tokenizationSpecification: {
      type: "PAYMENT_GATEWAY",
      parameters: {
        gateway: "monobank",
        gatewayMerchantId: "gatewayMerchantId" // Google Merchant Id
      }
    }
  }],
  merchantInfo: {
    merchantName: "Назва вашої компанії"
  },
  transactionInfo: {
    totalPriceStatus: "FINAL",
    totalPrice: "100.00", // Сума платежу
    currencyCode: "UAH"
  }
};

4. Додавання кнопки Google Pay

Додайте кнопку на сайт:

Copy

const button = paymentsClient.createButton({
  onClick: onGooglePaymentButtonClicked
});
document.getElementById('container').appendChild(button);

Помістіть кнопку в HTML-код:

Copy

<div id="container"></div>

5. Обробка платежу

При натисканні на кнопку Google Pay клієнт здійснює оплату, а ви отримуєте зашифрований токен платежу (paymentData).

Copy

async function onGooglePaymentButtonClicked() {
  try {
    const paymentData = await paymentsClient.loadPaymentData(paymentDataRequest);
    console.log("Отримані платіжні дані:", paymentData);

    fetch("https://.........", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({ paymentData })
    })
    .then(response => response.json())
    .then(data => console.log("Результат платежу:", data))
    .catch(error => console.error("Помилка платежу:", error));

  } catch (error) {
    console.error("Помилка Google Pay:", error);
  }
}

6. Відправка платежу в Monobank

Вам потрібно надіслати отриманий токен платежу на сервер та передати його в API Monobank.

🔹 URL API Monobank для обробки платежу: POST https://api.monobank.ua/api/merchant/wallet/payment

🔹 Приклад запиту:

Copy

{
  "gToken": ""{\"signature\":\"MEUCI******\",\"intermediateSigningKey\":{\"signedKey\":\"{\\\"keyValue\\\":\\\"MFkwE******\\\",\\\"keyExpiration\\\":\\\"17425******\\\"}\",\"signatures\":[\"MEYCIQ******\"]},\"protocolVersion\":\"ECv2\",\"signedMessage\":\"{\\\"encryptedMessage\\\":\\\"Nj6PnH******\\\",\\\"ephemeralPublicKey\\\":\\\"BDIMkgT******\\\",\\\"tag\\\":\\\"VOIiCwE******\\\"}\"}",
  "amount": 10000,  // Сума у копійках (100.00 UAH = 10000)
  "ccy": 980,        // Код валюти UAH
  "redirectUrl": "https://ваш_сайт/успішний_платіж"
}

В поле gToken передається signature отриманий від google. Потрібно задати правильний формат для передачі в api. Звірити чи правильний передаєте формат можна на сайті - https://jsonformatter.org/json-stringify-online (це безкоштовний сайт для перетворення даних у формат JSON Stringify

Після впровадження цієї інструкції ваш сайт зможе приймати платежі через Google Pay + Monobank, а всі платежі будуть проходити через gateway.

❓ Є питання? Звертайтеся до нас! 🚀

PreviousНативна кнопка Apple Pay NextБрендбук

Last updated 6 months ago

hashtagДокументація

hashtag1. Отримання даних для інтеграції

hashtag2. Підключення Google Pay API на сайт

hashtag3. Налаштування Google Pay API

hashtag4. Додавання кнопки Google Pay

hashtag5. Обробка платежу

hashtag6. Відправка платежу в Monobank

Документація

1. Отримання даних для інтеграції

2. Підключення Google Pay API на сайт

3. Налаштування Google Pay API

4. Додавання кнопки Google Pay

5. Обробка платежу

6. Відправка платежу в Monobank