admin管理员组文章数量:1393570
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.
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.
Share Improve this question asked Jan 3, 2017 at 16:46 TomFirthTomFirth 2,3644 gold badges21 silver badges32 bronze badges 1- Hi, hope all is well. I am currently using firebase as my backend and im starting the integration process with MPGS, will i be able to acplish it with firebase or will i be to have a nodeJS express server to do that for me? – kd12345 Commented Mar 28, 2023 at 13:01
2 Answers
Reset to default 1I 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 pany 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.
install jquery first then do this in your ponent
declare const PaymentSession: any;
$.getScript(
<"mastercard url/version/merchantId>/session.js",
function () {
if (PaymentSession) {
PaymentSession.configure({
fields: {
// ATTACH HOSTED FIELDS TO YOUR PAYMENT PAGE FOR A CREDIT CARD
card: {
number: "#card-number",
securityCode: "#security-code",
expiryMonth: "#expiry-month",
expiryYear: "#expiry-year",
nameOnCard: "#cardholder-name",
},
},
session: "xxxxxxxxxxxxxxxx",
//SPECIFY YOUR MITIGATION OPTION HERE
frameEmbeddingMitigation: ["javascript"],
callbacks: {
initialized: function (response) {
console.log(response);
// HANDLE INITIALIZATION RESPONSE
},
formSessionUpdate: function (response) {
// HANDLE RESPONSE FOR UPDATE SESSION
if (response.status) {
if ("ok" == response.status) {
console.log(
"Session updated with data: " +
response.session.id
);
//check if the security code was provided by the user
if (
response.sourceOfFunds.provided.card
.securityCode
) {
console.log(
"Security code was provided."
);
}
//check if the user entered a Mastercard credit card
if (
response.sourceOfFunds.provided.card
.scheme == "MASTERCARD"
) {
console.log(
"The user entered a Mastercard credit card."
);
}
} else if (
"fields_in_error" == response.status
) {
console.log(
"Session update failed with field errors."
);
if (response.errors.cardNumber) {
console.log(
"Card number invalid or missing."
);
}
if (response.errors.expiryYear) {
console.log(
"Expiry year invalid or missing."
);
}
if (response.errors.expiryMonth) {
console.log(
"Expiry month invalid or missing."
);
}
if (response.errors.securityCode) {
console.log(
"Security code invalid."
);
}
} else if (
"request_timeout" == response.status
) {
console.log(
"Session update failed with request timeout: " +
response.errors.message
);
} else if (
"system_error" == response.status
) {
console.log(
"Session update failed with system error: " +
response.errors.message
);
}
} else {
console.log(
"Session update failed: " + response
);
}
},
},
interaction: {
displayControl: {
formatCard: "EMBOSSED",
invalidFieldCharacters: "REJECT",
},
},
});
}
}
);
本文标签： javascriptMasterCard Payment Gateway API Single Page AppStack Overflow
版权声明：本文标题：javascript - MasterCard Payment Gateway API Single Page App - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744764584a2623960.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论