Віджет - спливаюча платіжна форма для введення реквізитів платника без переходу користувача на сайт платіжного шлюзу.
Відсутність перенаправлення на інші сайти - виключається ризик втратити клієнта при переході з кошика на сторінку оплати.
Сайту немає необхідності отримувати сертифікацію PCI DSS - фактично оплата проходить на стороні Wayforpay, а візуально, на стороні сайту.
Для ініціалізації платіжного віджета необхідно використовувати наступний скрипт:
<script id="widget-wfp-script" language="javascript" type="text/javascript" src="https://secure.wayforpay.com/server/pay-widget.js"></script>
<script type="text/javascript">
var wayforpay = new Wayforpay();
var pay = function () {
wayforpay.run({
merchantAccount : "test_merch_n1",
merchantDomainName : "www.market.ua",
authorizationType : "SimpleSignature",
merchantSignature : "b95932786cbe243a76b014846b63fe92",
orderReference : "DH783023",
orderDate : "1415379863",
amount : "1547.36",
currency : "UAH",
productName : "Процессор Intel Core i5-4670 3.4GHz",
productPrice : "1000",
productCount : "1",
clientFirstName : "Вася",
clientLastName : "Васечкин",
clientEmail : "some@mail.com",
clientPhone: "380631234567",
language: "UA"
},
function (response) {
// on approved
},
function (response) {
// on declined
},
function (response) {
// on pending or in processing
}
);
}
</script>
<button type="button" onclick="pay();">Оплатить</button>Набір параметрів запиту відповідає описаним параметрам запиту з розділу Прийняти платіж (Purchase).
* Обов'язковими полями також є clientFirstName + clientLastName + clientPhone
Аутентифікація запитів
З метою підтвердження валідності даних повинно бути згенеровано і передано в запиті HMAC_MD5 контрольний підпис з використанням SecretKey торговця.
Рядок, що підлягає HMAC_MD5, генерується шляхом конкатенації параметрів merchantAccount, merchantDomainName, orderReference, orderDate, amount, currency, productName [0],
productName [1] ..., productName [n], productCount [0], productCount [1], ..., productCount [n], productPrice [0], productPrice [1], ..., productPrice [n] розділених ";" (крапка з комою) в кодуванні UTF-8
Для виконання верифікації карти в віджеті необхідно передати параметр "requestType":
wayforpay.run({ ... requestType: "VERIFY" });
Параметр "straightWidget" визначає відкриття міні-програм на мобільних пристроях замість перенаправлення на мобільну версію сторінки оплати:
wayforpay.run({ ... straightWidget: true });Для закриття віджету в функції-обробнику події досить викликати метод wayforpay.closeit ();
Параметр response в обробниках подій є об'єктом, який містить підписані дані з результатом виконання операції.
Додатково, при настанні певних подій в батьківське вікно за допомогою методу postMessage надсилаються повідомлення:
- WfpWidgetEventApproved - при успішному завершенні операції
- WfpWidgetEventDeclined - при неуспішному завершенні;
- WfpWidgetEventPending - транзакція на обробці;
- WfpWidgetEventClose - при закритті віджету користувачем.
window.addEventListener("message", function () {
if (event.data == 'WfpWidgetEventApproved') {
// location.url = '...';
}
}, false);
Для сплати інвойсу за допомогою віджету
<script id="widget-wfp-script" language="javascript" type="text/javascript" src="https://secure.wayforpay.com/server/pay-widget.js"></script>
<script type="text/javascript">
var wayforpay = new Wayforpay();
var pay = function () {
wayforpay.invoice('<invoiceUrl>');
}
</script>
<button type="button" onclick="pay();">Оплатить</button>де <invoiceUrl> - посилання на стрінку сплати інвойсу, наприклад 'https://secure.wayforpay.com/invoice/ie01a84b32807'
Якщо необхідно завжди відкривати віджет (без уходу з Вашої сторінки навіть на мобільних пристроях), потрібно у функції виклику wayforpay.invoice передати другий параметр зі значенням true:
...
wayforpay.invoice('https://secure.wayforpay.com/invoice/ie01a84b32807', true);
...
