Платёжная форма QIWI¶

Форма QIWI предназначена для указания платёжных реквизитов с целью покупки товара или услуги. При оплате с формы QIWI партнёр не получает, не обрабатывает и не хранит платёжные данные клиента (например, данные карты). Это делает форма.

Кастомизация¶

Кастомизация позволяет настроить внешний вид формы.

Настраиваются следующие элементы:

Элемент	Требования	Обязателен для настройки
Логотип	Формат PNG или SVG, размер 48x48 или пропорционально больше	✅
Цвет кнопок	Формат HEX	✅
Название провайдера/услуги		✅
Ссылка на оферту

Для кастомизации формы обратитесь в службу поддержки и предоставьте:

список элементов, которые требуют настройки (см. таблицу выше);
siteId и уникальный код стиля формы (допустимо использовать цифры, латинские буквы и символ дефиса -).

В результате код, а следовательно и внешний вид формы, будет связан с конкретным siteId.

Чтобы применить стиль к форме, передайте код стиля в параметре:

themeCode JSON-объекта customFields в запросе на создание счёта, если сценарий оплаты предполагает использование API;

Пример

"themeCode": "merchant01-theme01"
extras[themeCode] в прямом вызове формы, если сценарий предполагает оплату без использования API.

Пример

...&extras[themeCode]=merchant01-theme01

Обратите внимание

Значение кода регистрозависимое.

Пример формы

PAY-FORM

URL-адрес формы¶

URL-адрес платёжной формы QIWI возвращается в ответе на запрос создания счёта и содержится в параметре payUrl. На полученный URL партнёр направляет клиента для оплаты заказа.

Пример payUrl

https://oplata.qiwi.com/form?invoiceUid=606a5f75-4f8e-4ce2-b400-967179502275

К исходному payUrl партнёр самостоятельно может добавить параметры:

Параметр	Описание	Значение
successUrl	См. описание раздела «URL-адрес страницы для успешного платежа»	URL-закодированная строка
lang	Язык платежной формы. Язык по умолчанию — русский (`ru`)	`ru`, `en`
paymentMethod	См. описание раздела «Способы оплаты» статьи «Интернет-эквайринг» → «Оплата с формы QIWI» → «Оплата с помощью API»	`CARD`, `SBP`, `QIWI_WALLET`

Пример payUrl c параметром successUrl

https://oplata.qiwi.com/form?invoiceUid=606a5f75-4f8e-4ce2-b400-967179502275&successUrl=https://example.com/payments/#introduction

Открытие формы в iframe¶

При открытии URL-адреса формы в iframe (iframe src="<ссылка payUrl> ..." />) партнёр может использовать метод postMessage для отслеживания состояния формы.

Возможные состояния:

INITIALIZED — форма загружена;
PAYMENT_ATTEMPT — попытка оплаты;
PAYMENT_SUCCEEDED — оплата прошла успешно;
PAYMENT_FAILED — оплата не прошла;
INITIALIZATION_FAILED — ошибка загрузки формы.

Пример обработчика событий iframe

window.addEventListener('message', function (event) {
    switch (event.data) {
        case 'INITIALIZED':
            // Форма загружена
            break;
        case 'PAYMENT_ATTEMPT':
            // Попытка платежа
            break;
        case 'PAYMENT_SUCCEEDED':
            // Платеж прошел успешно
            break;
        case 'PAYMENT_FAILED':
            // Платеж не прошел
            break;
    }
}, false)

Обратите внимание

Если форма открыта в iframe с сайта партнёра, оплата QIWI Кошельком может быть недоступна: при аутентификации в QIWI Кошельке устанавливаются cookie домена qiwi.com и некоторые браузеры блокируют установку cookie сторонних доменов. Подробности см. в документации WebKit.

URL-адрес страницы для успешного платежа¶

После оплаты на форме QIWI клиента можно направить с формы на определённую страницу на сайте партнёра по successUrl. Клиент окажется на successUrl через 3-10 секунд после успешного совершения операции.

По переходу клиента на successUrl партнёр может понять, что клиент оплатил товар или услугу и вскоре статус операции в QIWI изменится.

Обратите внимание

Для принятия решения об успешности операции партнёру необходимо выполнить действия, указанные в статье «Общие принципы и правила» → «Решение об успешности операции».

URL-адрес необходимо указывать в кодировке UTF-8.

Язык¶

Форма поддерживает два языка: русский и английский. Языком по умолчанию является русский, это можно изменить, обратившись к курирующему менеджеру.