Question

我正在使用万事达卡支付网关API进行托管会话：Mastercard Payment Gateway API Documentation

集成在第一次加载时按预期工作，但这已写入单页应用程序。当用户通过面包屑返回页面时（使用javascript哈希来加载'pages'）。当用户返回到付款“页面”时，万事达卡付款api应该再次触发，这不会发生。

文档没有说明PaymentSession.configure({})是否可以发送多次，但我认为这是我的问题。

我尝试'重置'PaymentSession并重新加载session.js javascript，但到目前为止还没能让这个特殊情况有效。我想知道是否有办法'重置'configure()或者是否还有其他办法可以解决这个问题？

我宁愿不复制和粘贴我的代码，因为它是支付集成，尽管它与文档中的示例相同。我还要说这个问题与我的个人代码无关，更多的是万事达卡的支付API如何运作，以及我的网站是单页而不是仅在需要时加载session.js这一事实。

Answer 1

当op给出答案时，我不喜欢它，但我有一个解决方案：

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

每次调用单页支付哈希时，这都会使用jQuery加载session.js。万事达卡付款脚本执行完毕后，运行PaymentSession.configure()。

我的公司最终将远离MasterCard支付api，因此这是一个合适的解决方案，并且不会为页面加载增加太多。我仍然非常有兴趣了解这个脚本是否可以通过其他方式重置。

Answer 2

先安装 jquery，然后在你的组件中执行此操作

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",
                        },
                    },
                });
            }
        }
    );

万事达卡支付网关API单页应用程序

2 个答案: