Widget
Платежный виджет — всплывающая форма для ввода реквизитов карты и
Установка
Для установки виджета необходимо прописать на сайте скрипт в раздел head
<script src="https://widget.cloudpayments.ru/bundles/cloudpayments"></script>
Для появления платежной формы зарегистрировать функцию для вызова методов charge или auth
//note: в примере используется библиотека jquery
this.pay = function () {
var widget = new cp.CloudPayments();
widget.charge({ // options
publicId: 'test_api_00000000000000000000001', //id из личного кабинета
description: 'Пример оплаты (деньги сниматься не будут)', //назначение
amount: 10, //сумма
currency: 'RUB', //валюта
invoiceId: '1234567', //номер заказа (необязательно)
accountId: 'user@example.com', //идентификатор плательщика (необязательно)
data: {
myProp: 'myProp value' //произвольный набор параметров
}
},
function (options) { // success
//действие при успешной оплате
},
function (reason, options) { // fail
//действие при неуспешной оплате
});
};
и прописать вызов функции на событие, например, нажатие кнопки «Оплатить».
$('#checkout').click(pay);
Параметры
Вызов функции charge или функции auth определяет схему проведения оплаты: charge для одностадийной, auth — для двухстадийной.
Параметр | Формат | Применение | Описание |
publicId | String | Обязательный | Идентификатор сайта, находится в ЛК. |
description | String | Обязательный | Описание назначения оплаты в произвольном формате |
amount | Float | Обязательный | Сумма оплаты |
currency | String | Обязательный | Валюта: RUB/USD/EUR/GBP (см. справочник) |
invoiceId | String | Необязательный | Номер заказа или счета |
accountId | String | Обязательный для создания подписки | Идентификатор пользователя |
String | Необязательный | E-mail адрес пользователя | |
requireEmail | bool | Необязательный | Требовать указания e-mail адреса пользователя в виджете |
data | Json | Необязательный | Любые другие данные, которые будут связаны с транзакцией, в том числе инструкции для создания подписки или формирования онлайн-чека. Мы зарезервировали названия следующих параметров и отображаем их содержимое в реестре операций, выгружаемом в Личном Кабинете: name, firstName, middleName, lastName, nick, phone, address, comment, birthDate. |
Можно определить поведение формы в случае успешной или неуспешной оплаты следующими параметрами:
Параметр | Формат | Применение | Описание |
onSuccess | Function или String | Необязательный | Указывается либо функция, либо адрес страницы сайта. В случае указания функции, она будет вызвана после успешного завершения оплаты. В случае адреса — пользователь будет направлен на указанную страницу. |
onFail | Function или String | Необязательный | Указывается либо функция, либо адрес страницы сайта. В случае указания функции, она будет вызвана после неуспешного завершения платежа. В случае адреса — пользователь будет направлен на указанную страницу. |
Локализация
По умолчанию мы отображаем виджет на русском языке. Для вызова виджета, локализованного для других языков, передайте в параметрах инициализации виджета параметр language.
var widget = new cp.CloudPayments({language: "en-US"});
Список поддерживаемых языков:
Язык | Часовой пояс | Код |
Русский | MSK | ru-RU |
Английский | CET | en-US |
Латышский | CET | lv |
Азербайджанский | AZT | az |
Русский | ALMT | kk |
Казахский | ALMT | kk-KZ |
Украинский | EET | uk |
Польский | CET | pl |
Португальский | CET | pt |
Рекуррентные платежи
После успешного завершения оплаты виджет может автоматически создавать подписку на рекуррентные платежи. Для это нужно добавить несколько параметров запуска:
Параметр | Формат | Применение | Описание |
Interval | String | Обязательный | Интервал. Возможные значения: Day, Week, Month. |
Period | Int | Обязательный | Период. В комбинации с интервалом, 1 Month значит раз в месяц, а 2 Week — раз в две недели. |
MaxPeriods | Int | Необязательный | Максимальное количество платежей в подписке. По умолчанию без ограничений. |
Amount | Numeric | Необязательный | Сумма регулярного платежа. По умолчанию совпадает с суммой первого (установочного) платежа. |
StartDate | DateTime | Необязательный | Дата и время первого регулярного платежа. По умолчанию запуск произойдет через указанный интервал и период, например через месяц. |
CustomerReceipt | String | Необязательный | Данные для формирования онлайн-чека. |
Параметры для запуска регулярных платежей необходимо добавить
в объект data.cloudPayments.recurrent по примеру ниже:
this.pay = function () {
var widget = new cp.CloudPayments();
var receipt = {
Items: [//товарные позициии
{
label: 'Наименование товара 3',
//наименование товара
price: 300.00,
//цена
quantity: 3.00,
//количество
amount: 900.00,
//сумма
vat: 18,
//ставка НДС
method: 0,
// тег-1214 признак способа расчета - признак способа расчета
object: 0,
// тег-1212 признак предмета расчета - признак предмета товара, работы, услуги, платежа, выплаты, иного предмета расчета
}
],
taxationSystem: 0,
//система налогообложения; необязательный, если у вас одна система налогообложения
email: 'user@example.com',
//e-mail покупателя, если нужно отправить письмо с чеком
phone: '',
//телефон покупателя в любом формате, если нужно отправить сообщение со ссылкой на чек
amounts:
{
electronic: 9.00,
// Сумма оплаты электронными деньгами
advancePayment: 0.00,
// Сумма из предоплаты (зачетом аванса) (2 знака после запятой)
credit: 0.00,
// Сумма постоплатой(в кредит) (2 знака после запятой)
provision: 0.00
// Сумма оплаты встречным предоставлением (сертификаты, др. мат.ценности) (2 знака после запятой)
}
};
var data = {};
data.cloudPayments = {recurrent: { interval: 'Month', period: 1, сustomerReceipt: receipt}};
//создание ежемесячной подписки
widget.charge({ // options
publicId: 'test_api_00000000000000000000001',
//id из личного кабинета
description: 'Подписка на ежемесячный доступ к сайту example.com',
//назначение
amount: 1000, //сумма
currency: 'RUB', //валюта
invoiceId: '1234567', //номер заказа (необязательно)
accountId: 'user@example.com',
//идентификатор плательщика (обязательно для создания подписки)
data: data
},
function (options) { // success
//действие при успешной оплате
},
function (reason, options) { // fail
//действие при неуспешной оплате
});
};
Обратите внимание, что подписка будет создана только при указании параметра accountId, который может быть e-mail адресом, номером телефона или любым другим идентификатором плательщика.
Больше примеров создания рекуррентных платежей из виджета вы можете найти в разделе «Сценарии интеграции».
Для отмены рекуррентных платежей используйте возможности личного кабинета, API или предоставьте покупателю ссылку на сайт системы — https://my.cloudpayments.ru/unsubscribe, где он самостоятельно сможет найти и отменить свои подписки.
Мобильный виджет
Скрипт автоматически определяет устройство пользователя и запускает наиболее подходящий вариант виджета: обычный либо оптимизированный для мобильных устройств. Для удобства покупателей, мобильная версия виджета открывается в новом окне и занимает весь экран.
Все параметры и функции обычного и мобильного виджетов являются идентичными.
Для предотвращения блокировки нового окна при запуске виджета
в асинхронном режиме, либо в результате вызова ajax функции, мобильный виджет может показывать промежуточную кнопку "Перейти к оплате" перед открытием. Если вы запускаете виджет напрямую после действия пользователя (клик по кнопке или ссылке), вы можете отключить промежуточную кнопку параметром startWithButton.
var widget = new cp.CloudPayments({ startWithButton: false });