Интеграция платежей — узкое место, где теряется до 15% заказов. Покупатели бросают корзину, если форма уводит на сторонний сайт или долго грузится. CloudPayments решает это встроенным виджетом: пользователь не покидает страницу. В одном из проектов — интернет-магазин электроники с оборотом 1,5 млн ₽ в месяц — после перехода с редиректа на виджет конверсия выросла на 12%. Типичная потеря от отказов до интеграции составляла 500 000 ₽ в месяц. CloudPayments позволяет удержать клиента, и мы накопили опыт для 20+ проектов. Гарантируем стабильную работу и полную фискализацию по 54-ФЗ.
Как CloudPayments повышает конверсию?
Виджет CloudPayments — всплывающая форма поверх сайта. Скрипт ~180 КБ, загружается лениво. В наших проектах конверсия выросла в среднем на 10% после перехода с уводящей страницы. Сравнение с Checkout (iframe) — виджет даёт на 5–7% больше завершённых транзакций за счёт меньшего числа шагов. При этом дополнительная выручка достигает 200 000 ₽ в месяц для магазина со средним чеком 3 000 ₽ и 1000 заказов.
Какие проблемы решаем?
- Конверсия — платёжная форма поверх сайта без редиректа повышает LTV и снижает отток. Каждый дополнительный шаг отсекает часть покупателей. Виджет минимизирует эти потери.
- Безопасность — 3D Secure 2.0, сертификация PCI DSS Level 1, токенизация карт. CloudPayments проходит ежегодный аудит безопасности — вам не нужно заботиться о хранении чувствительных данных.
- Законность — встроенная онлайн-касса с автоматической передачей чеков в ОФД. Все операции соответствуют 54-ФЗ, штрафы за отсутствие чеков исключены.
- Гибкость — рекуррентные платежи для подписок, возвраты полные/частичные, мультивалютность. CloudPayments поддерживает RUB, USD, EUR — можно принимать платежи из-за рубежа.
Как мы подключаем CloudPayments?
Мы используем виджет как самый быстрый способ (1-2 дня) с конверсией выше, чем при iframe. Для полного кастома UI — API (5-10 дней, требует PCI DSS SAQ A-EP). Для типовых задач хватает виджета.
Сравнение виджета и API для кастомизации
| Параметр | Виджет | API |
|---|---|---|
| Время разработки | 1–2 дня | 5–10 дней |
| Кастомизация UI | Ограничена (темы, скины) | Полная, любой дизайн |
| PCI DSS | Не требуется | SAQ A-EP |
| Конверсия | Выше (5–7% прирост) | Зависит от реализации |
| Поддержка рекуррентов | Да | Да |
| Фискализация | Через data-блок | Через API |
Подключение виджета
<script src="https://widget.cloudpayments.ru/bundles/cloudpayments.js"></script>
const pay = () => {
const widget = new cp.CloudPayments({ language: 'ru-RU' });
widget.charge(
{
publicId: 'pk_xxxxxxxxxxxxxxxxxxxx',
description: 'Заказ #12345',
amount: 1500,
currency: 'RUB',
accountId: '[email protected]',
invoiceId: 'order-12345',
skin: 'mini',
data: {
orderId: 12345,
},
},
(options) => {
console.log('payment success', options);
},
(reason, options) => {
console.error('payment failed:', reason);
},
);
};
publicId — публичный ключ из личного кабинета. Секретный ключ (apiSecret) — только на сервере, никогда во фронтенде.
Как проверить HMAC-подпись webhook?
- Получите тело POST-запроса от CloudPayments.
- Вычислите HMAC SHA256 от тела, используя секретный ключ (
apiSecret). - Сравните полученную подпись с заголовком
Content-HMAC. - Если не совпадает — верните HTTP 403.
- При совпадении обработайте статус платежа.
После оплаты CloudPayments отправляет POST на URL, указанный в личном кабинете (раздел «Уведомления»). Тип уведомления — payment. Для проверки используется HMAC SHA256, описанный в стандарте. Подробнее — в официальной документации CloudPayments.
public function handleWebhook(Request $request): Response
{
$hmac = base64_encode(
hash_hmac('sha256', $request->getContent(), env('CP_API_SECRET'), true)
);
if ($hmac !== $request->header('Content-HMAC')) {
return response('Invalid signature', 403);
}
$data = $request->all();
if ($data['Status'] === 'Completed') {
$orderId = $data['InvoiceId'];
$amount = $data['Amount'];
Order::where('id', $orderId)
->where('total', $amount)
->update(['status' => 'paid', 'transaction_id' => $data['TransactionId']]);
}
return response()->json(['code' => 0]);
}
Если вернуть {"code": 13}, CloudPayments будет повторять уведомление по расписанию до 10 раз. Это полезно при временных ошибках БД.
Как настроить фискализацию по 54-ФЗ?
CloudPayments имеет встроенную онлайн-кассу. Данные для чека передаются в параметре cloudPayments.customerReceipt внутри объекта data виджета:
data: {
cloudPayments: {
customerReceipt: {
Items: [
{
label: 'Товар 1',
price: 1500.00,
quantity: 1.0,
amount: 1500.00,
vat: null,
method: 0,
object: 1,
},
],
taxationSystem: 1,
email: '[email protected]',
amounts: {
electronic: 1500.00,
advancePayment: 0.00,
credit: 0.00,
provision: 0.00,
},
},
},
}
Для повторных платежей без ввода реквизитов CloudPayments возвращает Token в первом успешном платеже. Его сохраняют в БД и используют для последующих списаний:
$response = Http::withBasicAuth(env('CP_PUBLIC_ID'), env('CP_API_SECRET'))
->post('https://api.cloudpayments.ru/payments/tokens/charge', [
'Amount' => 1500,
'Currency' => 'RUB',
'AccountId' => '[email protected]',
'Token' => $savedToken,
'InvoiceId' => 'order-12346',
'Description' => 'Автоматическое списание',
]);
Возвраты выполняются через API: передайте TransactionId и сумму частичного возврата. CloudPayments поддерживает как полные, так и частичные возвраты.
Этапы работы
| Этап | Длительность | Результат |
|---|---|---|
| Анализ требований и настройка аккаунта | 1 день | Настроенные ключи, webhook URL |
| Разработка виджета и серверной логики | 2–3 дня | Готовый платёжный модуль |
| Интеграция фискализации и токенизации | 1–2 дня | Чеки и рекуррентные платежи |
| Тестирование и отладка | 1 день | Прогон сценариев в тестовом режиме |
| Деплой и документация | 0.5 дня | Работающая система, инструкция для операторов |
Что входит в результаты
- Настройка личного кабинета CloudPayments: домен, webhook, публичный/секретный ключи.
- Встраивание виджета с поддержкой рекуррентов и фискализации.
- Разработка серверного webhook с валидацией HMAC-подписи.
- Интеграция возвратов и токенизации.
- Документация и обучение сотрудников работе с платёжным модулем.
Почему выбирают нас
- 5+ лет опыта разработки и интеграции платёжных систем.
- 20+ успешных проектов с CloudPayments.
- Сертифицированные специалисты.
- Поддержка после сдачи: отладка, доработки, мониторинг.
Свяжитесь с нами для оценки вашего проекта — подберём оптимальный вариант интеграции под ваш стек и бюджет. Получите консультацию.