index.html

<!-- Подключаем скрипт CloudPayments на странице -->
{<head>
 add_action( 'wp_enqueue_scripts', function() {
	wp_enqueue_script( 'cp', 'https://checkout.cloudpayments.ru/checkout.js' );
</head>
<!-- Создаем HTML-форму для ввода данных карты -->
<form id="payment-form">
  <label for="cardNumber">Номер карты</label>
  <input type="text" id="cardNumber" name="cardNumber">
  <label for="cardExp">Срок действия карты</label>
  <input type="text" id="cardExp" name="cardExp">
  <label for="cardCvc">CVC код</label>
  <input type="text" id="cardCvc" name="cardCvc">
  <label for="cardHolder">Имя владельца карты</label>
  <input type="text" id="cardHolder" name="cardHolder">
  <button type="button" id="pay-button">Оплатить</button>
</form>

<script>
  // Функция обработки нажатия на кнопку оплаты
  function pay() {
    // Получаем данные карты из формы
    const cardNumber = document.getElementById('cardNumber').value;
    const cardExp = document.getElementById('cardExp').value;
    const cardCvc = document.getElementById('cardCvc').value;
    const cardHolder = document.getElementById('cardHolder').value;

    // Создаем объект options для передачи данных карты в функцию CloudPayments.generateCryptogram
    const options = {
      publicId: 'pk_449f4dbb3b1e917d21fcee1a94804', // ID публичного ключа CloudPayments
      cardNumber,
      cardDate: cardExp.replace(/\s+/g, ''), // форматируем дату для передачи в функцию
      cardSecurityCode: cardCvc,
      cardHolderName: cardHolder // имя владельца карты
    };

    // Вызываем функцию CloudPayments.generateCryptogram для генерации криптограммы
    CloudPayments.generateCryptogram(options, function (err, response) {
      if (err) {
        console.log(err);
        alert('Ошибка при генерации криптограммы');
        return;
      }

      // Извлекаем криптограмму из полученного объекта response
      const cryptogram = response.cryptogram;

      // Формируем тело запроса для отправки данных в Adalo через API
      const data = {
        "fields": {
          "Cryptogram": cryptogram
        }
      };

      // Отправляем данные с помощью fetch() и метода POST на URL базы данных Adalo
      fetch('https://api.adalo.com/v0/apps/3fb1728c-b2e4-4f80-9d29-e445a92d801c/collections/t_4ih9comtkdl1h4noxzoo32ews', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
          'Authorization': 'Bearer dczbshny3gtfxgea0i71w3l2s' // ключ API Adalo
        },
        body: JSON.stringify(data)
      }).then(response => {
        if (!response.ok) {
          throw new Error('Ошибка при отправке данных в Adalo');
        }
        alert('Оплата прошла успешно');
      })
      .catch(error => {
        console.log(error);
        alert('Ошибка при отправке данных в Adalo');
      });
    });
  }

  // Назначаем обработчик события на кнопку оплат