MasterCard Payment Gateway API Single Page App

TomFirth picture TomFirth · Jan 3, 2017 · Viewed 7.5k times · Source

I am using the Mastercard Payment Gateway API for Hosted Session: Mastercard Payment Gateway API Documentation

The integration works as expected on the first load but this has been written into a single page app. When the user goes back a page via the breadcrumbs (using javascript hash to load 'pages'). When the user then returns to the payment 'page' the Mastercard payment api should then be triggered a second time, this does not happen.

The documentation doesn't say if PaymentSession.configure({}) can be sent more than once but I am assuming that is my issue.

I have tried to 'reset' the PaymentSession and reload the session.js javascript but so far have not been able to get this particular case working. I was wondering if there is a way to 'reset' the configure() or if there was another way to approach this?

I would rather not copy and paste my code in as it's a payment integration although it's pretty much line for line the same as the example on the documentation. I would also say that the issue is unrelated my personal code and more towards how Mastercard's Payment API works and the fact that my website is a single page rather than only loading session.js when needed.

Answer

TomFirth picture TomFirth · Jan 4, 2017

I don't like it when the answer is given by the op, but I have a solution:

$.getScript("<mastercard url + version + merchant id>/session.js", function() { 
  //PaymentSession && PaymentSession.configure(); 
});

This uses jQuery to load session.js every time the single page payment hash is called. Once the MasterCard payment script has been executed it then runs the PaymentSession.configure().

My company will be eventually moving away from the MasterCard payment api so this is a suitable solution and doesn't add too much to the page load. I would still be very interested in learning whether or not this script can be reset another way.