Глобальные платежи Realex HPP - НЕ отправлять на merchantUrl - PullRequest
Новая
       22

Глобальные платежи Realex HPP - НЕ отправлять на merchantUrl

0 голосов
/ 12 февраля 2020

Мы пытаемся интегрировать платеж в React с нашим бэкэндом. После успеха hpp.lightbox.init() он автоматически отправляет браузер на merchantUrl. Мы не хотим эту функциональность, потому что наше приложение является SPA, поэтому мы не хотим, чтобы пользователь был перенаправлен куда-либо. Вместо этого мы хотели бы отправить его в нашу конечную точку бэкэнда и позволить пользователю перейти к следующему разделу SPA.

Ниже приведен пример кода, который мы использовали. 

RealexHpp.setHppUrl("https://pay.sandbox.realexpayments.com/pay");
RealexHpp.lightbox.init("payNowButtonId", "backendUrlRealexWillSendToUponReceivingResponse", jsonFromRequestEndpoint);

В этом примере мы не хотим отправлять на "backendUrlRealexWillSendToUponReceivingResponse", но хотели бы получить ответ init() и сами передать данные на "backendUrlRealexWillSendToUponReceivingResponse".

Мы посмотрели на исходный код (строки 350-362) и кажется, что RealexHpp создает форму, присоединяет форму к DOM, а затем отправляет форму с данными ответа.

Видя это, мы попытались прослушать любые отправленные формы, прослушать создания форм как на document, так и на window, но безрезультатно.

Так, как подсказывает заголовок. Как мы можем обработать форму, не отправляя пользователя на другую страницу?

1 Ответ

0 голосов
/ 17 февраля 2020

Как ведет себя библиотека JS, вы уже упоминали выше. Форма создается из ответа HPP и затем отправляется на URL-адрес ответа.

В приведенном ниже примере вы можете оставить этот аргумент пустым. Что предотвратит отправку и перенаправление формы на URl.

Для захвата ответа вы можете добавить прослушиватель событий для поиска ответа от HPP. 

RealexHpp.setHppUrl("https://pay.sandbox.realexpayments.com/pay");
RealexHpp.lightbox.init("payButtonId", "", jsonFromRequestEndpoint);
if (window.addEventListener) {
    window.addEventListener('message', function(e) { receiveMessage(e.data);}, false);
} else {
    window.attachEvent('message', receiveMessage);
}

В приведенном выше Например, у меня есть функция с именем receiveMessage, но вы можете реализовать аналогичную функцию для выполнения другой задачи.

...