Как обработать Promise resolve в случае успешной оплаты QIWI?

Question

[salomatin]

Я настроил Checkout Popup для p2p (Прием переводов). В документации сказано что в случае успешной оплаты Promise resolve-ится с параметрами с которыми был создан счет, иначе reject-ится с причиной из-за которой оплата была прервана

Написал такой код:
QiwiCheckout.createInvoice({
publicKey: 'publikkey*****',
amount: 1200,
successUrl: 'https://site.ru/success/',
})
.then(data => {
alert('success');
$(location).attr('href', 'https://site.ru/success/');
})
.catch(error => {
alert('error');
console.log('Ошибка: '+error);
})

Обработчик ошибок ".catch(error => "работает, при закрытии модального окна или ошибке при оплате работет корректно, и выдает alert и console.log

Но в случае успешной оплаты текст в модальном окне меняется на сообщение об успехе и ссылкой для перехода к сайту из параметра " successUrl". Через 2 секунды после совершения оплаты форма оплаты закрывается (как и сказано в документации)

Я не могу понять как мне вызвать кастомную функцию Javascript при успешной оплате. Так-как модальное окно слишком быстро закрывается пользователь не может понять что оплата прошла + после оплаты мне надо почистить S_SESSION что-бы удалить данные о корзине. Можно как-то сделать вызов свой функции или хотя-бы автоматический редирект на страницу пост оплаты?

p.s  Повторюсь, использую Qiwi Checkout Popup (генерацию модального окна с оплатой Qiwi )

Answer 1

[salomatin]

Сделать этого нельзя. В официальном чате ответили что код написал через одно место. Исправлять не планируют, через модальные окна сделать такое нельзя, только перенаправление на сайт QIWI

Answer 2

[Виталий]

Судя по коду попапа, он скверный и гнусный. Решение вопроса с торможением редиректа и использованием своего кастомного коллбека возможно только в случае форка этой библы и переписывании ее под себя.
В коде там хардово зашиты и тайминги и реакции, переопределение в коде не предусмотрено.
И это оф репа киви, жесть....

window.addEventListener('message', event => {
      if (event.data === 'PAYMENT_SUCCEEDED') {
        setTimeout(onPaymentSucceeded, 2000);
      } else if (event.data === 'PAYMENT_FAILED') {
        setTimeout(onPaymentFailed, 2000);
      }
    });

SUCCEEDED - мда...
сеттеймауты - мда...
любой непродуманный разработчиком выход с формы, неразрезольвенный промис -мда....
короче не лучший код, который можно было бы притянуть себе в проект.

Comments

[salomatin]

Я после того как задал вопрос тоже стал изучать их код. Подумал что это я не правильно все делаю и надо писать именно так))

Короче идея с POUP-ами была мертворожденной, зря только время убил на попытки понять механику и изучение документации. А в Яндекс деньгах все сделал за 2 - 3 часа, обидно что нужен именно QIWI

А ведь изначально задумка хорошая, оплата прямо на сайте с помощью небольшого Api. Но сделали как всегда через задницу

Answer 3

[Антон Неверов]

Самое простое - фигачить человеку в лицо "ОПЛАТА ЗАВЕРШЕНА" через alert. Пока alert висит - дальше JS выполнятся не будут. Можно так же своё модальное окно сверстать и его отображать, что тоже костыль ещё тот.

Вам правильно указали на форк. А вообще, библиотека пользуется самыми обычными iframe'ами. Такое можно самому написать. Хотя, конечно, времени больше явно уйдёт.

Comments

[salomatin]

1) Через alert() это очень не правильно
2) Даже если сделать так, то как вывести alert()? После успешной оплаты модальное окно закрывается без всяких уведомлений. Это и был вопрос, как мне отловить событие оплаты. Если-бы я мог вывести alert этот вопрос вообще-бы не задавал. Просто вызвал бы функцию вывода модального окна + отчистил-бы сессию
3) Я забил на их модальные окна и сделал перенаправление на их сайт, после успешной оплаты там перекидывает обратно на нужную страницу