Question

我在Angular 6项目中使用rxp-js库遇到麻烦。

因此我将rxp-js添加到angular.json中，因此我可以在组件中使用它，因为该库还没有模块或类型；

在我拥有的组件上方

declare let RealexHpp;

OnInit我只是从服务器获取JSON来初始化灯箱。

this.realexJSON  = await this.dataService.getRealexJson();

RealexHpp.setHppUrl("https://pay.sandbox.realexpayments.com/pay");
RealexHpp.init("realex-button", 'http://localhost:1337/responseurl', this.realexJSON);

一切正常。我可以添加虚拟卡详细信息并提交付款。

这是棘手的地方。 rxp-js会执行一个html文章，该文章在角度上会导致页面重定向到响应URL。因此，如何不破坏整个用户体验。

重定向到api响应的内容，因此您可以创建一个页面，其中包含重定向回客户端的信息。

但是所有这些都在同一窗口中。

所以我进入了rxp-js，并添加了一行以在这样的新窗口中打开表单

//Create a form and submit the hpp response to the merchant's response url
var form = document.createElement("form");
form.setAttribute("method", "POST");
form.setAttribute("action", merchantUrl);
form.setAttribute("target",'_blank');
form.appendChild(internal.createFormHiddenInput("hppResponse", response));
document.body.appendChild(form)
form.submit()

因此，它将在新窗口中打开，服务器响应将返回一条消息，提示其将重定向回去，然后关闭该窗口。

但是现在灯箱仍然打开。

总而言之，黑客入侵该库以使其无法正常工作。

如果不做html帖子，您是否无法处理HPP_Hosted_Response。或至少知道何时收到响应。

说实话，Realex并不是真正的便捷付款集成。

Angular 6中的Realex HPP付款

0 个答案: